diff --git a/assets/dist/app.css b/assets/dist/app.css index 96dbca2..115195b 100644 --- a/assets/dist/app.css +++ b/assets/dist/app.css @@ -93,7 +93,7 @@ --siteWidth: 1120px; --blogWidth: 650px; --gridGap: 20px; - --gridRim: 10px; + --gridRim: 1rem; --tileGap: 20px; --gRadius: 4px; --gTransition: all .25s ease-in-out; @@ -896,8 +896,6 @@ select { .the-content { letter-spacing: calc(0.01 * var(--fontSize)); overflow-wrap: break-word; } - .the-content > .alignfull.has-background:first-child { - margin-top: calc(-1 * var(--groupSpacing)); } .the-content ul, .the-content ol { padding-left: 1.25rem; } .the-content h1, .the-content h2, .the-content h3, .the-content h4, .the-content h5, .the-content h6 { @@ -915,7 +913,7 @@ select { max-width: var(--blogWidth); } @media (max-width: 1120px) { - .the-content, + body:not(.single-post) .the-content, .has-background .wp-block-group__inner-container, .wp-block-cover__inner-container { padding-right: var(--gridRim); @@ -1049,7 +1047,8 @@ select { margin: 2.5rem auto; padding: 0; width: 120px; - line-height: 1; } + line-height: 1; + clear: both; } .wp-block-separator.is-style-wide { width: var(--siteWidth); } .wp-block-separator.is-style-dots { @@ -1160,8 +1159,8 @@ p.has-background { margin-right: 0.25rem; font-family: var(--hFontFamily); font-weight: 700; - font-size: 3.5rem; - line-height: 3.5rem; } + font-size: 3.25rem; + line-height: 3.25rem; } .has-small-font-size { font-size: var(--smallFontSize); } @@ -1240,7 +1239,8 @@ h1.has-background, h2.has-background, h3.has-background, h4.has-background, h5.h margin-bottom: 0; border-radius: var(--gRadius); } .wp-block-gallery a { - height: 100%; } + height: 100%; + width: 100%; } .wp-block-gallery .blocks-gallery-item__caption { border-bottom: 0; padding-bottom: 0; @@ -1425,7 +1425,7 @@ ul.blocks-gallery-grid { position: absolute; top: 0; width: 100px; - height: 4px; + height: 3px; background-color: var(--text); transform: translateX(-50%); } @@ -1450,11 +1450,6 @@ ul.blocks-gallery-grid { .wp-block-media-text.is-style-h-smaller-image { --mediaColumn: 2fr; --contentColumn: 3fr; } - @media (max-width: 1120px) { - .wp-block-media-text { - padding: 0; - margin-right: var(--gridRim); - margin-left: var(--gridRim); } } @media (max-width: 768px) { .wp-block-media-text { --columnGap: 1rem; } } @@ -1529,8 +1524,10 @@ ul.blocks-gallery-grid { .wp-block-table.is-style-stripes { --tableBg: rgbA(var(--textDimRGB), 0.05); } - .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { - background-color: white; } + .wp-block-table.is-style-stripes tbody { + background-color: transparent; } + .wp-block-table.is-style-stripes tbody tr:nth-child(even) { + background-color: var(--tableBg); } .wp-block-table .has-fixed-layout { width: 100%; diff --git a/assets/dist/my-editor.css b/assets/dist/my-editor.css index e060e5c..f154a68 100644 --- a/assets/dist/my-editor.css +++ b/assets/dist/my-editor.css @@ -91,7 +91,7 @@ --siteWidth: 1120px; --blogWidth: 650px; --gridGap: 20px; - --gridRim: 10px; + --gridRim: 1rem; --tileGap: 20px; --gRadius: 4px; --gTransition: all .25s ease-in-out; @@ -169,33 +169,33 @@ body.admin-bar { font-weight: var(--fontWeight); } .editor-post-title__block .editor-post-title__input, -.editor-styles-wrapper h1.wp-block, -.editor-styles-wrapper h2.wp-block, -.editor-styles-wrapper h3.wp-block, -.editor-styles-wrapper h4.wp-block, -.editor-styles-wrapper h5.wp-block, -.editor-styles-wrapper h6.wp-block, +.editor-styles-wrapper h1, +.editor-styles-wrapper h2, +.editor-styles-wrapper h3, +.editor-styles-wrapper h4, +.editor-styles-wrapper h5, +.editor-styles-wrapper h6, .editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter { font-family: var(--hFontFamily); font-weight: var(--hFontWeight); text-transform: var(--hTextTransform); } -.editor-styles-wrapper h1.wp-block { +.editor-styles-wrapper h1 { font-size: var(--h1Size); } -.editor-styles-wrapper h2.wp-block { +.editor-styles-wrapper h2 { font-size: var(--h2Size); } -.editor-styles-wrapper h3.wp-block { +.editor-styles-wrapper h3 { font-size: var(--h3Size); } -.editor-styles-wrapper h4.wp-block { +.editor-styles-wrapper h4 { font-size: var(--h4Size); } -.editor-styles-wrapper h5.wp-block { +.editor-styles-wrapper h5 { font-size: var(--h5Size); } -.editor-styles-wrapper h6.wp-block { +.editor-styles-wrapper h6 { font-size: var(--h6Size); } .wp-block-quote.has-text-align-center { @@ -244,8 +244,8 @@ body.admin-bar { --tableBg: rgbA(var(--greenRGB), 0.1); --tableBorder: var(--green); } .wp-block-table .has-subtle-pale-blue-background-color { - --tableHeader: rgbA(var(--blueRGB), 0.4); - --tableBg: rgbA(var(--blueRGB), 0.2); + --tableHeader: rgbA(var(--blueRGB), 0.2); + --tableBg: rgbA(var(--blueRGB), 0.1); --tableBorder: var(--blue); } .wp-block-table .has-subtle-pale-pink-background-color { --tableHeader: rgbA(var(--redRGB), 0.2); diff --git a/assets/sass/_css-vars-and-fonts.sass b/assets/sass/_css-vars-and-fonts.sass index 11e3697..d0d59ba 100644 --- a/assets/sass/_css-vars-and-fonts.sass +++ b/assets/sass/_css-vars-and-fonts.sass @@ -72,7 +72,7 @@ --siteWidth : #{ $size-large } --blogWidth : 650px --gridGap : 20px - --gridRim : 10px + --gridRim : 1rem --tileGap : 20px diff --git a/assets/sass/blocks/_core-static.sass b/assets/sass/blocks/_core-static.sass index 3588c27..9a22533 100644 --- a/assets/sass/blocks/_core-static.sass +++ b/assets/sass/blocks/_core-static.sass @@ -12,10 +12,6 @@ letter-spacing: calc(0.01 * var(--fontSize)) overflow-wrap: break-word - - > .alignfull.has-background:first-child - margin-top: calc(-1 * var(--groupSpacing)) - ul, ol padding-left: 1.25rem @@ -36,7 +32,8 @@ margin: 0 auto max-width: var(--blogWidth) -.the-content, +// Add rim to the side +body:not(.single-post) .the-content, .has-background .wp-block-group__inner-container, .wp-block-cover__inner-container @media ($below-l) @@ -215,6 +212,7 @@ padding: 0 width: 120px line-height: 1 + clear: both &.is-style-wide width: var(--siteWidth) diff --git a/assets/sass/blocks/_core.sass b/assets/sass/blocks/_core.sass index 310a610..6d4ec9f 100644 --- a/assets/sass/blocks/_core.sass +++ b/assets/sass/blocks/_core.sass @@ -21,8 +21,8 @@ p.has-background margin-right: 0.25rem font-family: var(--hFontFamily) font-weight: 700 - font-size: 3.5rem - line-height: 3.5rem + font-size: 3.25rem + line-height: 3.25rem .has-small-font-size font-size: var(--smallFontSize) @@ -134,6 +134,7 @@ h1, h2, h3, h4, h5, h6 a height: 100% + width: 100% .blocks-gallery-item__caption @extend %figcaption @@ -349,7 +350,7 @@ ul.blocks-gallery-grid position: absolute top: 0 width: 100px - height: 4px + height: 3px background-color: var(--text) transform: translateX(-50%) @@ -384,11 +385,6 @@ ul.blocks-gallery-grid &.is-style-h-smaller-image --mediaColumn: 2fr --contentColumn: 3fr - - @media ($below-l) - padding: 0 - margin-right: var(--gridRim) - margin-left: var(--gridRim) @media ($below-s) --columnGap: 1rem @@ -492,8 +488,10 @@ ul.blocks-gallery-grid &.is-style-stripes --tableBg: #{ rgba(--textDim, .05) } - tbody tr:nth-child(odd) - background-color: white + tbody + background-color: transparent + tbody tr:nth-child(even) + background-color: var(--tableBg) .has-fixed-layout width: 100% diff --git a/assets/sass/my-editor.sass b/assets/sass/my-editor.sass index 2ed3ac8..2e8a4a6 100644 --- a/assets/sass/my-editor.sass +++ b/assets/sass/my-editor.sass @@ -23,34 +23,30 @@ font-weight: var(--fontWeight) .editor-post-title__block .editor-post-title__input, -.editor-styles-wrapper h1.wp-block, -.editor-styles-wrapper h2.wp-block, -.editor-styles-wrapper h3.wp-block, -.editor-styles-wrapper h4.wp-block, -.editor-styles-wrapper h5.wp-block, -.editor-styles-wrapper h6.wp-block, +.editor-styles-wrapper h1, +.editor-styles-wrapper h2, +.editor-styles-wrapper h3, +.editor-styles-wrapper h4, +.editor-styles-wrapper h5, +.editor-styles-wrapper h6, .editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter font-family: var(--hFontFamily) font-weight: var(--hFontWeight) text-transform: var(--hTextTransform) -.editor-styles-wrapper h1.wp-block - font-size: var(--h1Size) - -.editor-styles-wrapper h2.wp-block - font-size: var(--h2Size) - -.editor-styles-wrapper h3.wp-block - font-size: var(--h3Size) - -.editor-styles-wrapper h4.wp-block - font-size: var(--h4Size) - -.editor-styles-wrapper h5.wp-block - font-size: var(--h5Size) - -.editor-styles-wrapper h6.wp-block - font-size: var(--h6Size) +.editor-styles-wrapper + h1 + font-size: var(--h1Size) + h2 + font-size: var(--h2Size) + h3 + font-size: var(--h3Size) + h4 + font-size: var(--h4Size) + h5 + font-size: var(--h5Size) + h6 + font-size: var(--h6Size) ///// QUOTE @@ -112,8 +108,8 @@ --tableBorder: var(--green) .has-subtle-pale-blue-background-color - --tableHeader: #{ rgba(--blue, .4) } - --tableBg: #{ rgba(--blue, .2) } + --tableHeader: #{ rgba(--blue, .2) } + --tableBg: #{ rgba(--blue, .1) } --tableBorder: var(--blue) .has-subtle-pale-pink-background-color diff --git a/style.css b/style.css index 224e6bf..65ab71a 100644 --- a/style.css +++ b/style.css @@ -3,7 +3,7 @@ Theme Name: Edje Basic Theme Author: Pixel Studio Author URI: https://pixelstudio.id Description: Base theme for EDJE framework - Built using Timber and ACF -Version: 8.1.0 +Version: 8.2.0 Tags: private theme, timber, edje, acf, woocomemrce, custom-menu, editor-style */