diff --git a/src/scss/_drawing.scss b/src/scss/_drawing.scss index c4d6e52..1f59902 100644 --- a/src/scss/_drawing.scss +++ b/src/scss/_drawing.scss @@ -10,5 +10,6 @@ @import 'components/navbars'; @import 'components/pagination'; @import 'components/cards'; +@import 'components/menus'; @import 'components/tables'; @import 'components/previews'; diff --git a/src/scss/components/_buttons.scss b/src/scss/components/_buttons.scss index 2a33c5a..5935aae 100644 --- a/src/scss/components/_buttons.scss +++ b/src/scss/components/_buttons.scss @@ -95,13 +95,6 @@ $breadcrumb_margin: $button-large/2.5; text-decoration:none; } -.menu-label { - @include shape-style($button_small); - @include button-hover(); - padding-left: $button_small; - padding-right: $button_small; -} - // NAVBAR SPECIAL BUTTONS .btn-navbar { diff --git a/src/scss/components/_cards.scss b/src/scss/components/_cards.scss index cd3d9fd..a29a03d 100644 --- a/src/scss/components/_cards.scss +++ b/src/scss/components/_cards.scss @@ -15,7 +15,7 @@ $card-smallpad: $lineheight_half; } } -.card, .menu { +.card { @include panel($card-bigpad); display: flex; flex-direction: column; @@ -30,71 +30,6 @@ $card-smallpad: $lineheight_half; margin-right: 0.5em; } } - - /* Menu handling */ - - &-menu { - display:flex; - flex-direction: column; - - ul { - margin:0; - padding:0; - } - - li { - list-style: none; - padding:0; - margin:0; - } - - .menu-element, .menu-element-link, li a, li a:visited { - display:flex; - line-height:$lineheight; - padding-right:$lineheight_half; - padding-left:$lineheight_quarter; - padding-top:$lineheight_quarter; - padding-bottom:$lineheight_quarter; - margin:0; - justify-content: space-between; - - word-wrap:none; - white-space: nowrap; - text-overflow: ellipsis; - overflow:hidden; - - @include shape-style($lineheight_half); - @include button-hover(); - @include prefer-no-borders(); - - strong { - font-weight: 900; - color:get-color("dark")!important; - } - - &.noflex { - & :first-child { - min-width:2rem; - } - justify-content: flex-start; - - } - } - - a, a:visited { - @include shape-style($lineheight_half); - @include button-hover(); - @include button-fullcontrol(transparent, accentuate($color-background-alt), $color-primary); - } - - .menu-divider { - position: relative; - left: -$lineheight_quarter; - font-weight: $fontweight_hyper; - padding-top:$lineheight_quarter; - padding-bottom:$lineheight_quarter; - } - } } /* CARD LIST - Make a list part of a card */ diff --git a/src/scss/components/_menus.scss b/src/scss/components/_menus.scss new file mode 100644 index 0000000..0a33c3c --- /dev/null +++ b/src/scss/components/_menus.scss @@ -0,0 +1,71 @@ +/* Menu handling */ + +.card-menu { + display:flex; + flex-direction: column; + + ul { + margin:0; + padding:0; + } + + li { + list-style: none; + padding:0; + margin:0; + } + + .menu-element, .menu-element-link, li a, li a:visited { + display:flex; + line-height:$lineheight; + padding-right:$lineheight_half; + padding-left:$lineheight_quarter; + padding-top:$lineheight_quarter; + padding-bottom:$lineheight_quarter; + margin:0; + justify-content: space-between; + + word-wrap:none; + white-space: nowrap; + text-overflow: ellipsis; + overflow:hidden; + + @include shape-style($lineheight_half); + @include button-hover(); + @include prefer-no-borders(); + + strong { + font-weight: 900; + color:get-color("dark")!important; + } + + &.noflex { + & :first-child { + min-width:2rem; + } + justify-content: flex-start; + + } + } + + a, a:visited { + @include shape-style($lineheight_half); + @include button-hover(); + @include button-fullcontrol(transparent, accentuate($color-background-alt), $color-primary); + } + + .menu-divider { + position: relative; + left: -$lineheight_quarter; + font-weight: $fontweight_hyper; + padding-top:$lineheight_quarter; + padding-bottom:$lineheight_quarter; + } +} + +.menu-label { + @include shape-style($button_small); + @include button-hover(); + padding-left: $button_small; + padding-right: $button_small; +}