diff --git a/elements/_grouping.scss b/elements/_grouping.scss index 7e61702..e9f92fb 100644 --- a/elements/_grouping.scss +++ b/elements/_grouping.scss @@ -141,6 +141,11 @@ dl, ul, ol { margin: config.$space_double 0; + + &.block { + padding: 1em 5em; + background-color: config.$color_darker; + } } ul, @@ -154,6 +159,32 @@ ol { @extend .float_space_left; } } + + &.link { + li { + margin-bottom: config.$space_tiny * 2; + text-transform: uppercase; + + a { + display: block; + padding: config.$padding_basic; + color: config.$color_text_basic; + + img { + margin-right: config.$space_basic; + padding-bottom: 0.2em; + vertical-align: text-bottom; + } + + &:active, + &:focus, + &:hover { + background-color: config.$color_action_basic; + color: config.$color_highlight_basic; + } + } + } + } } menu { @@ -198,32 +229,6 @@ ul { } } -.list_link { - li { - margin-bottom: config.$space_tiny * 2; - text-transform: uppercase; - - a { - display: block; - padding: config.$padding_basic; - color: config.$color_text_basic; - - img { - margin-right: config.$space_basic; - padding-bottom: 0.2em; - vertical-align: text-bottom; - } - - &:active, - &:focus, - &:hover { - background-color: config.$color_action_basic; - color: config.$color_highlight_basic; - } - } - } -} - // Embedded // ----------------------------------------------------------------------------- figure { @@ -299,6 +304,17 @@ div { &.inline { @extend %flex-inline; } + + &.stretch { + flex-flow: row wrap; + align-items: stretch; + justify-content: space-between; + gap: config.$space_half config.$space_basic; + + & > * { + flex: auto; + } + } } // Grid