| 1 |
@import "tailwindcss/base"; |
| 2 |
@import "tailwindcss/components"; |
| 3 |
@import "tailwindcss/utilities"; |
| 4 |
|
| 5 |
@import "./classes/aspect-ratio"; |
| 6 |
@import "./classes/clip-path"; |
| 7 |
@import "./classes/columns"; |
| 8 |
@import "./classes/direction"; |
| 9 |
@import "./classes/inline-list"; |
| 10 |
@import "./classes/misc"; |
| 11 |
@import "./classes/text-stroke"; |
| 12 |
|
| 13 |
@import "./classes/editor/no-caption"; |
| 14 |
@import "./classes/editor/no-inserter"; |
| 15 |
@import "./classes/editor/no-resize"; |
| 16 |
@import "./classes/editor/pointer-events"; |
| 17 |
|
| 18 |
@import "./block-styles/cover-angled"; |
| 19 |
|
| 20 |
@import "./fallback/colors"; |
| 21 |
@import "./fallback/font-sizes"; |
| 22 |
@import "./fallback/grid"; |
| 23 |
@import "./fallback/group"; |
| 24 |
@import "./fallback/image"; |
| 25 |
|
| 26 |
body { |
| 27 |
/* no suggestion */ |
| 28 |
/* We need to abstract this out of tailwind.config because clamp doesnt translate with negative margins */ |
| 29 |
--extendify--spacing--large: var( |
| 30 |
--wp--custom--spacing--large, |
| 31 |
clamp(2em, 8vw, 8em) |
| 32 |
); |
| 33 |
|
| 34 |
/* Add pattern preset font sizes */ |
| 35 |
--wp--preset--font-size--ext-small: 1rem; |
| 36 |
--wp--preset--font-size--ext-medium: 1.125rem; |
| 37 |
--wp--preset--font-size--ext-large: clamp(1.65rem, 3.5vw, 2.15rem); |
| 38 |
--wp--preset--font-size--ext-x-large: clamp(3rem, 6vw, 4.75rem); |
| 39 |
--wp--preset--font-size--ext-xx-large: clamp(3.25rem, 7.5vw, 5.75rem); |
| 40 |
|
| 41 |
/* Fallbacks for pre 5.9 themes */ |
| 42 |
--wp--preset--color--black: #000; |
| 43 |
--wp--preset--color--white: #fff; |
| 44 |
} |
| 45 |
|
| 46 |
.ext * { |
| 47 |
box-sizing: border-box; |
| 48 |
} |
| 49 |
|
| 50 |
/* Astra: Remove spacer block visuals in the library */ |
| 51 |
.block-editor-block-preview__content-iframe |
| 52 |
.ext |
| 53 |
[data-type="core/spacer"] |
| 54 |
.components-resizable-box__container { |
| 55 |
/* no suggestion */ |
| 56 |
background: transparent !important; |
| 57 |
} |
| 58 |
|
| 59 |
.block-editor-block-preview__content-iframe |
| 60 |
.ext |
| 61 |
[data-type="core/spacer"] |
| 62 |
.block-library-spacer__resize-container::before { |
| 63 |
/* no suggestion */ |
| 64 |
display: none !important; |
| 65 |
} |
| 66 |
|
| 67 |
/* Twenty Twenty adds a lot of margin automatically to blocks. We only want our own margin added to our patterns. */ |
| 68 |
.ext .wp-block-group__inner-container figure.wp-block-gallery.alignfull { |
| 69 |
/* no suggestion */ |
| 70 |
margin-top: unset; |
| 71 |
margin-bottom: unset; |
| 72 |
} |
| 73 |
|
| 74 |
/* Ensure no funky business is assigned to alignwide */ |
| 75 |
.ext .alignwide { |
| 76 |
/* no suggestion */ |
| 77 |
@apply ext-mx-auto !important; |
| 78 |
} |
| 79 |
|
| 80 |
/* Negate blockGap being inappropriately assigned in the editor */ |
| 81 |
.is-root-container.block-editor-block-list__layout |
| 82 |
> [data-align="full"]:not(:first-of-type) |
| 83 |
> .ext-my-0, |
| 84 |
.is-root-container.block-editor-block-list__layout |
| 85 |
> [data-align="wide"] |
| 86 |
> .ext-my-0 { |
| 87 |
/* no suggestion */ |
| 88 |
margin-top: calc(-1 * var(--wp--style--block-gap, 28px)) !important; |
| 89 |
} |
| 90 |
|
| 91 |
/* Ensure vh content in previews looks taller */ |
| 92 |
.block-editor-block-preview__content-iframe .preview\:min-h-50 { |
| 93 |
/* no suggestion */ |
| 94 |
min-height: 50vw !important; |
| 95 |
} |
| 96 |
|
| 97 |
.block-editor-block-preview__content-iframe .preview\:min-h-60 { |
| 98 |
/* no suggestion */ |
| 99 |
min-height: 60vw !important; |
| 100 |
} |
| 101 |
|
| 102 |
.block-editor-block-preview__content-iframe .preview\:min-h-70 { |
| 103 |
/* no suggestion */ |
| 104 |
min-height: 70vw !important; |
| 105 |
} |
| 106 |
|
| 107 |
.block-editor-block-preview__content-iframe .preview\:min-h-80 { |
| 108 |
/* no suggestion */ |
| 109 |
min-height: 80vw !important; |
| 110 |
} |
| 111 |
|
| 112 |
.block-editor-block-preview__content-iframe .preview\:min-h-100 { |
| 113 |
/* no suggestion */ |
| 114 |
min-height: 100vw !important; |
| 115 |
} |
| 116 |
|
| 117 |
/* Removes excess margin when applied to the alignfull parent div in Block Themes */ |
| 118 |
.ext-mr-0.alignfull:not([style*="margin"]) { |
| 119 |
/* no suggestion */ |
| 120 |
margin-right: 0 !important; |
| 121 |
} |
| 122 |
|
| 123 |
.ext-ml-0:not([style*="margin"]) { |
| 124 |
/* no suggestion */ |
| 125 |
margin-left: 0 !important; |
| 126 |
} |
| 127 |
|
| 128 |
/* Ensures fullwidth blocks display properly in the editor when margin is zeroed out */ |
| 129 |
.is-root-container |
| 130 |
.wp-block[data-align="full"] |
| 131 |
> .ext-mx-0:not([style*="margin"]) { |
| 132 |
/* no suggestion */ |
| 133 |
margin-right: calc(1 * var(--wp--custom--spacing--outer, 0)) !important; |
| 134 |
margin-left: calc(1 * var(--wp--custom--spacing--outer, 0)) !important; |
| 135 |
overflow: hidden; |
| 136 |
width: unset; |
| 137 |
} |
| 138 |
|
