richard
/
SemanSemantic-UItic-UI
mirror of https://github.com/Semantic-Org/Semantic-UI.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Adds more variables to menu, continuing to iterate on themeing

pull/636/head
jlukic 11 years ago
parent
2044966dde
commit
a80fe92281
2 changed files with 310 additions and 184 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 396
      src/collections/menu.less
  2. 98
      src/themes/default/collections/menu.variables

396
src/collections/menu.less
View File

@ -108,7 +108,8 @@
position: relative;
display: inline-block;
padding: @verticalPadding @horizontalPadding;
border-top: 0em solid rgba(0, 0, 0, 0);
border-top: @borderSize solid rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
user-select: none;
}
@ -171,13 +172,13 @@
.ui.menu:not(.vertical) .item > .button {
position: relative;
top: -0.05em;
top: @buttonOffset;
margin: -0.55em 0;
padding-bottom: 0.55em;
padding-top: 0.55em;
margin: -@buttonVerticalPadding 0;
padding-bottom: @buttonVerticalPadding;
padding-top: @buttonVerticalPadding;
font-size: 0.875em;
font-size: @buttonSize;
}
@ -186,33 +187,38 @@
---------------*/
.ui.menu:not(.vertical) .item > .input {
margin-top: -@verticalPadding;
margin-bottom: -@verticalPadding;
padding-top: 0.3em;
padding-bottom: 0.3em;
position: relative;
top: @inputOffset;
margin: @inputMargin 0em;
padding-top: (@inputVerticalPadding / 2);
padding-bottom: (@inputVerticalPadding / 2);
width: 100%;
vertical-align: top;
}
.ui.menu .item > .input input {
padding-top: 0.5em;
padding-bottom: 0.5em;
padding-top: @inputVerticalPadding;
padding-bottom: @inputVerticalPadding;
}
.ui.vertical.menu .item > .input input {
margin: 0em;
padding-top: 0.63em;
padding-bottom: 0.63em;
padding-top: @inputVerticalPadding;
padding-bottom: @inputVerticalPadding;
}
.ui.vertical.menu .ui.input > .icon {
padding-top: 0.63em;
padding-top: @inputVerticalPadding;
}
/* Action Input */
.ui.menu:not(.vertical) .item > .button.labeled > .icon {
padding-top: 0.6em;
/* Labeled Button */
.ui.menu:not(.vertical) .item > .labeled.button > .icon {
padding-top: @labeledButtonPadding;
}
/* Action Input */
.ui.menu:not(.vertical) .item .action.input > .button {
font-size: 0.8em;
padding: 0.55em 0.8em;
padding: @buttonVerticalPadding 0.8em;
}
/* Resizes */
@ -225,6 +231,7 @@
padding-bottom: 0.6em;
padding-top: 0.6em;
}
.ui.large.menu:not(.vertical) .item .action.input > .button {
font-size: 0.8em;
padding: 0.9em;
@ -238,11 +245,13 @@
---------------*/
.ui.menu .header.item {
background-color: rgba(0, 0, 0, 0.04);
background: @headerBackground;
margin: 0em;
font-size: @headerFontSize;
text-transform: @headerTextTransform;
}
.ui.vertical.menu .header.item {
font-weight: bold;
font-weight: @headerWeight;
}
@ -254,14 +263,14 @@
left: 1px;
margin: 0px;
min-width: calc(100% - 1px);
box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.1);
box-shadow: @dropdownBoxShadow;
}
.ui.secondary.menu .dropdown.item .menu {
left: 0px;
min-width: 100%;
}
.ui.menu .pointing.dropdown.item .menu {
margin-top: 0.75em;
margin-top: @dropdownPointingDistance;
}
.ui.menu .simple.dropdown.item .menu {
margin: 0px !important;
@ -277,24 +286,28 @@
display: none;
}
/* Secondary */
.ui.secondary.menu > .menu > .active.dropdown.item {
background-color: transparent;
}
/*--------------
Labels
---------------*/
.ui.menu .item > .label {
background-color: rgba(0, 0, 0, 0.35);
color: #FFFFFF;
margin: -0.15em 0em -0.15em 0.5em;
padding: 0.3em 0.8em;
background: @labelBackground;
color: @labelTextColor;
margin: @labelOffset 0em @labelOffset @labelTextMargin;
padding: @labelVerticalPadding @labelHorizontalPadding;
vertical-align: baseline;
}
.ui.menu .item > .floating.label {
padding: 0.3em 0.8em;
padding: @labelVerticalPadding @labelHorizontalPadding;
}
/*--------------
Images
Images
---------------*/
.ui.menu .item > img:only-child {
@ -404,7 +417,7 @@
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.8) url("@{imagePath}/loader-large.gif") no-repeat 50% 50%;
background: rgba(255, 255, 255, 0.8) url("@{loadingImage}") no-repeat @loadingPosition;
visibility: visible;
}
@ -421,7 +434,7 @@
display: block;
height: auto !important;
border-top: none;
border-left: 0em solid rgba(0, 0, 0, 0);
border-left: @borderSize solid rgba(0, 0, 0, 0);
border-right: none;
}
.ui.vertical.menu > .item:first-child {
@ -453,13 +466,8 @@
left: 0px;
width: 100%;
height: @dividerSize;
background-image: @verticalDividerBackground;
background: @verticalDividerBackground;
height: 1px;
background-image: linear-gradient(to right,
rgba(0, 0, 0, 0.03) 0%,
rgba(0, 0, 0, 0.1) 1.5em,
rgba(0, 0, 0, 0.03) 100%)
;
}
.ui.vertical.menu .item:first-child:before {
@ -474,8 +482,8 @@
.ui.vertical.menu .dropdown.item .menu {
top: 0% !important;
left: 100%;
margin: 0px 0px 0px 1px;
box-shadow: 0 0px 1px 1px @solidBorderColor;
margin: 0px 0px 0px @dropdownMenuOffset;
box-shadow: @dropdownVerticalBoxShadow;
}
.ui.vertical.menu .dropdown.item.active {
border-top-right-radius: 0em;
@ -508,12 +516,9 @@
Tiered
---------------*/
.ui.tiered.menu > .sub.menu > .item {
color: rgba(0, 0, 0, 0.4);
}
.ui.tiered.menu > .menu > .item:hover,
.ui.tiered.menu > .menu > .item.hover {
color: rgba(0, 0, 0, 0.8);
color: @tieredSubMenuActiveColor;
}
.ui.tiered.menu .item.active {
color: rgba(0, 0, 0, 0.8);
@ -526,22 +531,30 @@
left: 0px;
width: 100%;
height: 2px;
background-color: #FBFBFB;
height: @tieredBorderWidth;
background-color: @tieredBorderColor;
}
/* Sub Menu */
.ui.tiered.menu .sub.menu {
background-color: @subtleTransparentBlack;
border-radius: 0em;
border-top: 1px solid @borderColor;
box-shadow: none;
color: #FFFFFF;
}
.ui.tiered.menu .sub.menu .item {
.ui.tiered.menu > .sub.menu > .item {
color: @tieredSubMenuColor;
font-weight: @tieredSubMenuFontWeight;
text-transform: @tieredSubMenuTextTransform;
font-size: @subMenuFontSize;
}
/* Sub Menu Divider */
.ui.tiered.menu .sub.menu .item:before {
background-image: none;
}
/* Sub Menu Active */
.ui.tiered.menu .sub.menu .active.item {
padding-top: @verticalPadding;
background-color: transparent;
@ -559,7 +572,7 @@
color: @invertedUnselectedTextColor;
}
.ui.inverted.tiered.menu .sub.menu {
background-color: @tieredInvertedSubMenuColor;
background-color: @tieredInvertedSubMenuBackground;
}
.ui.inverted.tiered.menu .sub.menu .item {
color: @invertedLightTextColor;
@ -690,8 +703,8 @@
border: none;
height: auto !important;
margin: 0em 0.25em;
padding: 0.5em 1em;
margin: 0em @secondaryMargin;
padding: @secondaryVerticalPadding @secondaryHorizontalPadding;
border-radius: 0.3125em;
}
@ -704,52 +717,50 @@
background-color: transparent;
border: none;
}
.ui.secondary.menu .link.item,
.ui.secondary.menu a.item {
opacity: 0.8;
opacity: @secondaryLinkOpacity;
transition: none;
}
.ui.secondary.menu .header.item {
border-right: 0.1em solid rgba(0, 0, 0, 0.1);
border-right: @secondaryHeaderBorder;
background-color: transparent;
-webkit-border-radius: 0em;
-moz-border-radius: 0em;
border-radius: 0em;
}
/* hover */
/* Hover */
.ui.secondary.menu .link.item:hover,
.ui.secondary.menu a.item:hover {
opacity: 1;
}
/* active */
/* Active */
.ui.secondary.menu > .menu > .active.item,
.ui.secondary.menu > .active.item {
background-color: rgba(0, 0, 0, 0.08);
background: @secondaryActiveBackground;
opacity: 1;
box-shadow: none;
}
.ui.secondary.vertical.menu > .active.item {
border-radius: 0.3125em;
border-radius: @secondaryBorderRadius;
}
/* inverted */
/* Inverted */
.ui.secondary.inverted.menu .link.item,
.ui.secondary.inverted.menu a.item {
color: rgba(255, 255, 255, 0.5);
color: @secondaryInvertedColor;
}
.ui.secondary.inverted.menu .link.item:hover,
.ui.secondary.inverted.menu a.item:hover {
color: rgba(255, 255, 255, 0.9);
color: @secondaryInvertedHoverColor;
}
.ui.secondary.inverted.menu .active.item {
background-color: rgba(255, 255, 255, 0.1);
background-color: @secondaryInvertedActiveBackground;
}
/* disable variations */
/* Disable variations */
.ui.secondary.item.menu > .item {
margin: 0em;
}
@ -757,19 +768,68 @@
box-shadow: none;
}
/*---------------------
Secondary Vertical
-----------------------*/
.ui.secondary.vertical.menu > .item {
border: none;
margin: 0em 0em @secondaryVerticalMargin;
border-radius: @borderRadius;
}
.ui.secondary.vertical.menu > .header.item {
border-radius: 0em;
}
/* Inverted */
.ui.secondary.inverted.menu {
background-color: transparent;
}
.ui.secondary.inverted.pointing.menu {
border-bottom: @secondaryPointingBorder solid rgba(255, 255, 255, 0.1);
}
.ui.secondary.inverted.pointing.menu > .item {
color: rgba(255, 255, 255, 0.7);
}
.ui.secondary.inverted.pointing.menu > .header.item {
color: #FFFFFF !important;
}
/* Hover */
.ui.secondary.inverted.pointing.menu > .menu > .item:hover,
.ui.secondary.inverted.pointing.menu > .item:hover {
color: rgba(255, 255, 255, 0.85);
}
/* Down */
.ui.secondary.inverted.pointing.menu > .menu > .item:active,
.ui.secondary.inverted.pointing.menu > .item:active {
border-color: rgba(255, 255, 255, 0.4);
}
/* Active */
.ui.secondary.inverted.pointing.menu > .menu > .item.active,
.ui.secondary.inverted.pointing.menu > .item.active {
border-color: rgba(255, 255, 255, 0.8);
color: rgba(255, 255, 255, 1);
}
/*---------------------
Secondary Pointing
-----------------------*/
.ui.secondary.pointing.menu {
border-bottom: 3px solid rgba(0, 0, 0, 0.1);
border-bottom: @secondaryPointingBorder solid rgba(0, 0, 0, 0.1);
}
.ui.secondary.pointing.menu > .menu > .item,
.ui.secondary.pointing.menu > .item {
margin: 0em 0em -3px;
padding: 0.6em @horizontalPadding;
border-bottom: 3px solid rgba(0, 0, 0, 0);
margin: 0em 0em -@secondaryPointingBorder;
padding: @secondaryPointingVerticalPadding @secondaryPointingHorizontalPadding;
border-bottom: @secondaryPointingBorder solid rgba(0, 0, 0, 0);
border-radius: 0em;
transition:
color 0.2s
@ -778,11 +838,11 @@
/* Item Types */
.ui.secondary.pointing.menu .header.item {
margin-bottom: -3px;
margin-bottom: -@secondaryPointingBorder;
background-color: transparent !important;
border-right-width: 0px !important;
font-weight: bold !important;
color: rgba(0, 0, 0, 0.8) !important;
color: @secondaryPointingHeaderColor !important;
}
.ui.secondary.pointing.menu .text.item {
box-shadow: none !important;
@ -798,7 +858,7 @@
.ui.secondary.pointing.menu > .menu > a.item:hover,
.ui.secondary.pointing.menu > a.item:hover {
background-color: transparent;
color: rgba(0, 0, 0, 0.7);
color: @secondaryPointingHoverTextColor;
}
/* Down */
@ -807,7 +867,7 @@
.ui.secondary.pointing.menu > .menu > a.item:active,
.ui.secondary.pointing.menu > a.item:active {
background-color: transparent;
border-color: rgba(0, 0, 0, 0.2);
border-color: @secondaryPointingBorderColor;
}
/* Active */
@ -816,31 +876,21 @@
background-color: transparent;
border-color: rgba(0, 0, 0, 0.4);
box-shadow: none;
color: @secondaryPointingActiveTextColor;
}
/*---------------------
Secondary Vertical
-----------------------*/
/* Secondary Vertical Pointing */
.ui.secondary.vertical.pointing.menu {
border: none;
border-right: 3px solid rgba(0, 0, 0, 0.1);
}
.ui.secondary.vertical.menu > .item {
border: none;
margin: 0em 0em 0.3em;
padding: 0.6em 0.8em;
border-radius: @borderRadius;
}
.ui.secondary.vertical.menu > .header.item {
border-radius: 0em;
border-right: @secondaryPointingBorder solid rgba(0, 0, 0, 0.1);
}
.ui.secondary.vertical.pointing.menu > .item {
margin: 0em -3px 0em 0em;
margin: 0em -@secondaryPointingBorder 0em 0em;
border-bottom: none;
border-right: 3px solid transparent;
border-right: @secondaryPointingBorder solid transparent;
border-radius: 0em;
}
/* Hover */
.ui.secondary.vertical.pointing.menu > .item.hover,
.ui.secondary.vertical.pointing.menu > .item:hover {
@ -861,52 +911,13 @@
color: rgba(0, 0, 0, 0.85);
}
/*--------------
Inverted
---------------*/
.ui.secondary.inverted.menu {
background-color: transparent;
}
.ui.secondary.inverted.pointing.menu {
border-bottom: 3px solid rgba(255, 255, 255, 0.1);
}
.ui.secondary.inverted.pointing.menu > .item {
color: rgba(255, 255, 255, 0.7);
}
.ui.secondary.inverted.pointing.menu > .header.item {
color: #FFFFFF !important;
}
/* Hover */
.ui.secondary.inverted.pointing.menu > .menu > .item:hover,
.ui.secondary.inverted.pointing.menu > .item:hover {
color: rgba(255, 255, 255, 0.85);
}
/* Down */
.ui.secondary.inverted.pointing.menu > .menu > .item:active,
.ui.secondary.inverted.pointing.menu > .item:active {
border-color: rgba(255, 255, 255, 0.4);
}
/* Active */
.ui.secondary.inverted.pointing.menu > .menu > .item.active,
.ui.secondary.inverted.pointing.menu > .item.active {
border-color: rgba(255, 255, 255, 0.8);
color: rgba(255, 255, 255, 1);
}
/*---------------------
Inverted Vertical
----------------------*/
/* Inverted Vertical Pointing Secondary */
.ui.secondary.inverted.vertical.pointing.menu {
border-right: 3px solid rgba(255, 255, 255, 0.1);
border-right: @secondaryPointingBorder solid rgba(255, 255, 255, 0.1);
border-bottom: none;
}
/*--------------
Text Menu
---------------*/
@ -1073,38 +1084,49 @@
---------------*/
/*--- Light Colors ---*/
.ui.menu .blue.active.item,
.ui.blue.menu .active.item {
border-color: @blue !important;
color: @blue !important;
}
.ui.menu .green.active.item,
.ui.green.menu .active.item {
border-color: #A1CF64 !important;
color: #A1CF64 !important;
border-color: @green !important;
color: @green !important;
}
.ui.menu .red.active.item,
.ui.red.menu .active.item {
border-color: #D95C5C !important;
color: #D95C5C !important;
.ui.menu .orange.active.item,
.ui.orange.menu .active.item {
border-color: @orange !important;
color: @orange !important;
}
.ui.menu .blue.active.item,
.ui.blue.menu .active.item {
border-color: #6ECFF5 !important;
color: #6ECFF5 !important;
.ui.menu .pink.active.item,
.ui.pink.menu .active.item {
border-color: @pink !important;
color: @pink !important;
}
.ui.menu .purple.active.item,
.ui.purple.menu .active.item {
border-color: #564F8A !important;
color: #564F8A !important;
border-color: @purple !important;
color: @purple !important;
}
.ui.menu .orange.active.item,
.ui.orange.menu .active.item {
border-color: #F05940 !important;
color: #F05940 !important;
.ui.menu .red.active.item,
.ui.red.menu .active.item {
border-color: @red !important;
color: @red !important;
}
.ui.menu .teal.active.item,
.ui.teal.menu .active.item {
border-color: #00B5AD !important;
color: #00B5AD !important;
border-color: @teal !important;
color: @teal !important;
}
.ui.menu .yellow.active.item,
.ui.yellow.menu .active.item {
border-color: @yellow !important;
color: @yellow !important;
}
/*--------------
Inverted
---------------*/
@ -1256,46 +1278,62 @@
}
/*--- Inverted Colors ---*/
/* Blue */
.ui.inverted.blue.menu {
background-color: @blue;
}
.ui.inverted.blue.pointing.menu .active.item:after {
background-color: @blue;
}
/* Green */
.ui.inverted.green.menu {
background-color: #A1CF64;
background-color: @green;
}
.ui.inverted.green.pointing.menu .active.item:after {
background-color: #A1CF64;
background-color: @green;
}
.ui.inverted.red.menu {
background-color: #D95C5C;
/* Orange */
.ui.inverted.orange.menu {
background-color: @orange;
}
.ui.inverted.red.pointing.menu .active.item:after {
background-color: #F16883;
.ui.inverted.orange.pointing.menu .active.item:after {
background-color: @orange;
}
.ui.inverted.blue.menu {
background-color: #6ECFF5;
/* Pink */
.ui.inverted.pink.menu {
background-color: @pink;
}
.ui.inverted.blue.pointing.menu .active.item:after {
background-color: #6ECFF5;
.ui.inverted.pink.pointing.menu .active.item:after {
background-color: @pink;
}
/* Purple */
.ui.inverted.purple.menu {
background-color: #564F8A;
background-color: @purple;
}
.ui.inverted.purple.pointing.menu .active.item:after {
background-color: #564F8A;
background-color: @purple;
}
.ui.inverted.orange.menu {
background-color: #F05940;
/* Red */
.ui.inverted.red.menu {
background-color: @red;
}
.ui.inverted.orange.pointing.menu .active.item:after {
background-color: #F05940;
.ui.inverted.red.pointing.menu .active.item:after {
background-color: #F16883;
}
/* Teal */
.ui.inverted.teal.menu {
background-color: #00B5AD;
background-color: @teal;
}
.ui.inverted.teal.pointing.menu .active.item:after {
background-color: #00B5AD;
background-color: @teal;
}
/* Yellow */
.ui.inverted.yellow.menu {
background-color: @yellow;
}
.ui.inverted.yellow.pointing.menu .active.item:after {
background-color: @yellow;
}
@ -1452,7 +1490,7 @@
/* Coupling with Grid */
.ui.fixed.menu + .ui.grid {
padding-top: 2.75rem;
padding-top: @fixedGridMargin;
}
/*-------------------
@ -1461,17 +1499,17 @@
.ui.pointing.menu .active.item:after {
position: absolute;
bottom: -0.3em;
bottom: @secondaryArrowOffset;
left: 50%;
content: "";
margin-left: -0.3em;
width: 0.6em;
height: 0.6em;
margin-left: @secondaryArrowOffset;
width: @secondaryArrowSize;
height: @secondaryArrowSize;
border: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
border-right: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: @secondaryArrowBorder;
border-right: @secondaryArrowBorder;
background-image: none;
transform: rotate(45deg);

98
src/themes/default/collections/menu.variables
View File

@ -18,6 +18,8 @@
@fontWeight: normal;
@boxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
@borderSize: 0em;
@transition:
opacity 0.2s ease,
background 0.2s ease,
@ -31,7 +33,7 @@
rgba(0, 0, 0, 0.1) 50%,
rgba(0, 0, 0, 0.05) 100%)
;
@verticalDividerBackground: linear-gradient(left,
@verticalDividerBackground: linear-gradient(to right,
rgba(0, 0, 0, 0.03) 0%,
rgba(0, 0, 0, 0.1) 1.5em,
rgba(0, 0, 0, 0.03) 100%)
@ -51,7 +53,7 @@
@menuTextColor: @textColor;
/* Sub Menu */
@subMenuFontSize: 0.875em;
@subMenuFontSize: 0.875rem;
@subMenuTextColor: @textColor;
@ -59,13 +61,47 @@
Elements
---------------*/
/* Icon */
@iconMargin: 0.5em;
/* Header */
@headerBackground: rgba(0, 0, 0, 0.04);
@headerWeight: bold;
@headerTextTransform: normal;
@headerFontSize: 1rem;
/*--------------
Couplings
---------------*/
/* Button */
@buttonOffset: -0.05em;
@buttonVerticalPadding: 0.55em;
@buttonSize: 0.875em;
@labeledButtonPadding: 0.6em;
/* Input */
@inputMargin: -0.75em;
@inputOffset: -0.05em;
@inputVerticalPadding: 0.5em;
/* Label */
@labelOffset: -0.15em;
@labelBackground: rgba(0, 0, 0, 0.35);
@labelTextColor: #FFFFFF;
@labelTextMargin: 0.5em;
@labelVerticalPadding: 0.3em;
@labelHorizontalPadding: 0.8em;
/* Dropdown */
@dropdownMenuOffset: 1px;
@dropdownPointingDistance: 0.75em;
@dropdownTextColor: rgba(0, 0, 0, 0.75);
@dropdownBoxShadow: 0 1px 1px 1px @solidBorderColor;
@dropdownVerticalBoxShadow: 0 0px 1px 1px @solidBorderColor;
/*--------------
States
@ -81,14 +117,59 @@
@subMenuActiveColor: rgba(0, 0, 0, 0.03);
@loadingImage: "@{imagePath}/loader-large.gif";
@loadingPosition: 50% 50%;
/*--------------
Variations
Types
---------------*/
/* Secondary */
@secondaryArrowSize: 0.6em;
@secondaryArrowOffset: -(@secondaryArrowSize / 2);
@secondaryArrowBorder: 1px solid rgba(0, 0, 0, 0.1);
@secondaryBorderRadius: 0.3125em;
@secondaryMargin: 0.25em;
@secondaryVerticalPadding: 0.5em;
@secondaryHorizontalPadding: 1em;
@secondaryVerticalMargin: 0.3em;
@secondaryLinkOpacity: 0.8;
@secondaryHeaderBorder: 0.1em solid rgba(0, 0, 0, 0.1);
@secondaryActiveBackground: @transparentBlack;
@secondaryInvertedActiveBackground: @transparentWhite;
@secondaryInvertedColor: @invertedLightTextColor;
@secondaryInvertedHoverColor: @invertedSelectedTextColor;
/* Pointing */
@secondaryPointingBorder: 3px;
@secondaryPointingVerticalPadding: 0.6em;
@secondaryPointingHorizontalPadding: 0.95em;
@secondaryPointingBorderColor: rgba(0, 0, 0, 0.2);
@secondaryPointingHoverTextColor: @textColor;
@secondaryPointingActiveBorderColor: rgba(0, 0, 0, 0.4);
@secondaryPointingActiveTextColor: @selectedTextColor;
@secondaryPointingHeaderColor: @selectedTextColor;
/* Tiered */
@tieredBackgroundColor: @subtleTransparentBlack;
@tieredInvertedSubMenuColor: rgba(0, 0, 0, 0.2);
@tieredBorderColor: #FDFDFD;
@tieredBorderWidth: 2px;
@tieredSubMenuTextTransform: normal;
@tieredSubMenuFontWeight: normal;
@tieredInvertedSubMenuBackground: rgba(0, 0, 0, 0.2);
@tieredSubMenuColor: @lightTextColor;
@tieredSubMenuActiveColor: @selectedTextColor;
/* Tabular */
@tabularInvisibleBorder: #DCDDDE;
@ -102,4 +183,11 @@
/* Pagination */
@paginationMinWidth: 3em;
@paginationActiveBackground: @activeBackground;
@paginationActiveBackground: @activeBackground;
/*--------------
Variations
---------------*/
/* Fixed */
@fixedGridMargin: 2.75rem;
Write Preview
Loading…
Cancel
Save