espocrm-extensions/espocrm-base
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

theme colors

Browse Source
This commit is contained in:
Yuri Kuznetsov
2021-12-20 15:47:34 +02:00
parent df56679c4e
commit 8afe22f637
44 changed files with 852 additions and 222 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/less/espo-rtl/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../variables.less";
frontend/less/espo-rtl/main.less
+2 -1
View File
@@ -2,15 +2,16 @@
@import "bootstrap-rtl/bootstrap-rtl.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "variables.less";
@import "../espo/root-variables.less";
@import "../espo/mixins.less";
@import "../espo/misc.less";
@import "../espo/layout.less";
@import "../espo/custom.less";
@import "layout.less";
@import "custom.less";
frontend/less/espo-vertical/custom.less
+1 -1
View File
@@ -49,7 +49,7 @@ input.global-search-input {
> a:hover,
> a:active,
> a:focus {
background-color: darken(@gray-lighter, 10%);
background-color: var(--gray-lighter-10);
}
}
}
frontend/less/espo-vertical/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../variables.less";
frontend/less/espo-vertical/main.less
+2
View File
@@ -1,10 +1,12 @@
@import "../espo/init.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "variables.less";
@import "../espo/mixins.less";
@import "../espo/root-variables.less";
@import "../espo/misc.less";
@import "layout.less";
@import "../espo/custom.less";
frontend/less/espo/bootstrap/alerts.less
+4 -4
View File
@@ -57,17 +57,17 @@
// Generate contextual modifier classes for colorizing the alert.
.alert-success {
.alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);
.alert-variant-espo(@alert-success-bg; @alert-success-border; @alert-success-text);
}
.alert-info {
.alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
.alert-variant-espo(@alert-info-bg; @alert-info-border; @alert-info-text);
}
.alert-warning {
.alert-variant(@alert-warning-bg; @alert-warning-border; @alert-warning-text);
.alert-variant-espo(@alert-warning-bg; @alert-warning-border; @alert-warning-text);
}
.alert-danger {
.alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
.alert-variant-espo(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
}
frontend/less/espo/bootstrap/buttons.less
+54 -6
View File
@@ -64,26 +64,74 @@
// --------------------------------------------------
.btn-default {
.button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
.button-variant-espo(
@btn-default-color;
@btn-default-bg;
@btn-default-border;
@btn-default-bg-10;
@btn-default-bg-17;
@btn-default-border-12;
@btn-default-border-25
);
}
.btn-primary {
.button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
.button-variant-espo(
@btn-primary-color;
@btn-primary-bg;
@btn-primary-border;
@btn-primary-bg-10;
@btn-primary-bg-17;
@btn-primary-border-12;
@btn-primary-border-25
);
}
// Success appears as green
.btn-success {
.button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
.button-variant-espo(
@btn-success-color;
@btn-success-bg;
@btn-success-border;
@btn-success-bg-10;
@btn-success-bg-17;
@btn-success-border-12;
@btn-success-border-25
);
}
// Info appears as blue-green
.btn-info {
.button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
.button-variant-espo(
@btn-info-color;
@btn-info-bg;
@btn-info-border;
@btn-info-bg-10;
@btn-info-bg-17;
@btn-info-border-12;
@btn-info-border-25
);
}
// Warning appears as orange
.btn-warning {
.button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
.button-variant-espo(
@btn-warning-color;
@btn-warning-bg;
@btn-warning-border;
@btn-warning-bg-10;
@btn-warning-bg-17;
@btn-warning-border-12;
@btn-warning-border-25
);
}
// Danger and error appear as red
.btn-danger {
.button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
.button-variant-espo(
@btn-danger-color;
@btn-danger-bg;
@btn-danger-border;
@btn-danger-bg-10;
@btn-danger-bg-17;
@btn-danger-border-12;
@btn-danger-border-25
);
}
frontend/less/espo/bootstrap/forms.less
+10 -3
View File
@@ -127,7 +127,7 @@ output {
.transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s");
// Customize the `:focus` state to imitate native WebKit styles.
.form-control-focus();
.form-control-focus-espo();
// Placeholder
.placeholder();
@@ -426,7 +426,13 @@ input[type="checkbox"] {
// Feedback states
.has-success {
.form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
.form-control-validation-espo(
@state-success-text;
@state-success-text;
@state-success-bg;
@state-success-text-10;
var(--state-success-text-10l)
);
}
.has-warning {
.form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg);
@@ -456,7 +462,8 @@ input[type="checkbox"] {
display: block; // account for any element using help-block
margin-top: 5px;
margin-bottom: 10px;
color: lighten(@text-color, 25%); // lighten the text some for contrast
//color: lighten(@text-color, 25%); // lighten the text some for contrast
color: var(--gray-dark-25l);
}
frontend/less/espo/bootstrap/jumbotron.less
+1 -1
View File
@@ -22,7 +22,7 @@
}
> hr {
border-top-color: darken(@jumbotron-bg, 10%);
border-top-color: var(--gray-lighter-10);
}
.container &,
frontend/less/espo/bootstrap/labels.less
+6 -6
View File
@@ -40,25 +40,25 @@
// Contextual variations (linked labels get darker on :hover)
.label-default {
.label-variant(@label-default-bg);
.label-variant-espo(@label-default-bg; var(--gray-light-10));
}
.label-primary {
.label-variant(@label-primary-bg);
.label-variant-espo(@label-primary-bg; @brand-primary-10);
}
.label-success {
.label-variant(@label-success-bg);
.label-variant-espo(@label-success-bg; @brand-success-10);
}
.label-info {
.label-variant(@label-info-bg);
.label-variant-espo(@label-info-bg; @brand-info-10);
}
.label-warning {
.label-variant(@label-warning-bg);
.label-variant-espo(@label-warning-bg; @brand-warning-10);
}
.label-danger {
.label-variant(@label-danger-bg);
.label-variant-espo(@label-danger-bg; @brand-danger-10);
}
frontend/less/espo/bootstrap/list-group.less
+2 -2
View File
@@ -110,8 +110,8 @@ button.list-group-item {
// Add modifier classes to change text and background color on individual items.
// Organizationally, this must come after the `:hover` states.
.list-group-item-variant(success; @state-success-bg; @state-success-text);
.list-group-item-variant(info; @state-info-bg; @state-info-text);
.list-group-item-variant-espo(success; @state-success-bg; @state-success-text; @state-success-bg-5);
.list-group-item-variant-espo(info; @state-info-bg; @state-info-text; @state-info-bg-5);
.list-group-item-variant(warning; @state-warning-bg; @state-warning-text);
.list-group-item-variant(danger; @state-danger-bg; @state-danger-text);
frontend/less/espo/bootstrap/navbar.less
+1 -1
View File
@@ -585,7 +585,7 @@
.navbar-collapse,
.navbar-form {
border-color: darken(@navbar-inverse-bg, 7%);
border-color: var(--navbar-inverse-bg-7);
}
// Dropdowns
frontend/less/espo/bootstrap/popovers.less
+1 -1
View File
@@ -35,7 +35,7 @@
padding: 8px 14px;
font-size: @font-size-base;
background-color: @popover-title-bg;
border-bottom: 1px solid darken(@popover-title-bg, 5%);
border-bottom: 1px solid var(--white-color-5);
border-radius: (@border-radius-large - 1) (@border-radius-large - 1) 0 0;
}
frontend/less/espo/bootstrap/tables.less
+4 -3
View File
@@ -155,9 +155,10 @@ table {
// inheritance to nested tables.
// Generate the contextual variants
.table-row-variant(active; @table-bg-active);
.table-row-variant(success; @state-success-bg);
.table-row-variant(info; @state-info-bg);
.table-row-variant-espo(active; @table-bg-active; @table-bg-active-5);
.table-row-variant-espo(success; @state-success-bg; @state-success-bg-5);
.table-row-variant-espo(info; @state-info-bg; @state-info-bg-5);
.table-row-variant(warning; @state-warning-bg);
.table-row-variant(danger; @state-danger-bg);
frontend/less/espo/bootstrap/theme.less
+1 -1
View File
@@ -153,7 +153,7 @@
border-radius: @navbar-border-radius;
.navbar-nav > .open > a,
.navbar-nav > .active > a {
#gradient > .vertical(@start-color: @navbar-inverse-link-active-bg; @end-color: lighten(@navbar-inverse-link-active-bg, 2.5%));
//#gradient > .vertical(@start-color: @navbar-inverse-link-active-bg; @end-color: lighten(@navbar-inverse-link-active-bg, 2.5%));
.box-shadow(inset 0 3px 9px rgba(0,0,0,.25));
}
frontend/less/espo/bootstrap/type.less
+5 -5
View File
@@ -103,10 +103,10 @@ mark,
color: @text-muted;
}
.text-primary {
.text-emphasis-variant(@brand-primary);
.text-emphasis-variant-espo(@brand-primary, @brand-primary-10);
}
.text-success {
.text-emphasis-variant(@state-success-text);
.text-emphasis-variant-espo(@state-success-text, @state-success-text-10);
}
.text-info {
.text-emphasis-variant(@state-info-text);
@@ -125,13 +125,13 @@ mark,
// Given the contrast here, this is the only class to have its color inverted
// automatically.
color: #fff;
.bg-variant(@brand-primary);
.bg-variant-espo(@brand-primary, @brand-primary-10);
}
.bg-success {
.bg-variant(@state-success-bg);
.bg-variant-espo(@brand-primary, @state-success-bg-10);
}
.bg-info {
.bg-variant(@state-info-bg);
.bg-variant-espo(@state-info-bg, @state-info-bg-5);
}
.bg-warning {
.bg-variant(@state-warning-bg);
frontend/less/espo/bootstrap/variables.less
+18 -18
View File
@@ -33,7 +33,7 @@
//** Global textual link color.
@link-color: @brand-primary;
//** Link hover color set via `darken()` function.
@link-hover-color: darken(@link-color, 15%);
//@link-hover-color: darken(@link-color, 15%);
//** Link hover decoration.
@link-hover-decoration: underline;
@@ -150,23 +150,23 @@
@btn-primary-color: #fff;
@btn-primary-bg: @brand-primary;
@btn-primary-border: darken(@btn-primary-bg, 5%);
//@btn-primary-border: darken(@btn-primary-bg, 5%);
@btn-success-color: #fff;
@btn-success-bg: @brand-success;
@btn-success-border: darken(@btn-success-bg, 5%);
//@btn-success-border: darken(@btn-success-bg, 5%);
@btn-info-color: #fff;
@btn-info-bg: @brand-info;
@btn-info-border: darken(@btn-info-bg, 5%);
//@btn-info-border: darken(@btn-info-bg, 5%);
@btn-warning-color: #fff;
@btn-warning-bg: @brand-warning;
@btn-warning-border: darken(@btn-warning-bg, 5%);
//@btn-warning-border: darken(@btn-warning-bg, 5%);
@btn-danger-color: #fff;
@btn-danger-bg: @brand-danger;
@btn-danger-border: darken(@btn-danger-bg, 5%);
//@btn-danger-border: darken(@btn-danger-bg, 5%);
@btn-link-disabled-color: @gray-light;
@@ -243,7 +243,7 @@
//** Dropdown link text color.
@dropdown-link-color: @gray-dark;
//** Hover color for dropdown links.
@dropdown-link-hover-color: darken(@gray-dark, 5%);
//@dropdown-link-hover-color: darken(@gray-dark, 5%);
//** Hover background for dropdown links.
@dropdown-link-hover-bg: #f5f5f5;
@@ -390,16 +390,16 @@
//=== Inverted navbar
// Reset inverted navbar basics
@navbar-inverse-color: lighten(@gray-light, 15%);
//@navbar-inverse-color: lighten(@gray-light, 15%);
@navbar-inverse-bg: #222;
@navbar-inverse-border: darken(@navbar-inverse-bg, 10%);
//@navbar-inverse-border: darken(@navbar-inverse-bg, 10%);
// Inverted navbar links
@navbar-inverse-link-color: lighten(@gray-light, 15%);
//@navbar-inverse-link-color: lighten(@gray-light, 15%);
@navbar-inverse-link-hover-color: #fff;
@navbar-inverse-link-hover-bg: transparent;
@navbar-inverse-link-active-color: @navbar-inverse-link-hover-color;
@navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%);
//@navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%);
@navbar-inverse-link-disabled-color: #444;
@navbar-inverse-link-disabled-bg: transparent;
@@ -498,19 +498,19 @@
@state-success-text: #3c763d;
@state-success-bg: #dff0d8;
@state-success-border: darken(spin(@state-success-bg, -10), 5%);
//@state-success-border: darken(spin(@state-success-bg, -10), 5%);
@state-info-text: #31708f;
@state-info-bg: #d9edf7;
@state-info-border: darken(spin(@state-info-bg, -10), 7%);
//@state-info-border: darken(spin(@state-info-bg, -10), 7%);
@state-warning-text: #8a6d3b;
@state-warning-bg: #fcf8e3;
@state-warning-border: darken(spin(@state-warning-bg, -10), 5%);
//@state-warning-border: darken(spin(@state-warning-bg, -10), 5%);
@state-danger-text: #a94442;
@state-danger-bg: #f2dede;
@state-danger-border: darken(spin(@state-danger-bg, -10), 5%);
//@state-danger-border: darken(spin(@state-danger-bg, -10), 5%);
//== Tooltips
@@ -545,7 +545,7 @@
@popover-fallback-border-color: #ccc;
//** Popover title background color
@popover-title-bg: darken(@popover-bg, 3%);
//@popover-title-bg: darken(@popover-bg, 3%);
//** Popover arrow width
@popover-arrow-width: 10px;
@@ -684,7 +684,7 @@
//** Border color of active list elements
@list-group-active-border: @list-group-active-bg;
//** Text color for content within active list items
@list-group-active-text-color: lighten(@list-group-active-bg, 40%);
//@list-group-active-text-color: lighten(@list-group-active-bg, 40%);
//** Text color of disabled list items
@list-group-disabled-color: @gray-light;
@@ -761,7 +761,7 @@
//##
@well-bg: #f5f5f5;
@well-border: darken(@well-bg, 7%);
//@well-border: darken(@well-bg, 7%);
//== Badges
frontend/less/espo/elements/type.less
+1 -1
View File
@@ -70,7 +70,7 @@ b, strong {
}
.text-primary {
color: @state-primary-text;
color: var(--state-primary-text);
}
.text-soft {
frontend/less/espo/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../bootstrap/variables.less";
@import "../value-variables.less";
@import "../variables.less";
@import "../fonts.less";
frontend/less/espo/main.less
+5 -1
View File
@@ -1,7 +1,11 @@
@import "init.less";
@import "value-variables.less";
@import "variables.less";
@import "mixins.less";
@import "root-variables.less";
@import "misc.less";
@import "layout.less";
@import "custom.less";
@@ -10,4 +14,4 @@
body {
--theme-name: Espo;
}
}
frontend/less/espo/misc/datepicker/datepicker.less
+69 -12
View File
@@ -94,11 +94,19 @@
}
&.highlighted {
@highlighted-bg: @state-info-bg;
.button-variant(#000, @highlighted-bg, darken(@highlighted-bg, 20%));
.button-variant-espo(
var(--state-info-text);
var(--state-info-bg);
var(--state-info-bg-5);
var(--state-info-bg-10);
var(--state-info-bg-17);
var(--state-info-bg-12);
var(--state-info-bg-25)
);
border-radius: 0;
&.focused {
background: darken(@highlighted-bg, 10%);
background: var(--state-info-bg-10);
}
&.disabled,
@@ -123,11 +131,19 @@
}
&.range {
@range-bg: @gray-lighter;
.button-variant(#000, @range-bg, darken(@range-bg, 20%));
.button-variant-espo(
#000;
@range-bg;
var(--gray-lighter-5);
var(--gray-lighter-10);
var(--gray-lighter-17);
var(--gray-lighter-12);
var(--gray-lighter-25)
);
border-radius: 0;
&.focused {
background: darken(@range-bg, 10%);
background: var(--gray-lighter-10);
}
&.disabled,
@@ -137,11 +153,20 @@
}
}
&.range.highlighted {
@range-highlighted-bg: mix(@state-info-bg, @gray-lighter, 50%);
.button-variant(#000, @range-highlighted-bg, darken(@range-highlighted-bg, 20%));
@range-highlighted-bg: var(--state-info-bg-mix);
.button-variant-espo(
var(--state-info-text);
var(--state-info-bg-mix);
var(--state-info-bg-mix-5);
var(--state-info-bg-mix-10);
var(--state-info-bg-mix-17);
var(--state-info-bg-mix-12);
var(--state-info-bg-mix-25)
);
&.focused {
background: darken(@range-highlighted-bg, 10%);
background: var(--state-info-bg-mix-10);
}
&.disabled,
@@ -151,8 +176,16 @@
}
}
&.range.today {
@range-today-bg: mix(orange, @gray-lighter, 50%);
.button-variant(#000, @range-today-bg, darken(@range-today-bg, 20%));
@range-today-bg: var(--gray-lighter-orange-mix);
.button-variant-espo(
#000;
@range-today-bg;
var(--gray-lighter-orange-mix-5);
var(--gray-lighter-orange-mix-10);
var(--gray-lighter-orange-mix-12);
var(--gray-lighter-orange-mix-17);
var(--gray-lighter-orange-mix-25)
);
&.disabled,
&.disabled:active {
@@ -162,12 +195,28 @@
}
&.selected,
&.selected.highlighted {
.button-variant(#fff, @gray-light, @gray);
.button-variant-espo(
#fff;
@gray-light;
var(--gray-light-5);
var(--gray-light-10);
var(--gray-light-17);
var(--gray-light-12);
var(--gray-light-25)
);
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}
&.active,
&.active.highlighted {
.button-variant(@btn-primary-color, @btn-primary-bg, @btn-primary-border);
.button-variant-espo(
var(--brand-primary-text);
var(--brand-primary);
var(--brand-primary-5);
var(--brand-primary-10);
var(--brand-primary-17);
var(--brand-primary-12);
var(--brand-primary-25)
);
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}
span {
@@ -193,7 +242,15 @@
&.active:hover,
&.active.disabled,
&.active.disabled:hover {
.button-variant(@btn-primary-color, @btn-primary-bg, @btn-primary-border);
.button-variant-espo(
@btn-primary-color;
@btn-primary-bg;
@btn-primary-border;
@btn-primary-bg-10;
@btn-primary-bg-17;
@btn-primary-border-12;
@btn-primary-border-25
);
text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}
&.old,
frontend/less/espo/misc/selectize/plugins/dropdown_header.less
+1 -1
View File
@@ -16,5 +16,5 @@
font-size: 20px !important;
}
.selectize-dropdown-header-close:hover {
color: darken(@selectize-color-text, 25%);
color: var(--gray-dark-25);
}
frontend/less/espo/misc/selectize/selectize.bootstrap3.less
+6 -2
View File
@@ -38,7 +38,7 @@
@selectize-color-optgroup-text: @dropdown-header-color;
@selectize-color-optgroup-border: @dropdown-divider-bg;
@selectize-color-dropdown: @dropdown-bg;
@selectize-color-dropdown-border-top: mix(@input-border, @input-bg, 0.8);
@selectize-color-dropdown-border-top: @input-border;
@selectize-color-dropdown-item-active: @dropdown-link-hover-bg;
@selectize-color-dropdown-item-active-text: @dropdown-link-hover-color;
@selectize-color-dropdown-item-create-active-text: @dropdown-link-hover-color;
@@ -96,6 +96,10 @@
.selectize-dropdown-content {
padding: 5px 0;
.create {
padding: 0 8px;
}
}
.selectize-dropdown-header {
@@ -113,7 +117,7 @@
}
&.focus {
@color: @input-border-focus;
@color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
@color-rgba: var(--input-border-focus-rgba);
border-color: @color;
outline: 0;
.selectize-box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
frontend/less/espo/misc/selectize/selectize.less
+3 -3
View File
@@ -27,7 +27,7 @@
@selectize-color-dropdown-border-top: #f0f0f0;
@selectize-color-dropdown-item-active: #f5fafd;
@selectize-color-dropdown-item-active-text: #495c68;
@selectize-color-dropdown-item-create-text: rgba(red(@selectize-color-text), green(@selectize-color-text), blue(@selectize-color-text), 0.5);
@selectize-color-dropdown-item-create-text: var(--state-danger-text);
@selectize-color-dropdown-item-create-active-text: @selectize-color-dropdown-item-active-text;
@selectize-color-optgroup: @selectize-color-dropdown;
@selectize-color-optgroup-text: @selectize-color-text;
@@ -163,13 +163,13 @@
border: @selectize-width-item-border solid @selectize-color-item-active-border;
}
}
.selectize-control.multi &.disabled > div {
/*.selectize-control.multi &.disabled > div {
&, &.active {
color: lighten(desaturate(@selectize-color-item-text, 100%), @selectize-lighten-disabled-item-text);
background: lighten(desaturate(@selectize-color-item, 100%), @selectize-lighten-disabled-item);
border: @selectize-width-item-border solid lighten(desaturate(@selectize-color-item-border, 100%), @selectize-lighten-disabled-item-border);
}
}
}*/
> input {
&::-ms-clear {
display: none;
frontend/less/espo/misc/timeline/timeline.less
+4 -4
View File
@@ -64,13 +64,13 @@
}
.vis-current-time {
background-color: lighten(@brand-danger, 20%) !important;
background-color: var(--brand-danger-lighten-20) !important;
}
.calendar-container .timeline .vis-item,
.calendar-container .timeline .vis-item.vis-selected {
border-color: lighten(@brand-primary, 30%);
background-color: lighten(@brand-primary, 50%);
border-color: var(--brand-primary-lighten-30);
background-color: var(--brand-primary-lighten-50);
}
.calendar-container .timeline .vis-tooltip {
@@ -82,7 +82,7 @@
}
.vis-item.vis-background.event-range {
border-color: lighten(@brand-primary, 10%);
border-color: var(--brand-primary-lighten-10);
border-left-width: 4px ;
border-right-width: 4px;
border-left-style: solid;
frontend/less/espo/mixins.less
+181 -4
View File
@@ -3,11 +3,188 @@
outline-offset: -2px;
}
.form-control-focus(@color: @input-border-focus) {
@color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
.form-control-focus-espo(@color-rgba: var(--input-border-focus-rgba)) {
&:focus {
border-color: @color;
border-color: var(--input-border-focus);
outline: 0;
.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
}
}
}
.button-variant-espo(@color; @background; @border; @background-10; @background-17; @border-12; @border-25) {
color: @color;
background-color: @background;
border-color: @border;
&:focus,
&.focus {
color: @color;
background-color: @background-10;
border-color: @border-25;
}
&:hover {
color: @color;
background-color: @background-10;
border-color: @border-12;
}
&:active,
&.active,
.open > .dropdown-toggle& {
color: @color;
background-color: @background-10;
border-color: @border-12;
&:hover,
&:focus,
&.focus {
color: @color;
background-color: @background-17;
border-color: @border-25;
}
}
&:active,
&.active,
.open > .dropdown-toggle& {
background-image: none;
}
&.disabled,
&[disabled],
fieldset[disabled] & {
&:hover,
&:focus,
&.focus {
background-color: @background;
border-color: @border;
}
}
.badge {
color: @background;
background-color: @color;
}
}
.table-row-variant-espo(@state; @background; @background-5) {
// Exact selectors below required to override `.table-striped` and prevent
// inheritance to nested tables.
.table > thead > tr,
.table > tbody > tr,
.table > tfoot > tr {
> td.@{state},
> th.@{state},
&.@{state} > td,
&.@{state} > th {
background-color: @background;
}
}
// Hover states for `.table-hover`
// Note: this is not available for cells or rows within `thead` or `tfoot`.
.table-hover > tbody > tr {
> td.@{state}:hover,
> th.@{state}:hover,
&.@{state}:hover > td,
&:hover > .@{state},
&.@{state}:hover > th {
background-color: @background-5;
}
}
}
.text-emphasis-variant-espo(@color, @color-10) {
color: @color;
a&:hover,
a&:focus {
color: @color-10;
}
}
.bg-variant-espo(@color, @color-10) {
background-color: @color;
a&:hover,
a&:focus {
background-color: @color-10;
}
}
.label-variant-espo(@color, @color-10) {
background-color: @color;
&[href] {
&:hover,
&:focus {
background-color: @color-10;
}
}
}
.list-group-item-variant-espo(@state; @background; @color; @background-5) {
.list-group-item-@{state} {
color: @color;
background-color: @background;
a&,
button& {
color: @color;
.list-group-item-heading {
color: inherit;
}
&:hover,
&:focus {
color: @color;
background-color: @background-5;
}
&.active,
&.active:hover,
&.active:focus {
color: #fff;
background-color: @color;
border-color: @color;
}
}
}
}
.form-control-validation-espo(@text-color; @border-color; @background-color; @border-color-1; @border-color-2) {
// Color the label and help text
.help-block,
.control-label,
.radio,
.checkbox,
.radio-inline,
.checkbox-inline,
&.radio label,
&.checkbox label,
&.radio-inline label,
&.checkbox-inline label {
color: @text-color;
}
// Set the border and box shadow on specific inputs to match
.form-control {
border-color: @border-color;
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
&:focus {
border-color: @border-color-1;
@shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px @border-color-2;
.box-shadow(@shadow);
}
}
// Set validation states also for addons
.input-group-addon {
color: @text-color;
border-color: @border-color;
background-color: @background-color;
}
// Optional feedback icon
.form-control-feedback {
color: @text-color;
}
}
.alert-variant-espo(@background; @border; @text-color) {
background-color: @background;
border-color: @border;
color: @text-color;
}
frontend/less/espo/root-variables.less
+188
View File
@@ -0,0 +1,188 @@
:root {
--body-bg: @body-bg-value;
--panel-bg: @panel-bg-value;
--main-gray: @main-gray-value;
--white-color: @white-color-value;
--white-color-3: darken(@white-color-value, 3%);
--white-color-5: darken(@white-color-value, 5%);
--gray-base: @gray-base-value;
--gray-soft: @gray-soft-value;
--gray-dark: @gray-dark-value;
--gray-light: @gray-light-value;
--gray-lighter: @gray-lighter-value;
--gray-light-5: darken(@gray-light-value, 5%);
--gray-light-7: darken(@gray-light-value, 7%);
--gray-light-10: darken(@gray-light-value, 10%);
--gray-light-12: darken(@gray-light-value, 12%);
--gray-light-17: darken(@gray-light-value, 17%);
--gray-light-25: darken(@gray-light-value, 25%);
--gray-light-40: darken(@gray-light-value, 40%);
--gray-dark-5: darken(@gray-dark-value, 5%);
--gray-dark-7: darken(@gray-dark-value, 7%);
--gray-dark-10: darken(@gray-dark-value, 10%);
--gray-dark-12: darken(@gray-dark-value, 12%);
--gray-dark-17: darken(@gray-dark-value, 17%);
--gray-dark-25: darken(@gray-dark-value, 25%);
--gray-dark-40: darken(@gray-dark-value, 40%);
--gray-dark-25l: lighten(@gray-dark-value, 25%);
--gray-lighter-5: darken(@gray-lighter-value, 5%);
--gray-lighter-7: darken(@gray-lighter-value, 7%);
--gray-lighter-10: darken(@gray-lighter-value, 10%);
--gray-lighter-12: darken(@gray-lighter-value, 12%);
--gray-lighter-17: darken(@gray-lighter-value, 17%);
--gray-lighter-25: darken(@gray-lighter-value, 25%);
--gray-lighter-40: darken(@gray-lighter-value, 40%);
--gray-lighter-orange-mix: @gray-lighter-orange-mix-value;
--gray-lighter-orange-mix-5: darken(@gray-lighter-orange-mix-value, 5%);
--gray-lighter-orange-mix-7: darken(@gray-lighter-orange-mix-value, 7%);
--gray-lighter-orange-mix-10: darken(@gray-lighter-orange-mix-value, 10%);
--gray-lighter-orange-mix-12: darken(@gray-lighter-orange-mix-value, 12%);
--gray-lighter-orange-mix-17: darken(@gray-lighter-orange-mix-value, 17%);
--gray-lighter-orange-mix-25: darken(@gray-lighter-orange-mix-value, 25%);
--gray-lighter-orange-mix-40: darken(@gray-lighter-orange-mix-value, 40%);
--brand-primary: @brand-primary-value;
--brand-danger: @brand-danger-value;
--brand-info: @brand-info-value;
--brand-success: @brand-success-value;
--brand-warning: @brand-warning-value;
--main-gray-5: darken(@main-gray-value, 5%);
--main-gray-7: darken(@main-gray-value, 7%);
--main-gray-10: darken(@main-gray-value, 10%);
--main-gray-12: darken(@main-gray-value, 12%);
--main-gray-17: darken(@main-gray-value, 17%);
--main-gray-25: darken(@main-gray-value, 25%);
--main-gray-40: darken(@main-gray-value, 40%);
--main-gray-lighten-40: lighten(@main-gray-value, 40%);
--brand-primary-text: @brand-primary-text-value;
--brand-primary-5: darken(@brand-primary-value, 5%);
--brand-primary-10: darken(@brand-primary-value, 10%);
--brand-primary-12: darken(@brand-primary-value, 12%);
--brand-primary-15: darken(@brand-primary-value, 15%);
--brand-primary-17: darken(@brand-primary-value, 17%);
--brand-primary-25: darken(@brand-primary-value, 25%);
--brand-primary-lighten-10: lighten(@brand-primary-value, 10%);
--brand-primary-lighten-30: lighten(@brand-primary-value, 30%);
--brand-primary-lighten-50: lighten(@brand-primary-value, 50%);
--state-primary-text: @state-primary-text-value;
--brand-danger-5: darken(@brand-danger-value, 5%);
--brand-danger-10: darken(@brand-danger-value, 10%);
--brand-danger-12: darken(@brand-danger-value, 12%);
--brand-danger-15: darken(@brand-danger-value, 15%);
--brand-danger-17: darken(@brand-danger-value, 17%);
--brand-danger-25: darken(@brand-danger-value, 25%);
--brand-danger-lighten-20: lighten(@brand-danger-value, 20%);
--state-danger-bg: @state-danger-bg-value;
--state-danger-text: @state-danger-text-value;
--state-danger-bg-5: darken(@state-danger-bg-value, 5%);
--state-danger-bg-10: darken(@state-danger-bg-value, 10%);
--brand-info-5: darken(@brand-info-value, 5%);
--brand-info-10: darken(@brand-info-value, 10%);
--brand-info-12: darken(@brand-info-value, 12%);
--brand-info-15: darken(@brand-info-value, 15%);
--brand-info-17: darken(@brand-info-value, 17%);
--brand-info-25: darken(@brand-info-value, 25%);
--state-info-bg: @state-info-bg-value;
--state-info-bg-5: darken(@state-info-bg-value, 5%);
--state-info-bg-10: darken(@state-info-bg-value, 10%);
--state-info-bg-12: darken(@state-info-bg-value, 12%);
--state-info-bg-17: darken(@state-info-bg-value, 17%);
--state-info-bg-25: darken(@state-info-bg-value, 25%);
--state-info-bg-mix: @state-info-bg-mix-value;
--state-info-bg-mix-5: darken(@state-info-bg-mix-value, 5%);
--state-info-bg-mix-10: darken(@state-info-bg-mix-value, 10%);
--state-info-bg-mix-12: darken(@state-info-bg-mix-value, 12%);
--state-info-bg-mix-17: darken(@state-info-bg-mix-value, 17%);
--state-info-bg-mix-25: darken(@state-info-bg-mix-value, 25%);
--brand-success-5: darken(@brand-success-value, 5%);
--brand-success-10: darken(@brand-success-value, 10%);
--brand-success-12: darken(@brand-success-value, 12%);
--brand-success-15: darken(@brand-success-value, 15%);
--brand-success-17: darken(@brand-success-value, 17%);
--brand-success-25: darken(@brand-success-value, 25%);
--state-success-text: @state-success-text-value;
--state-success-bg: @state-success-bg-value;
--state-success-bg-5: darken(@state-success-bg-value, 5%);
--state-success-bg-10: darken(@state-success-bg-value, 10%);
--state-success-text-10: darken(@state-success-text-value, 10%);
--state-success-text-10l: lighten(darken(@state-success-text-value, 10%), 20);
--brand-warning-5: darken(@brand-warning-value, 5%);
--brand-warning-10: darken(@brand-warning-value, 10%);
--brand-warning-12: darken(@brand-warning-value, 12%);
--brand-warning-15: darken(@brand-warning-value, 15%);
--brand-warning-17: darken(@brand-warning-value, 17%);
--brand-warning-25: darken(@brand-warning-value, 25%);
--state-warning-bg: @state-warning-bg-value;
--state-warning-text: @state-warning-text-value;
--state-warning-bg-5: darken(@state-warning-bg-value, 5%);
--state-warning-bg-10: darken(@state-warning-bg-value, 10%);
--navbar-inverse-color: @navbar-inverse-color-value;
--navbar-inverse-bg: @navbar-inverse-bg-value;
--navbar-inverse-link-color: @navbar-inverse-link-color-value;
--navbar-inverse-link-active-bg: darken(@navbar-inverse-bg-value, 10%);
--navbar-inverse-border: @navbar-inverse-border-value;
--navbar-inverse-toggle-hover-bg: darken(@navbar-inverse-bg-value, 10%);
--navbar-inverse-bg-7: darken(@navbar-inverse-bg-value, 7%);
--navbar-inverse-link-hover-color: @navbar-inverse-link-hover-color-value;
--navbar-inverse-link-hover-bg: @navbar-inverse-link-hover-bg-value;
--navbar-inverse-link-disabled-color: @navbar-inverse-link-disabled-color-value;
--navbar-inverse-link-disabled-bg: @navbar-inverse-link-disabled-bg-value;
--input-border: @input-border-value;
--input-border-focus: @input-border-focus-value;
--input-border-focus-rgba: rgba(
red(@input-border-focus-value),
green(@input-border-focus-value),
blue(@input-border-focus-value),
.6
);
--modal-backdrop-bg: @modal-backdrop-bg-value;
--text-color: @text-color-value;
--link-color: @link-color-value;
--link-hover-color: @link-hover-color-value;
--table-bg-accent: @table-bg-accent-value;
--code-bg: @code-bg-value;
--default-border-color: @default-border-color-value;
--panel-primary-border: @panel-primary-border-value;
--panel-default-border: @panel-default-border-value;
--panel-warning-bg: @panel-warning-bg-value;
--btn-default-bg: @btn-default-bg-value;
--btn-default-border: @btn-default-border-value;
--login-panel-heading-bg: @login-panel-heading-bg-value;
}
frontend/less/espo/value-variables.less
+73
View File
@@ -0,0 +1,73 @@
@main-gray-value: #E8ECED;
@white-color-value: #fafbfc;
@gray-base-value: #000;
@gray-soft-value: lighten(@gray-base-value, 39.0%);
@gray-dark-value: lighten(@gray-base-value, 20%);
@gray-light-value: lighten(@gray-base, 46.7%);
@gray-lighter-value: lighten(@gray-base-value, 93.5%);
@gray-light-value: #999;
@body-bg-value: #FEFEFE;
@brand-primary-value: #5184B0;
@brand-danger-value: #CF605D;
@brand-info-value: #a595c9;
@brand-success-value: #87C956;
@brand-warning-value: #EF990E;
@brand-primary-text-value: #FFF;
@state-primary-text-value: #5b9aca;
@state-success-bg-value: lighten(spin(@brand-success-value, 5), 31%);
@state-success-text-value: darken(spin(@brand-success-value, 7), 17%);
@state-info-bg-value: #e5ddf8;
@state-info-text-value: #83779c;
@state-warning-bg-value: #fcf8e3;
@state-warning-text-value: #9E7328;
@state-danger-text-value: #ad4846;
@state-danger-bg-value: #f2dede;
@state-info-bg-mix-value: mix(@state-info-bg-value, lighten(@gray-base-value, 93.5%), 50%);
@navbar-inverse-color-value: @gray-light-value;
@navbar-inverse-bg-value: #4A6492;
@navbar-inverse-border-value: transparent;
@navbar-inverse-link-color-value: #DFDFDF;
@navbar-inverse-link-hover-color-value: #fff;
@navbar-inverse-link-hover-bg-value: transparent;
@navbar-inverse-link-disabled-color-value: #444;
@navbar-inverse-link-disabled-bg-value: transparent;
@input-border-value: #D1D5D6;
@input-border-focus-value: #66afe9;
@modal-backdrop-bg-value: #DBDBDB;
@text-color-value: @gray-dark-value;
@link-color-value: @brand-primary-value;
@link-hover-color-value: darken(@link-color-value, 15%);
@panel-bg-value: @body-bg-value;
@table-bg-accent-value: #f9f9f9;
@code-bg-value: #f9f9f9;
@default-border-color-value: @main-gray;
@panel-primary-border-value: darken(@brand-primary-value, 12%);
@panel-default-border-value: @default-border-color;
@panel-warning-bg-value: #efda97;
@btn-default-bg-value: @main-gray;
@btn-default-border-value: @main-gray;
@login-panel-heading-bg-value: @navbar-inverse-bg-value;
@gray-lighter-orange-mix-value: mix(orange, @gray-lighter-value, 50%);
frontend/less/espo/variables.less
+123 -54
View File
@@ -1,5 +1,83 @@
@line-height-base: 1.36;
@line-height-computed: floor(@font-size-base * @line-height-base);
@gray-base: @gray-base-value;
@white-color: var(--white-color);
@body-bg: var(--body-bg);
@panel-bg: var(--panel-bg);
@main-gray: var(--main-gray);
@gray-soft: var(--gray-soft);
@gray-dark: var(--gray-dark);
@gray-light: var(--gray-light);
@gray-lighter: var(--gray-lighter);
@btn-default-bg: var(--btn-default-bg);
@btn-default-border: var(--btn-default-border);
@btn-danger-bg: var(--brand-danger-5);
@btn-info-border: var(--brand-info-5);
@btn-success-border: var(--brand-success-5);
@btn-warning-border: var(--brand-warning-5);
@btn-default-bg-10: var(--main-gray-5);
@btn-default-border-12: var(--main-gray-12);
@btn-default-bg-17: var(--main-gray-17);
@btn-default-border-25: var(--main-gray-25);
@btn-primary-bg-10: var(--brand-primary-10);
@btn-primary-border-12: var(--brand-primary-12);
@btn-primary-bg-17: var(--brand-primary-17);
@btn-primary-border-25: var(--brand-primary-25);
@btn-danger-bg-10: var(--brand-danger-10);
@btn-danger-border-12: var(--brand-danger-12);
@btn-danger-bg-17: var(--brand-danger-17);
@btn-danger-border-25: var(--brand-danger-25);
@btn-info-bg-10: var(--brand-info-10);
@btn-info-border-12: var(--brand-info-12);
@btn-info-bg-17: var(--brand-info-17);
@btn-info-border-25: var(--brand-info-25);
@btn-success-bg-10: var(--brand-success-10);
@btn-success-border-12: var(--success-info-12);
@btn-success-bg-17: var(--brand-success-17);
@btn-success-border-25: var(--brand-success-25);
@btn-warning-bg-10: var(--brand-warning-10);
@btn-warning-border-12: var(--warning-info-12);
@btn-warning-bg-17: var(--brand-warning-17);
@btn-warning-border-25: var(--brand-warning-25);
@brand-primary-10: var(--brand-primary-10);
@brand-danger-10 : var(--brand-danger-10);
@brand-info-10: var(--brand-info-10);
@brand-success-10: var(--brand-success-10);
@brand-warning-10: var(--brand-warning-10);
@default-heading-bg-color: @main-gray;
@brand-primary: var(--brand-primary);
@brand-danger: var(--brand-danger);
@brand-info: var(--brand-info);
@brand-success: var(--brand-success);
@brand-warning: var(--brand-warning);
@text-color: var(--text-color);
@link-color: var(--link-color);
@link-hover-color: var(--link-hover-color);
@table-bg-hover: @default-heading-bg-color;
@table-bg-active-5: var(--main-gray-5);
@list-group-active-text-color: var(--main-gray-lighten-40);
@input-border: var(--input-border);
@input-border-focus: var(--input-border-focus);
@line-height-base: 1.36;
@line-height-computed: floor(@font-size-base * @line-height-base);
@headings-line-height: 1;
@font-family-sans-serif: 'Open Sans', sans-serif;
@@ -47,7 +125,7 @@
@button-radius: 0px;
@modal-title-padding: 10px;
@modal-backdrop-bg: #DBDBDB;
@modal-backdrop-bg: var(--modal-backdrop-bg);
@padding-base-horizontal: 10px;
@@ -56,89 +134,75 @@
@tob-bar-height: @navbar-height;
@brand-primary: #5184B0;
@brand-danger: #CF605D;
@brand-info: #a595c9;
@brand-success: #87C956;
@brand-warning: #EF990E;
@state-success-bg: var(--state-success-bg);
@state-success-text: var(--state-success-text);
@state-info-bg: #e5ddf8;
@state-info-text: #83779c;
@state-success-bg-5: var(--state-success-bg-5);
@state-success-bg-10: var(--state-success-bg-10);
@state-warning-bg: #fcf8e3;
@state-warning-text: #9E7328;
@state-success-border: var(--state-success-bg-5);
@state-success-text-10: var(--state-success-text-10);
@state-success-bg: lighten(spin(@brand-success, 5), 31%);
@state-success-text: darken(spin(@brand-success, 7), 17%);
@state-danger-border: var(--state-danger-bg-10);
@state-danger-text: #ad4846;
@state-danger-bg: #f2dede;
@state-danger-border: darken(spin(@state-danger-bg, -10), 5%);
@state-info-bg: var(--state-info-bg);
@state-info-bg-5: var(--state-info-bg-5);
@state-primary-text: #5b9aca;
@state-info-border: var(--state-info-bg-10);
@panel-warning-bg: #efda97;
@state-warning-border: var(--state-warning-bg-10);
@panel-primary-border: lighten(@brand-primary, 12%);
@panel-warning-bg: var(--panel-warning-bg);
@gray-light: #999;
@main-gray: #E8ECED;
@panel-primary-border: var(--panel-primary-border);
@input-border: #D1D5D6;
@table-bg-accent: var(--table-bg-accent);
@code-bg: var(--code-bg);
@btn-default-bg: @main-gray;
@btn-default-border: @main-gray;
@table-bg-accent: #f9f9f9;
@code-bg: #f9f9f9;
@code-color: @text-color;
@pre-border-color: @main-gray;
@pre-bg: @code-bg;
@btn-primary-border: var(--brand-primary-5);
@btn-success-border: @btn-success-bg;
@btn-primary-border: @btn-primary-bg;
@btn-danger-border: @btn-danger-bg;
@btn-info-border: @btn-info-bg;
@btn-warning-border: @btn-warning-bg;
@navbar-inverse-color: @gray-light;
@navbar-inverse-bg: #4A6492;
@navbar-inverse-border: transparent;
@navbar-inverse-link-color: #DFDFDF;
@navbar-inverse-link-hover-color: #fff;
@navbar-inverse-link-hover-bg: transparent;
@navbar-inverse-link-active-color: @navbar-inverse-link-hover-color;
@navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%);
@navbar-inverse-link-disabled-color: #444;
@navbar-inverse-link-disabled-bg: transparent;
@navbar-inverse-toggle-hover-bg: darken(@navbar-inverse-bg, 10%);
@white-color: #fafbfc;
@navbar-inverse-color: var(--navbar-inverse-color);
@navbar-inverse-bg: var(--navbar-inverse-bg);
@navbar-inverse-link-active-bg: var(--navbar-inverse-link-active-bg);
@navbar-inverse-border: var(--navbar-inverse-border);
@navbar-inverse-link-color: var(--navbar-inverse-link-color);
@navbar-inverse-toggle-hover-bg: var(--navbar-inverse-toggle-hover-bg);
@navbar-inverse-link-hover-color: var(--navbar-inverse-link-hover-color);
@navbar-inverse-link-hover-bg: var(--navbar-inverse-link-hover-bg);
@navbar-inverse-link-active-color: @navbar-inverse-link-hover-color;
@navbar-inverse-link-disabled-color: var(--navbar-inverse-link-disabled-color);
@navbar-inverse-link-disabled-bg: var(--navbar-inverse-link-disabled-bg);
@panel-primary-text: @white-color;
@gray-soft: lighten(@gray-base, 39.0%);
@body-bg: #FEFEFE;
@panel-bg: #FFF;
@default-border-color: @main-gray;
@default-heading-bg-color: @main-gray;
@well-bg: @default-heading-bg-color;
@breadcrumb-bg: @default-heading-bg-color;
@table-bg-hover: @default-heading-bg-color;
@well-border: var(--main-gray-7);
@progress-bg: @default-heading-bg-color;
@list-group-hover-bg: @default-heading-bg-color;
@panel-footer-bg: @default-heading-bg-color;
@panel-default-heading-bg: @default-heading-bg-color;
@panel-default-border: @default-border-color;
@default-border-color: var(--default-border-color);
@panel-default-border: var(--default-border-color);
@list-group-border: @default-border-color;
@panel-inner-border: @default-border-color;
@panel-default-border: @default-border-color;
@thumbnail-border: @default-border-color;
@table-border-color: @default-border-color;
@navbar-default-toggle-hover-bg: @default-border-color;
@@ -160,7 +224,7 @@
@navbar-height-xsmall: 37px;
@navbar-logo-height-xsmall: 37px;
@login-panel-heading-bg: @navbar-inverse-bg;
@login-panel-heading-bg: var(--login-panel-heading-bg);
@logo-width: 181px;
@logo-height: @navbar-height;
@@ -193,3 +257,8 @@
@global-search-panel-width: 600px;
@well-padding: 14px;
@dropdown-link-hover-color: var(--gray-dark-5);
@popover-bg: @white-color;
@popover-title-bg: var(--white-color-3);
frontend/less/hazyblue-vertical/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../variables.less";
frontend/less/hazyblue-vertical/main.less
+2
View File
@@ -1,10 +1,12 @@
@import "../espo/init.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "../espo-vertical/variables.less";
@import "../espo/mixins.less";
@import "../espo/root-variables.less";
@import "../espo/misc.less";
@import "../espo-vertical/layout.less";
@import "../espo/custom.less";
frontend/less/hazyblue-vertical/variables.less
+25 -25
View File
@@ -1,34 +1,34 @@
@navbar-inverse-bg: #546E7A;
@body-bg: #f3f3f3;
@top-navbar-bg-color: @body-bg;
@body-bg-value: #f3f3f3;
@white-color-value: #FFF;
@panel-bg-value: @white-color-value;
@modal-backdrop-bg-value: #a3b3c7;
@navbar-inverse-bg-value: #546E7A;
@state-info-bg-value: #dbd0f5;
@state-info-bg-value: #e2e2e2;
@state-info-text-value: @text-color;
@brand-success-value: #85b75f;
@brand-primary-value: #537898;
@brand-info-value: #aba8cc;
@brand-warning-value: #e4a133;
@panel-default-border-value: #dcdcdc;
@panel-primary-border-value: #849fab;
@btn-default-bg-value: #f7f7f7;
@btn-default-border-value: #cccccc;
@input-border-focus-value: #99b4cc;
@navbar-bg: @body-bg;
@white-color: #FFF;
@top-navbar-bg-color: @body-bg;
@panel-default-heading-bg: @white-color;
@modal-header-bg: @white-color;
@panel-border-width: 0;
@panel-default-border: #dcdcdc;
@btn-default-bg: #f7f7f7;
@btn-default-border: #cccccc;
@brand-success: #85b75f;
@brand-primary: #537898;
@brand-info: #aba8cc;
@brand-warning: #e4a133;
@state-info-bg: #dbd0f5;
@panel-primary-border: #849fab;
@state-info-bg: #e2e2e2;
@state-info-text: @text-color;
@well-bg: @white-color;
@modal-backdrop-bg: #a3b3c7;
@input-border-focus: #99b4cc;
@panel-border-width: 0;
frontend/less/hazyblue/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../../hazyblue-vertical/variables.less";
frontend/less/hazyblue/main.less
+2
View File
@@ -1,10 +1,12 @@
@import "../espo/init.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "../hazyblue-vertical/variables.less";
@import "../espo/mixins.less";
@import "../espo/root-variables.less";
@import "../espo/misc.less";
@import "../espo/layout.less";
@import "../espo/custom.less";
frontend/less/sakura-vertical/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../../sakura/variables.less";
frontend/less/sakura-vertical/main.less
+6 -11
View File
@@ -1,18 +1,13 @@
@import "../espo/init.less";
@import (css) "espo-vertical.css";
@import "../espo/bootstrap/variables.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "../sakura/variables.less";
@import "../espo-vertical/variables.less";
@import "../espo/mixins.less";
@import "../espo/misc.less";
@import "../espo-vertical/layout.less";
@import "../espo/custom.less";
@import "../espo-vertical/custom.less";
@import "../espo/utilities.less";
@import "../espo/root-variables.less";
body {
--theme-name: SakuraVertical;
--theme-name: SakuraVertical !important;
}
frontend/less/sakura/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../variables.less";
frontend/less/sakura/main.less
+7 -8
View File
@@ -1,14 +1,13 @@
@import "../espo/init.less";
@import (css) "espo.css";
@import "../espo/bootstrap/variables.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "variables.less";
@import "../espo/mixins.less";
@import "../espo/misc.less";
@import "../espo/layout.less";
@import "../espo/custom.less";
@import "../espo/utilities.less";
@import "../espo/root-variables.less";
body {
--theme-name: Sakura;
--theme-name: Sakura !important;
}
frontend/less/sakura/variables.less
+10 -11
View File
@@ -1,15 +1,14 @@
@input-border-value: #ececec;
@body-bg-value: #FAFBFC;
@main-gray: #ececec;
@input-border: #ececec;
@main-gray-value: #ececec;
@body-bg: #FAFBFC;
@brand-primary-value: #6490b7;
@brand-success-value: #83CD77;
@brand-warning-value: #e4a133;
@brand-primary: #6490b7;
@brand-success: #83CD77;
@brand-warning: #e4a133;
@navbar-inverse-color-value: #FFF;
@navbar-inverse-bg-value: #9a6373;
@navbar-inverse-link-color-value: #F7F7F7;
@navbar-inverse-color: #FFF;
@navbar-inverse-bg: #9a6373;
@navbar-inverse-link-color: #F7F7F7;
@login-panel-heading-bg: @brand-primary;
@login-panel-heading-bg-value: @brand-primary-value;
frontend/less/violet-vertical/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../../violet/variables.less";
frontend/less/violet-vertical/main.less
+6 -11
View File
@@ -1,18 +1,13 @@
@import "../espo/init.less";
@import (css) "espo-vertical.css";
@import "../espo/bootstrap/variables.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "../violet/variables.less";
@import "../espo-vertical/variables.less";
@import "../espo/mixins.less";
@import "../espo/misc.less";
@import "../espo-vertical/layout.less";
@import "../espo/custom.less";
@import "../espo-vertical/custom.less";
@import "../espo/utilities.less";
@import "../espo/root-variables.less";
body {
--theme-name: VioletVertical;
--theme-name: VioletVertical !important;
}
frontend/less/violet/iframe/main.less
+1
View File
@@ -1,4 +1,5 @@
@import "../../espo/bootstrap/variables.less";
@import "../../espo/value-variables.less";
@import "../../espo/variables.less";
@import "../variables.less";
frontend/less/violet/main.less
+7 -8
View File
@@ -1,14 +1,13 @@
@import "../espo/init.less";
@import (css) "espo.css";
@import "../espo/bootstrap/variables.less";
@import "../espo/value-variables.less";
@import "../espo/variables.less";
@import "variables.less";
@import "../espo/mixins.less";
@import "../espo/misc.less";
@import "../espo/layout.less";
@import "../espo/custom.less";
@import "../espo/utilities.less";
@import "../espo/root-variables.less";
body {
--theme-name: Violet;
--theme-name: Violet !important;
}
frontend/less/violet/variables.less
+12 -13
View File
@@ -1,18 +1,17 @@
@input-border-value: @main-gray;
@body-bg-value: #FAFBFC;
@main-gray: #E4E7F2;
@input-border: @main-gray;
@link-color-value: #6e86ca;
@body-bg: #FAFBFC;
@main-gray-value: #E4E7F2;
@brand-primary: #768ED2;
@brand-success: #7BC169;
@brand-danger: #D06473;
@brand-warning: #e4a133;
@brand-primary-value: #768ED2;
@brand-success-value: #7BC169;
@brand-danger-value: #D06473;
@brand-warning-value: #e4a133;
@link-color: #6e86ca;
@navbar-inverse-color-value: #FFF;
@navbar-inverse-bg-value: #8E5C9C;
@navbar-inverse-link-color-value: #F7F7F7;
@navbar-inverse-color: #FFF;
@navbar-inverse-bg: #8E5C9C;
@navbar-inverse-link-color: #F7F7F7;
@login-panel-heading-bg: @brand-primary;
@login-panel-heading-bg-value: @brand-primary-value;