_style.scss (1353B)
1 .wp-block-image { 2 text-align: center; 3 4 figcaption { 5 color: var(--global--color-primary); 6 font-size: var(--global--font-size-xs); 7 line-height: var(--global--line-height-body); 8 margin-top: calc(0.5 * var(--global--spacing-unit)); 9 margin-bottom: var(--global--spacing-unit); 10 text-align: center; 11 } 12 13 .alignright { 14 margin-left: var(--global--spacing-horizontal); 15 } 16 17 .alignleft { 18 margin-right: var(--global--spacing-horizontal); 19 } 20 21 a:focus img { 22 outline-offset: 2px; 23 } 24 } 25 26 // Remove vertical margins from image block wrappers when floated 27 .entry-content > *[class="wp-block-image"], 28 .entry-content [class*="inner-container"] > *[class="wp-block-image"] { 29 margin-top: 0; 30 margin-bottom: 0; 31 32 // Remove top margins from the following element when previous image block is floated 33 + * { 34 margin-top: 0; 35 } 36 } 37 38 // Block Styles 39 .wp-block-image.is-style-twentytwentyone-border img, 40 .wp-block-image.is-style-twentytwentyone-image-frame img { 41 border: calc(3 * var(--separator--height)) solid var(--global--color-border); 42 } 43 44 .wp-block-image.is-style-twentytwentyone-image-frame img { 45 padding: var(--global--spacing-unit); 46 } 47 48 .entry-content { 49 50 > .wp-block-image { 51 52 > .alignleft, 53 > .alignright { 54 @include media(mobile) { 55 max-width: 50%; 56 } 57 @include media(mobile-only) { 58 margin-left: 0; 59 margin-right: 0; 60 } 61 } 62 } 63 }