提交 6db5aeee 编写于 作者: C Catouse

* change theme.

上级 9b1ba8f3
此差异已折叠。
......@@ -2,60 +2,9 @@
// -------------------------------------------------
// Variables
@import "basic/variables.less";
@import "basic/variables.theme.less";
@import "basic/mixins.less";
// Color scheme
@color-primary: #ca011b; // chagne this value to apply new colorset
@color-secondary: desaturate(darken(@color-primary, 15%), 15%);
@color-pale: spin(hsl(hue(@color-primary), 54%, 95%), -7);
@state-primary-text: @color-primary;
@state-primary-bg: @color-pale;
@state-primary-inverse-bg: @color-primary;
@state-primary-border: darken(spin(@state-primary-bg, -10), 5%);
@link-color: @color-secondary;
@link-hover-color: darken(@link-color, 15%);
@component-active-bg: @color-primary;
@component-hover-bg: @color-primary;
@dropdown-link-hover-bg: @component-hover-bg;
@dropdown-link-active-bg: @component-active-bg;
@table-bg-hover: @color-pale;
@table-bg-active: @table-bg-hover;
@btn-primary-bg: @color-primary;
@btn-primary-border: darken(@btn-primary-bg, 5%);
@badge-active-color: @link-color;
@progress-bar-bg: @color-primary;
@input-border-focus: @link-color;
@list-group-hover-bg: @color-pale;
@list-group-active-bg: @component-active-bg;
@label-primary-bg: @color-primary;
@panel-primary-border: @color-primary;
@pager-active-bg: @component-active-bg;
@navbar-inverse-bg: @color-secondary;
@navbar-inverse-border: darken(@navbar-inverse-bg, 10%);
@navbar-inverse-link-hover-bg: lighten(@navbar-inverse-bg, 6%);
@navbar-inverse-link-active-bg: lighten(@navbar-inverse-bg, 10%);
@navbar-inverse-toggle-hover-bg: darken(@navbar-inverse-bg, 5%);
@navbar-inverse-toggle-border-color: lighten(@navbar-inverse-bg, 10%);
@nav-pills-active-link-hover-bg: @component-active-bg;
@nav-secondary-active-border-color: @component-active-bg;
@nav-secondary-active-link-hover-color: @component-active-bg;
@nav-primary-active-border-color: @component-active-bg;
// Minxins
.form-control-focus(@color: @input-border-focus)
{
......@@ -67,11 +16,10 @@
}
}
.button-variant(@color; @background; @border)
{
.button-variant(@color; @background; @border) {
color: @color;
background-color: @background;
border-color: darken(@background, 12%);
border-color: @border;
&:hover,
&:focus,
......@@ -81,6 +29,7 @@
color: @color;
background-color: darken(@background, 8%);
border-color: darken(@border, 12%);
.box-shadow(0 2px 1px rgba(0, 0, 0, 0.1));
}
&.disabled,
&[disabled],
......@@ -109,25 +58,6 @@
}
}
.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border;)
{
border-color: @border;
& > .panel-heading
{
+ .panel-collapse .panel-body
{
border-top-color: @border;
}
}
& > .panel-footer
{
+ .panel-collapse .panel-body
{
border-bottom-color: @border;
}
}
}
// Scaffolding
a
{
......@@ -141,14 +71,50 @@ a
}
// Buttons
.btn
{
border-radius: @border-radius-base;
.button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
}
.btn-primary
{
.button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
}
// Warning appears as orange
.btn-warning
{
.button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
}
// Danger and error appear as red
.btn-danger
{
.button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
}
// Success appears as green
.btn-success
{
.button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
}
// Info appears as blue-green
.btn-info
{
.button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
}
.btn-link
{
color: @link-color;
&,
&:active,
&[disabled],
fieldset[disabled] &,
&:hover,
&:focus
{
border-color: transparent;
.box-shadow(none);
}
&:hover,
&:focus
{
......@@ -165,8 +131,19 @@ a
}
}
// Popover & tooltip
.popover,
.tooltip-inner {
border-radius: @border-radius-base;
}
// Labels
.label {border-radius: 0;}
.label-primary { .label-variant(@label-primary-bg); }
.label-success { .label-variant(@label-success-bg); }
.label-info { .label-variant(@label-info-bg); }
.label-warning { .label-variant(@label-warning-bg); }
.label-danger { .label-variant(@label-danger-bg); }
// Labels.fix
.btn-primary .label-badge,.btn-primary .label-dot
......@@ -178,12 +155,52 @@ a
.text-primary
{
color: @color-primary;
&:hover
{
&:hover {
color: darken(@color-primary, 10%);
}
}
.text-warning
{
color: @state-warning-text;
&:hover {
color: darken(@state-warning-text, 10%);
}
}
.text-danger
{
color: @state-danger-text;
&:hover {
color: darken(@state-danger-text, 10%);
}
}
.text-success
{
color: @state-success-text;
&:hover {
color: darken(@state-success-text, 10%);
}
}
.text-info
{
color: @state-info-text;
&:hover {
color: darken(@state-info-text, 10%);
}
}
.text-important
{
color: @state-important-text;
&:hover {
color: darken(@state-important-text, 10%);
}
}
.text-special
{
color: @state-special-text;
&:hover {
color: darken(@state-special-text, 10%);
}
}
.text-muted
{
a
......@@ -225,9 +242,29 @@ a
// Form
.form-control
{
border-radius: @input-border-radius;
.form-control-focus();
}
// Condensed form
.form-condensed {
.form-control,
.btn {
border-radius: @border-radius-base;
}
}
// Input group
.input-group-addon {
background-color: @input-group-addon-bg;
}
.input-group-addon,
.input-group-btn .dropdown-toggle,
.input-group-btn .btn {
border-radius: @border-radius-base !important;
}
// List group
.list-group-item
{
......@@ -462,6 +499,14 @@ a
}
}
.nav-tabs
{
> li > a
{
border-radius: @border-radius-base @border-radius-base 0 0;
}
}
.nav .caret
{
border-top-color: @link-color;
......@@ -489,7 +534,22 @@ a
}
// Panel.type
.panel {
border-radius: @border-radius-base;
box-shadow: none;
> .panel-heading {
background-image: none;
border-top-left-radius: @border-radius-base;
border-top-right-radius: @border-radius-base;
}
.panel-variant(@panel-default-border; @panel-default-text; @panel-default-heading-bg; @panel-default-border);
}
.dashboard .panel {box-shadow: none}
.panel-primary { .panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border); }
.panel-success > .panel-body, .panel-warning > .panel-body, .panel-primary > .panel-body, .panel-info > .panel-body, .panel-danger > .panel-body {box-shadow: none}
// Table
.table-hover > tbody > tr:hover
......@@ -520,11 +580,16 @@ table.tablesorter thead tr .headerSortDown:after{color:@link-color!important;}
{
.chosen-search
{
&:focus
&:focus,
input[type="text"]:focus
{
border-color: @input-border-focus!important;
}
}
.chosen-single {
border-radius: @input-border-radius!important;
}
}
.chosen-container .chosen-results
......@@ -559,7 +624,22 @@ table.tablesorter thead tr .headerSortDown:after{color:@link-color!important;}
}
}
.chosen-container-multi .chosen-choices {
border-radius: @input-border-radius!important;
}
// Menu
.menu .nav,
.menu > .nav > li:first-child > a, .menu > .nav > li:first-child.nav-heading,
.menu > .nav > li:last-child > a {
border-radius: @border-radius-base;
}
// Dropdown
.dropdown-menu
{
border-radius: @border-radius-base;
}
.dropdown-menu > li > a
{
&:hover,
......@@ -641,10 +721,14 @@ table.tablesorter thead tr .headerSortDown:after{color:@link-color!important;}
}
// Messager
.messager-primary
{
background-color: @state-primary-inverse-bg;
}
.messager {border-radius: @messager-radius;}
.messager-primary {background-color: @state-primary-inverse-bg;}
.messager-success {background-color: @state-success-inverse-bg;}
.messager-info {background-color: @state-info-inverse-bg;}
.messager-warning {background-color: @state-warning-inverse-bg;}
.messager-danger {background-color: @state-danger-inverse-bg;}
.messager-important {background-color: @state-important-inverse-bg;}
.messager-special {background-color: @state-special-inverse-bg;}
// Comment
.comment
......@@ -663,3 +747,45 @@ table.tablesorter thead tr .headerSortDown:after{color:@link-color!important;}
}
}
}
// Alerts
.alert {
border-radius: @alert-border-radius;
}
.alert-primary
{
.alert-variant(@alert-primary-bg; @alert-primary-border; @alert-primary-text);
}
.alert-success
{
.alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);
}
.alert-info
{
.alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
}
.alert-warning
{
.alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text);
}
.alert-danger
{
.alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
}
// Kindeditor
.ke-container {
border-radius: @border-radius-base!important;
}
// Modal
.modal-dialog {
border-radius: @border-radius-large;
}
// Card
.card
{
.box-shadow(none);
border-radius: @border-radius-base;
}
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册