update
This commit is contained in:
hanjian
@@ -0,0 +1,65 @@
|
||||
.enable_simple_color_picker() when(@enable-simple-color-picker = true) {
|
||||
|
||||
.dropdown-colorpicker {
|
||||
> .dropdown-menu {
|
||||
padding: 4px;
|
||||
min-width: 130px;
|
||||
max-width: 130px;
|
||||
|
||||
|
||||
top: 80%;
|
||||
left: -7px;
|
||||
&.dropdown-menu-right {
|
||||
right: -7px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
> li {
|
||||
display:block;
|
||||
float:left;
|
||||
width:20px; height:20px;
|
||||
margin:2px;
|
||||
> .colorpick-btn {
|
||||
display:block;
|
||||
width:20px; height:20px;
|
||||
|
||||
margin:0; padding:0;
|
||||
border-radius:0;
|
||||
position:relative;
|
||||
|
||||
.transition(~"all ease 0.1s");
|
||||
|
||||
&:hover {
|
||||
text-decoration:none;
|
||||
.opacity(0.8);
|
||||
.scale(1.08, 1.08);
|
||||
}
|
||||
&.selected:after {
|
||||
content: "\f00c";
|
||||
display: inline-block;
|
||||
font-family: FontAwesome;
|
||||
font-size: 11px;
|
||||
color: #FFF;
|
||||
|
||||
position:absolute; left:0; right:0; text-align:center; line-height:20px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-colorpicker {
|
||||
display:inline-block;
|
||||
width:20px; height:20px;
|
||||
background-color:#DDD;
|
||||
vertical-align:middle;
|
||||
|
||||
border-radius:0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
.enable_simple_color_picker();
|
||||
@@ -0,0 +1,177 @@
|
||||
.enable_navbar_dropdowns() when(@enable-navbar-dropdowns = true) {
|
||||
|
||||
//top user info dropdowns
|
||||
.dropdown-navbar {
|
||||
padding:0;
|
||||
width: @navbar-dropdown-width;
|
||||
.box-shadow(@navbar-dropdown-shadow);
|
||||
|
||||
|
||||
> li {
|
||||
padding: 0 8px;
|
||||
background-color: #FFF;
|
||||
|
||||
&.dropdown-header {
|
||||
text-shadow: none;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
line-height: 34px;
|
||||
font-size: @font-size-navbar-dropdown-header;
|
||||
font-weight: bold;
|
||||
text-transform: none;
|
||||
border-bottom: 1px solid;
|
||||
}
|
||||
|
||||
> .@{icon} , > a > .@{icon} {
|
||||
margin-right: 5px !important;
|
||||
color: #555;
|
||||
font-size: @font-size-navbar-dropdown-icon;
|
||||
}
|
||||
|
||||
|
||||
|
||||
> a {
|
||||
padding: 10px 2px;
|
||||
margin: 0;
|
||||
border-top: 1px solid;
|
||||
font-size: @font-size-navbar-dropdown-item;
|
||||
line-height: 16px;
|
||||
color: #555;
|
||||
|
||||
&:active, &:hover, &:focus {
|
||||
background-color: transparent !important;
|
||||
color: #555;
|
||||
}
|
||||
.progress {
|
||||
margin-bottom: 0;
|
||||
margin-top: 4px;
|
||||
}
|
||||
.badge {
|
||||
line-height: 16px;
|
||||
padding-right: 4px;
|
||||
padding-left: 4px;
|
||||
font-size: @font-size-navbar-dropdown-item;
|
||||
}
|
||||
}
|
||||
&:first-child > a , &.dropdown-header + li > a{
|
||||
border-top-width: 0;
|
||||
}
|
||||
|
||||
&.dropdown-footer > a {
|
||||
color: #4F99C6;
|
||||
|
||||
text-align:center;
|
||||
font-size: @font-size-navbar-dropdown-footer;
|
||||
|
||||
&:hover {
|
||||
background-color:#FFF;
|
||||
color:#4F99C6;
|
||||
text-decoration:underline;
|
||||
> .@{icon} {
|
||||
text-decoration:none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}//end of li
|
||||
|
||||
|
||||
//navbar colors
|
||||
|
||||
.navbar-colors(@border-color; @hover-color; @header-bg; @header-txt; @header-icon; @item-bottom) {
|
||||
border-color:@border-color;
|
||||
> li {
|
||||
&:hover {
|
||||
background-color:@hover-color !important;
|
||||
}
|
||||
&.dropdown-header {
|
||||
background-color:@header-bg !important;
|
||||
color:@header-txt;
|
||||
border-bottom-color:@border-color;
|
||||
|
||||
> .@{icon} {
|
||||
color:@header-icon;
|
||||
}
|
||||
}
|
||||
> a {
|
||||
border-top-color: @item-bottom;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-colors(#BCD4E5 ; #F4F9FC ; #ECF2F7 ; #8090A0 ; #8090A0; #E4ECF3);
|
||||
&.navbar-pink {
|
||||
.navbar-colors(#E5BCD4 ; #FCF4F9 ; #F7ECF2 ; #B471A0 ; #C06090 ; #F3E4EC);
|
||||
}
|
||||
&.navbar-grey {
|
||||
.navbar-colors(#E5E5E5 ; #F8F8F8 ; #F2F2F2 ; #3A87AD ; #3A87AD; #EEEEEE);
|
||||
}
|
||||
&.navbar-green {
|
||||
.navbar-colors(#B4D5AC ; #F4F9EF ; #EBF7E4 ; #88AA66 ; #90C060; #ECF3E4);
|
||||
}
|
||||
|
||||
|
||||
|
||||
[class*="btn"].@{icon} {
|
||||
display: inline-block;
|
||||
//border: none;
|
||||
margin: 0 5px 0 0;
|
||||
width: 24px;
|
||||
text-align: center;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
|
||||
//user info on top navbar icons
|
||||
.msg-photo {
|
||||
margin-right: 6px;
|
||||
max-width: 42px;
|
||||
}
|
||||
.msg-body {
|
||||
display: inline-block;
|
||||
line-height: 20px;
|
||||
white-space: normal;
|
||||
vertical-align: middle;
|
||||
|
||||
max-width: 175px;
|
||||
}
|
||||
.msg-title {
|
||||
display: inline-block;
|
||||
line-height: 14px;
|
||||
}
|
||||
.msg-time {
|
||||
display: block;
|
||||
font-size: @font-size-navbar-dropdown-msg-time;
|
||||
color: #777;
|
||||
> .@{icon} {
|
||||
font-size: floor(@font-size-navbar-dropdown-msg-time * 1.3);
|
||||
color: #555;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.dropdown-navbar > .dropdown-content {
|
||||
padding: 0;
|
||||
.dropdown-navbar {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0 !important;//to override padding-top: 2px when inside tabbed dropdown
|
||||
.box-shadow(none);
|
||||
|
||||
width: auto;
|
||||
display: block;
|
||||
float: none;
|
||||
|
||||
border-width: 0;
|
||||
position: static;
|
||||
z-index: auto;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.enable_navbar_dropdowns();
|
||||
@@ -0,0 +1,97 @@
|
||||
.enable_navbar_tabbed_dropdowns() when(@enable-navbar-tabbed-dropdowns = true) {
|
||||
|
||||
//tabs inside navbar dropdown
|
||||
.dropdown-navbar {
|
||||
.nav-tabs {
|
||||
border-width: 0;
|
||||
box-shadow: none;
|
||||
background-color:#F9F9F9 !important;
|
||||
top: auto;
|
||||
width: 100%;
|
||||
|
||||
//to make them all the same size
|
||||
> li {
|
||||
display: table-cell;
|
||||
width: 1%;
|
||||
float: none !important;//to override .rtl's
|
||||
|
||||
> a {
|
||||
margin: 0 0 0 1px !important;
|
||||
text-align: center;
|
||||
|
||||
box-shadow: none !important;
|
||||
background-color: #F9F9F9 !important;
|
||||
|
||||
border-width: 0 !important;
|
||||
border-bottom: 2px solid #BECAD1 !important;
|
||||
|
||||
//&:focus {
|
||||
// color: darken(desaturate(#5085AF, 5%), 5%) !important;
|
||||
//}
|
||||
|
||||
&:before {
|
||||
//the small line separating tabs
|
||||
display: block;
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: -1px;
|
||||
top: 3px;
|
||||
bottom: 3px;
|
||||
width: 1px;
|
||||
background-color: #BECAD1;
|
||||
}
|
||||
}
|
||||
&:first-child > a {
|
||||
margin-left: 0 !important;
|
||||
&:before {
|
||||
//hide the separator line
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&.active > a {
|
||||
border-bottom: 2px solid #79B0CE !important;
|
||||
color:#5085AF !important;
|
||||
background-color: #ECF2F7 !important;
|
||||
}
|
||||
}
|
||||
}//.nav-tabs
|
||||
|
||||
.tab-content {
|
||||
padding: 0 !important;
|
||||
border-color: #FFF !important;
|
||||
|
||||
.dropdown-menu {
|
||||
display: block;
|
||||
position: static;
|
||||
|
||||
margin: 0 !important;
|
||||
padding-top: 2px;
|
||||
|
||||
border-color: #FFF !important;
|
||||
box-shadow: none !important;
|
||||
width: 100%;
|
||||
}
|
||||
}//.tab-content
|
||||
|
||||
|
||||
&.navbar-pink {
|
||||
.nav-tabs > li.active > a {
|
||||
border-bottom: 2px solid #E5BCD4 !important;
|
||||
color: #C06090 !important;
|
||||
background-color: #F7ECF2 !important;
|
||||
}
|
||||
.nav-tabs > li:not(.active) > a:hover {
|
||||
color: #BA7396;
|
||||
}
|
||||
.nav-tabs > li > a:before {
|
||||
background-color: #CEBBCB;
|
||||
}
|
||||
.nav-tabs > li > a {
|
||||
border-bottom-color: #CEBBCD !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.enable_navbar_tabbed_dropdowns();
|
||||
Reference in New Issue
Block a user