Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

TT1-blocks: Update theme json #29

Draft
wants to merge 12 commits into
base: trunk
Choose a base branch
from
Draft

TT1-blocks: Update theme json #29

Show file tree
Hide file tree
Changes from 10 commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
f636c34
removed obvious unnecesary css
MaggieCabrera Mar 30, 2023
d04760a
removed border block style from patterns
MaggieCabrera Mar 30, 2023
c22ec9d
updated minimum WP version
MaggieCabrera Mar 30, 2023
3148678
removed alignments CSS
MaggieCabrera Mar 30, 2023
de3c61f
Update theme.json
carolinan Mar 31, 2023
00c46aa
Update theme.json
carolinan Mar 31, 2023
baecc1c
Update theme.json
carolinan Mar 31, 2023
ea6cd3d
Merge remote-tracking branch 'origin/tt1-css-cleanup' into tt1-theme-…
MaggieCabrera Jun 1, 2023
7b75166
removed nav links css
MaggieCabrera Jun 2, 2023
4999dac
remove some separator styles
MaggieCabrera Jun 2, 2023
6adab89
moved text decoration to theme.json
MaggieCabrera Jun 2, 2023
fd4acba
removed latest posts rule
MaggieCabrera Jun 2, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 2 additions & 53 deletions tt1-blocks/assets/css/blocks.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
/*--------------------------------------------------------------
# Cover
# Border, for backwards compatibility
--------------------------------------------------------------*/

.wp-block-cover.is-style-twentytwentyone-border {
.is-style-twentytwentyone-border {
border: 3px solid var(--wp--preset--color--dark-gray);
}

Expand Down Expand Up @@ -50,15 +50,6 @@
# Image
--------------------------------------------------------------*/

.wp-block-image img {
height: auto;
}

.wp-block-image.is-style-twentytwentyone-border img,
.wp-block-image.is-style-twentytwentyone-image-frame img {
border: 3px solid var(--wp--preset--color--dark-gray);
}

.wp-block-image.is-style-twentytwentyone-image-frame img {
padding: var(--wp--custom--spacing--unit);
}
Expand Down Expand Up @@ -137,36 +128,10 @@
margin-bottom: var(--wp--custom--spacing--horizontal);
}

/*--------------------------------------------------------------
# Media & Text
--------------------------------------------------------------*/

.wp-block-media-text.is-style-twentytwentyone-border {
border: 3px solid var(--wp--preset--color--dark-gray);
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/

.wp-block-navigation .wp-block-navigation-link a:hover {
text-decoration: underline;
text-underline-offset: 3px;
text-decoration-style: dotted;
text-decoration-skip-ink: none;
}

/*--------------------------------------------------------------
# Separator
--------------------------------------------------------------*/

hr,
.wp-block-separator {
border-bottom: 1px solid var(--wp--preset--color--dark-gray);
clear: both;
opacity: 1;
}

hr[style*="text-align:right"],
hr[style*="text-align: right"],
.wp-block-separator[style*="text-align:right"],
Expand All @@ -179,23 +144,7 @@ hr.is-style-twentytwentyone-separator-thick,
border-bottom-width: 3px;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we can remove this, can we?

}

.wp-block-separator.is-style-dots {
border-bottom: none;
}

.wp-block-separator.is-style-dots > hr {
display: none;
}

/* In Twenty Twenty-One, separators are 100% wide. This replicates that approach */
.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
width: 100%;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

same here, it will alter people's websites

Copy link
Collaborator Author

@carolinan carolinan Jun 2, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Active Installations: 100+

I think breaking some backward compatibility is OK because the users still gain more features that did not exist when the theme was released....

}

/*--------------------------------------------------------------
# Site Title
--------------------------------------------------------------*/

h1.wp-block-site-title a:not(:hover):not(:focus):not(:active) {
text-decoration: none;
}
47 changes: 0 additions & 47 deletions tt1-blocks/assets/css/style-shared.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
--------------------------------------------------------------*/

body {
font-family: var(--wp--custom--font-primary);
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
Expand All @@ -23,49 +22,3 @@ a:hover {
text-decoration-style: dotted;
text-decoration-skip-ink: none;
}

/*
* Gutenberg remotes this underline, but Twenty Twenty-One uses it.
*/
.site-header h1.wp-block-site-title a:not(:hover):not(:focus):not(:active) {
text-decoration: underline;
}

/*
* Alignment styles.
* These rules are temporary, and should not be relied on or
* modified too heavily by themes or plugins that build on
* Twenty Twenty-Two. These are meant to be a precursor to
* a global solution provided by the Block Editor.
*
* Relevant issues:
* https://github.com/WordPress/gutenberg/issues/35607
* https://github.com/WordPress/gutenberg/issues/35884
*/

.wp-site-blocks,
body > .is-root-container,
.edit-post-visual-editor__post-title-wrapper,
.wp-block-group.alignfull,
.is-root-container .wp-block[data-align="full"] > .wp-block-group {
padding-left: var(--wp--custom--spacing--outer);
padding-right: var(--wp--custom--spacing--outer);
}

.wp-site-blocks .alignfull,
.is-root-container .wp-block[data-align="full"] {
margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
width: unset;
}

/* Blocks inside columns don't have negative margins. */
.wp-site-blocks .wp-block-columns .wp-block-column .alignfull,
.is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"],
/* We also want to avoid stacking negative margins. */
.wp-site-blocks .alignfull:not(.wp-block-group) .alignfull,
.is-root-container .wp-block[data-align="full"] > *:not(.wp-block-group) .wp-block[data-align="full"] {
margin-left: auto !important;
margin-right: auto !important;
width: inherit;
}
38 changes: 18 additions & 20 deletions tt1-blocks/patterns/links-area.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,26 +13,24 @@
*/

?>
<!-- wp:cover {"overlayColor":"green","contentPosition":"center center","align":"wide","className":"is-style-twentytwentyone-border"} -->
<div class="wp-block-cover alignwide has-green-background-color has-background-dim is-style-twentytwentyone-border">
<div class="wp-block-cover__inner-container">
<!-- wp:spacer {"height":20} --><div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div><!-- /wp:spacer -->
<!-- wp:paragraph {"fontSize":"huge"} --><p class="has-huge-font-size"><?php echo wp_kses_post( __( 'Let&#8217;s Connect.', 'tt1-blocks' ) ); ?></p><!-- /wp:paragraph -->
<!-- wp:spacer {"height":75} --><div style="height:75px" aria-hidden="true" class="wp-block-spacer"></div><!-- /wp:spacer -->
<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:paragraph --><p><a href="#" data-type="URL"><?php esc_html_e( 'Twitter', 'tt1-blocks' ); ?></a> / <a href="#" data-type="URL"><?php esc_html_e( 'Instagram', 'tt1-blocks' )?> </a> / <a href="#" data-type="URL"> <?php esc_html_e( 'Dribbble', 'tt1-blocks' ); ?></a></p><!-- /wp:paragraph -->
</div><!-- /wp:column -->
<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:paragraph --><p><a href="#"><?php esc_html_e( '[email protected]', 'tt1-blocks' ); ?></a></p><!-- /wp:paragraph -->
</div>
<!-- /wp:column -->
<!-- wp:group {"align":"wide","style":{"border":{"top":{"color":"var:preset|color|gray","style":"solid"},"right":{"color":"var:preset|color|gray","style":"solid"},"bottom":{"color":"var:preset|color|gray","style":"solid"},"left":{"color":"var:preset|color|gray","style":"solid"}},"spacing":{"padding":{"top":"20px","right":"20px","bottom":"20px","left":"20px"}}},"backgroundColor":"green"} -->
<div class="wp-block-group alignwide has-green-background-color has-background" style="border-top-color:var(--wp--preset--color--gray);border-top-style:solid;border-right-color:var(--wp--preset--color--gray);border-right-style:solid;border-bottom-color:var(--wp--preset--color--gray);border-bottom-style:solid;border-left-color:var(--wp--preset--color--gray);border-left-style:solid;padding-top:20px;padding-right:20px;padding-bottom:20px;padding-left:20px">
<!-- wp:spacer {"height":20} --><div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div><!-- /wp:spacer -->
<!-- wp:paragraph {"fontSize":"huge"} --><p class="has-huge-font-size"><?php echo wp_kses_post( __( 'Let&#8217;s Connect.', 'tt1-blocks' ) ); ?></p><!-- /wp:paragraph -->
<!-- wp:spacer {"height":75} --><div style="height:75px" aria-hidden="true" class="wp-block-spacer"></div><!-- /wp:spacer -->
<!-- wp:columns -->
<div class="wp-block-columns">
<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:paragraph --><p><a href="#" data-type="URL"><?php esc_html_e( 'Twitter', 'tt1-blocks' ); ?></a> / <a href="#" data-type="URL"><?php esc_html_e( 'Instagram', 'tt1-blocks' )?> </a> / <a href="#" data-type="URL"> <?php esc_html_e( 'Dribbble', 'tt1-blocks' ); ?></a></p><!-- /wp:paragraph -->
</div><!-- /wp:column -->
<!-- wp:column -->
<div class="wp-block-column">
<!-- wp:paragraph --><p><a href="#"><?php esc_html_e( '[email protected]', 'tt1-blocks' ); ?></a></p><!-- /wp:paragraph -->
</div>
<!-- /wp:columns -->
<!-- wp:spacer {"height":20} --><div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div><!-- /wp:spacer -->
<!-- /wp:column -->
</div>
<!-- /wp:columns -->
<!-- wp:spacer {"height":20} --><div style="height:20px" aria-hidden="true" class="wp-block-spacer"></div><!-- /wp:spacer -->
</div>
<!-- /wp:cover -->
<!-- /wp:group -->
25 changes: 14 additions & 11 deletions tt1-blocks/patterns/media-text-article.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,17 @@
* @since 0.4.9
*/
?>

<!-- wp:media-text {"mediaId":1752,"mediaLink":"<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/playing-in-the-sand.jpg","mediaType":"image","className":"is-style-twentytwentyone-border"} -->
<div class="wp-block-media-text alignwide is-stacked-on-mobile is-style-twentytwentyone-border">
<figure class="wp-block-media-text__media"><img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/playing-in-the-sand.jpg" alt="<?php esc_attr_e( '&#8220;Playing in the Sand&#8221; by Berthe Morisot', 'tt1-blocks' ); ?>" class="wp-image-1752"/></figure><div class="wp-block-media-text__content">
<!-- wp:heading {"align":"center"} --><h2 class="has-text-align-center"><?php esc_html_e( 'Playing in the Sand', 'tt1-blocks' ); ?></h2><!-- /wp:heading -->
<!-- wp:separator {"className":"is-style-dots"} --><hr class="wp-block-separator is-style-dots"/>
<!-- /wp:separator -->
<!-- wp:paragraph {"align":"center","fontSize":"small"} -->
<p class="has-text-align-center has-small-font-size"><?php echo wp_kses_post( __( 'Berthe Morisot<br>(French, 1841-1895)', 'tt1-blocks' ) ); ?></p><!-- /wp:paragraph -->
</div>
</div><!-- /wp:media-text -->
<!-- wp:group {"align":"wide","style":{"border":{"top":{"color":"var:preset|color|gray","style":"solid","width":"3px"},"right":{"color":"var:preset|color|gray","style":"solid","width":"3px"},"bottom":{"color":"var:preset|color|gray","style":"solid","width":"3px"},"left":{"color":"var:preset|color|gray","style":"solid","width":"3px"}}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group alignwide" style="border-top-color:var(--wp--preset--color--gray);border-top-style:solid;border-top-width:3px;border-right-color:var(--wp--preset--color--gray);border-right-style:solid;border-right-width:3px;border-bottom-color:var(--wp--preset--color--gray);border-bottom-style:solid;border-bottom-width:3px;border-left-color:var(--wp--preset--color--gray);border-left-style:solid;border-left-width:3px">
<!-- wp:media-text {"mediaId":1752,"mediaLink":"<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/playing-in-the-sand.jpg","mediaType":"image"} -->
<div class="wp-block-media-text alignwide is-stacked-on-mobile">
<figure class="wp-block-media-text__media"><img src="<?php echo esc_url( get_template_directory_uri() ); ?>/assets/images/playing-in-the-sand.jpg" alt="<?php esc_attr_e( '&#8220;Playing in the Sand&#8221; by Berthe Morisot', 'tt1-blocks' ); ?>" class="wp-image-1752"/></figure><div class="wp-block-media-text__content">
<!-- wp:heading {"align":"center"} --><h2 class="has-text-align-center"><?php esc_html_e( 'Playing in the Sand', 'tt1-blocks' ); ?></h2><!-- /wp:heading -->
<!-- wp:separator {"className":"is-style-dots"} --><hr class="wp-block-separator is-style-dots"/>
<!-- /wp:separator -->
<!-- wp:paragraph {"align":"center","fontSize":"small"} -->
<p class="has-text-align-center has-small-font-size"><?php echo wp_kses_post( __( 'Berthe Morisot<br>(French, 1841-1895)', 'tt1-blocks' ) ); ?></p><!-- /wp:paragraph -->
</div>
</div><!-- /wp:media-text -->
</div>
<!-- /wp:group -->
6 changes: 5 additions & 1 deletion tt1-blocks/readme.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
=== TT1 Blocks ===
Contributors: wordpressdotorg
Requires at least: 5.6
Tested up to: 5.8
Tested up to: 6.2
Requires PHP: 5.6
Stable tag: 0.4.8
License: GPLv2 or later
Expand All @@ -24,6 +24,10 @@ This theme is beta software, and is not meant for use on a production site. Bug
5. From your admin panel, visit the Site Editor to customize your site.

== Changelog ==

= 1.0.0 =
* Update to work with changes from WordPress 6.2 onwards

= 0.4.8 =
* Update for compatibility with Gutenberg v12.1

Expand Down
4 changes: 2 additions & 2 deletions tt1-blocks/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@ Theme URI: https://github.com/WordPress/theme-experiments/tree/master/tt1-blocks
Author: the WordPress team
Author URI: https://wordpress.org/
Description: TT1 Blocks is an experimental block-based version of the Twenty Twenty-One theme. It is built to leverage the full-site editing functionality that is being built in the Gutenberg plugin. This theme is not meant for use on a production site.
Requires at least: 5.6
Requires at least: 6.2
Tested up to: 5.8
Requires PHP: 5.6
Version: 0.4.8
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: tt1-blocks
Expand Down
Loading