Reshuffle the base color scheme again
Restyle the component area in the CMS
This commit is contained in:
Samuel Georges
parent
ff207b91cf
commit
f900ed8f62
|
|
@ -141,11 +141,11 @@
|
|||
.control-simplelist.is-divided li .heading,.control-simplelist.is-selectable li .heading{font-size:14px;font-weight:bold}
|
||||
.control-simplelist.is-divided li:last-child,.control-simplelist.is-selectable li:last-child{border-bottom:none}
|
||||
.control-simplelist.is-selectable li a{padding:5px 10px;margin:-5px -10px;display:block;color:#333333}
|
||||
.control-simplelist.is-selectable li:hover{background:#4da7e8;cursor:pointer}
|
||||
.control-simplelist.is-selectable li:hover{background:#4ea5e0;cursor:pointer}
|
||||
.control-simplelist.is-selectable li:hover,.control-simplelist.is-selectable li:hover a{color:white}
|
||||
.control-simplelist.is-selectable li:hover a{text-decoration:none}
|
||||
.control-simplelist.is-selectable li.active a{background:#f0f0f0}
|
||||
.control-simplelist.is-selectable li.active a:hover{background:#4da7e8}
|
||||
.control-simplelist.is-selectable li.active a:hover{background:#4ea5e0}
|
||||
.list-preview .control-simplelist.is-selectable ul{margin-bottom:0}
|
||||
.drag-noselect{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
|
||||
.control-scrollbar{position:relative;overflow:hidden;height:100%;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0)}
|
||||
|
|
@ -267,14 +267,14 @@
|
|||
.control-treelist li > div.record{margin:0;font-size:12px;margin-bottom:5px;position:relative;display:block}
|
||||
.control-treelist li > div.record:before{color:#bdc3c7;font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f111";font-size:6px;position:absolute;left:-18px;top:11px}
|
||||
.control-treelist li > div.record > a.move{display:inline-block;padding:7px 0 7px 10px;text-decoration:none;color:#bdc3c7}
|
||||
.control-treelist li > div.record > a.move:hover{color:#4da7e8}
|
||||
.control-treelist li > div.record > a.move:hover{color:#4ea5e0}
|
||||
.control-treelist li > div.record > a.move:before{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f0c9"}
|
||||
.control-treelist li > div.record > span{color:#666666;display:inline-block;padding:7px 15px 7px 5px}
|
||||
.control-treelist li.dragged{position:absolute;z-index:2000;width:auto !important;height:auto !important}
|
||||
.control-treelist li.dragged > div.record{opacity:0.5;filter:alpha(opacity=50);background:#4da7e8 !important}
|
||||
.control-treelist li.dragged > div.record{opacity:0.5;filter:alpha(opacity=50);background:#4ea5e0 !important}
|
||||
.control-treelist li.dragged > div.record > a.move:before,.control-treelist li.dragged > div.record > span{color:white}
|
||||
.control-treelist li.dragged > div.record:before{display:none}
|
||||
.control-treelist li.placeholder{display:inline-block;position:relative;background:#4da7e8 !important;height:25px;margin-bottom:5px}
|
||||
.control-treelist li.placeholder{display:inline-block;position:relative;background:#4ea5e0 !important;height:25px;margin-bottom:5px}
|
||||
.control-treelist li.placeholder:before{display:block;position:absolute;font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f053";color:#d35714;left:-10px;top:8px;z-index:2000}
|
||||
.control-treeview{margin-bottom:40px; }
|
||||
.control-treeview ol{margin:0;padding:0;list-style:none;background:#ffffff}
|
||||
|
|
@ -428,7 +428,8 @@
|
|||
.sidenav-tree ul.top-level > li > ul li a span.header{color:#ffffff;font-size:15px;margin-bottom:5px}
|
||||
.sidenav-tree ul.top-level > li > ul li a span.description{color:rgba(255,255,255,0.6);font-size:13px}
|
||||
.sidenav-tree ul.top-level > li > ul li:hover a,.sidenav-tree ul.top-level > li > ul li.active a{opacity:1;filter:alpha(opacity=100)}
|
||||
.sidenav-tree ul.top-level > li > ul li.active a{color:rgba(255,255,255,0.91)}
|
||||
.sidenav-tree ul.top-level > li > ul li.active{border-left:5px solid #3498db}
|
||||
.sidenav-tree ul.top-level > li > ul li.active a{color:rgba(255,255,255,0.91);padding-right:20px}
|
||||
.sidenav-tree ul.top-level > li > ul li.active a span.header{color:#ffffff}
|
||||
.sidenav-tree ul.top-level > li > ul li.active a span.description{color:rgba(255,255,255,0.91)}
|
||||
.sidenav-tree ul.top-level > li > ul li:last-child a{border-bottom:none}
|
||||
|
|
|
|||
|
|
@ -95,7 +95,7 @@
|
|||
// Use two triangles to achieve the darkening effect
|
||||
&:before,
|
||||
&:after {
|
||||
.triangle(down, 15px, 8px, @brand-secondary);
|
||||
.triangle(down, 15px, 8px, @brand-primary);
|
||||
position: absolute;
|
||||
left: 15px;
|
||||
bottom: -8px;
|
||||
|
|
@ -157,19 +157,24 @@
|
|||
.opacity(1);
|
||||
}
|
||||
|
||||
&.active a {
|
||||
//background: @color-sidebarnav-tree-active-bg;
|
||||
color: @color-sidebarnav-tree-active-text;
|
||||
&.active {
|
||||
border-left: 5px solid @brand-accent;
|
||||
|
||||
span.header {
|
||||
color: @color-sidebarnav-tree-active-header;
|
||||
}
|
||||
|
||||
span.description {
|
||||
a {
|
||||
color: @color-sidebarnav-tree-active-text;
|
||||
padding-right: 20px;
|
||||
|
||||
span.header {
|
||||
color: @color-sidebarnav-tree-active-header;
|
||||
}
|
||||
|
||||
span.description {
|
||||
color: @color-sidebarnav-tree-active-text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&:last-child a {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,7 +31,6 @@
|
|||
@color-footer-text: #666666;
|
||||
|
||||
@color-sidebarnav-active-text: #ffffff;
|
||||
//@color-sidebarnav-active-bg: #1f99dc;
|
||||
@color-sidebarnav-active-icon: #ffffff;
|
||||
@color-sidebarnav-inactive-text: rgba(255,255,255,.6);
|
||||
@color-sidebarnav-inactive-icon: rgba(255,255,255,.6);
|
||||
|
|
@ -45,9 +44,8 @@
|
|||
@color-sidebarnav-tree-inactive-text: #ffffff;
|
||||
@color-sidebarnav-tree-active-header: #ffffff;
|
||||
@color-sidebarnav-tree-inactive-bg: transparent;
|
||||
//@color-sidebarnav-tree-active-bg: #1F99DC;
|
||||
@color-sidebarnav-tree-active-text: rgba(255,255,255,.91);
|
||||
@color-sidebarnav-tree-active-marker: #e67e22;
|
||||
@color-sidebarnav-tree-active-marker: @brand-secondary;
|
||||
@color-sidebarnav-back-link-bg: #2b3e50;
|
||||
@color-sidebarnav-back-link-text: #bdc3c7;
|
||||
|
||||
|
|
@ -107,7 +105,7 @@
|
|||
@color-fancy-primary-tabs-active-bg: #fafafa;
|
||||
@color-fancy-primary-tabs-inactive-bg: #d5d9d8;
|
||||
|
||||
@color-fancy-form-tabless-fields-bg: #e67e22;
|
||||
@color-fancy-form-tabless-fields-bg: @brand-secondary;
|
||||
@color-fancy-form-label: rgba(255, 255, 255, .5);
|
||||
@color-fancy-form-text: #ffffff;
|
||||
@color-fancy-form-text-selection: #d35400;
|
||||
|
|
@ -115,7 +113,7 @@
|
|||
@color-fancy-form-inactive-tab: #b9530f;
|
||||
|
||||
@color-sortable-caret: #999999;
|
||||
@color-sortable-active: #e67e22;
|
||||
@color-sortable-active: @brand-secondary;
|
||||
|
||||
@color-report-widget-title: #7e8c8d;
|
||||
@color-report-widget-control-inactive: #b6b6b6;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
.tab-collapse-icon {
|
||||
position: absolute;
|
||||
display: block;
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
outline: none;
|
||||
.opacity(0.6);
|
||||
|
|
|
|||
|
|
@ -74,7 +74,6 @@
|
|||
}
|
||||
|
||||
&.active a {
|
||||
//background: @color-sidebarnav-active-bg;
|
||||
.nav-label,
|
||||
.nav-icon {
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,.3);
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
<div class="layout-relative">
|
||||
<nav
|
||||
id="layout-sidenav"
|
||||
class="layout-sidenav bg-s"
|
||||
class="layout-sidenav bg-p"
|
||||
data-active-class="active"
|
||||
data-control="sidenav">
|
||||
<ul class="nav">
|
||||
|
|
|
|||
|
|
@ -30,9 +30,9 @@ class BrandSettings extends Model
|
|||
|
||||
const CACHE_KEY = 'backend::brand.custom_css';
|
||||
|
||||
const PRIMARY_COLOR = '#3498db'; // Peter River
|
||||
const SECONDARY_COLOR = '#34495e'; // Wet Asphalt
|
||||
const ACCENT_COLOR = '#e67e22'; // Pumpkin
|
||||
const PRIMARY_COLOR = '#34495e'; // Wet Asphalt
|
||||
const SECONDARY_COLOR = '#e67e22'; // Pumpkin
|
||||
const ACCENT_COLOR = '#3498db'; // Peter River
|
||||
|
||||
const INLINE_MENU = 'inline';
|
||||
const TILE_MENU = 'tile';
|
||||
|
|
|
|||
|
|
@ -27,16 +27,30 @@
|
|||
.bg-s-s20 { background-color: saturate(@brand-secondary, 20%); }
|
||||
.bg-a-s20 { background-color: saturate(@brand-accent, 20%); }
|
||||
|
||||
@custom-dark-primary: mix(black, desaturate(@brand-primary, 35%), 20%);
|
||||
@custom-dark-accent: mix(black, saturate(@brand-accent, 20%), 25%);
|
||||
@custom-dark-secondary: mix(black, saturate(@brand-secondary, 5%), 15%);
|
||||
@custom-dark-accent: mix(black, desaturate(@brand-accent, 35%), 20%);
|
||||
@custom-dark-secondary: mix(black, saturate(@brand-secondary, 20%), 25%);
|
||||
@custom-dark-primary: mix(black, saturate(@brand-primary, 5%), 15%);
|
||||
|
||||
//
|
||||
// Sidenav
|
||||
//
|
||||
|
||||
#layout-sidenav ul li a .nav-label,
|
||||
#layout-sidenav ul li a .nav-icon {
|
||||
text-shadow: 0 -1px 0 fade(darken(@brand-primary, 20%), 60%);
|
||||
}
|
||||
|
||||
//
|
||||
// Sidenav Tree
|
||||
//
|
||||
|
||||
.sidenav-tree ul.top-level > li > div.group:before {
|
||||
border-top-color: @brand-secondary;
|
||||
.sidenav-tree ul.top-level > li {
|
||||
> div.group:before {
|
||||
border-top-color: @brand-primary;
|
||||
}
|
||||
> ul li.active {
|
||||
border-color: @brand-accent;
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
|
|
@ -44,7 +58,7 @@
|
|||
//
|
||||
|
||||
body.outer {
|
||||
background: @custom-dark-secondary;
|
||||
background: @custom-dark-primary;
|
||||
}
|
||||
|
||||
//
|
||||
|
|
@ -65,19 +79,19 @@ body.outer {
|
|||
|
||||
div.control-popover {
|
||||
.popover-head {
|
||||
background: @custom-dark-accent;
|
||||
background: @custom-dark-secondary;
|
||||
}
|
||||
|
||||
&.placement-bottom .popover-head:before {
|
||||
border-bottom-color: @custom-dark-accent;
|
||||
border-bottom-color: @custom-dark-secondary;
|
||||
}
|
||||
|
||||
&.placement-left .popover-head:before {
|
||||
border-left-color: @custom-dark-accent;
|
||||
border-left-color: @custom-dark-secondary;
|
||||
}
|
||||
|
||||
&.placement-right .popover-head:before {
|
||||
border-right-color: @custom-dark-accent;
|
||||
border-right-color: @custom-dark-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -86,7 +100,7 @@ div.control-popover {
|
|||
//
|
||||
|
||||
.modal-header {
|
||||
background: @custom-dark-accent;
|
||||
background: @custom-dark-secondary;
|
||||
}
|
||||
|
||||
//
|
||||
|
|
@ -97,21 +111,29 @@ table.table.data {
|
|||
tbody {
|
||||
tr.active td {
|
||||
&:first-child {
|
||||
border-left: 3px solid @brand-accent;
|
||||
border-left: 3px solid @brand-secondary;
|
||||
}
|
||||
}
|
||||
// tr:not(.no-data):hover td,
|
||||
// tr:not(.no-data).selected td {
|
||||
// background: mix(white, @brand-accent, 13%) !important;
|
||||
// }
|
||||
// tr:not(.no-data):active td {
|
||||
// background: @brand-accent !important;
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Fancy Layout
|
||||
//
|
||||
|
||||
.fancy-layout .form-tabless-fields {
|
||||
background: @brand-accent;
|
||||
background: @brand-secondary;
|
||||
|
||||
.loading-indicator-container .loading-indicator {
|
||||
background: @brand-accent;
|
||||
background: @brand-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -119,23 +141,30 @@ table.table.data {
|
|||
.fancy-layout.control-tabs.master-tabs {
|
||||
> div > div.tabs-container > ul.nav-tabs > li.active a > span.title {
|
||||
&, &:before, &:after {
|
||||
background: @brand-accent;
|
||||
background: @brand-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
> div > div.tabs-container > ul.nav-tabs > li a > span.title {
|
||||
&, &:before, &:after {
|
||||
background-color: mix(black, saturate(@brand-accent, 20%), 31%);
|
||||
background-color: mix(black, saturate(@brand-secondary, 20%), 31%);
|
||||
}
|
||||
}
|
||||
|
||||
> div > div.tabs-container {
|
||||
background-color: @custom-dark-accent;
|
||||
background-color: @custom-dark-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
.fancy-layout .control-tabs.primary-tabs,
|
||||
.fancy-layout.control-tabs.primary-tabs {
|
||||
> div > ul.nav-tabs.master-area {
|
||||
background: @brand-secondary;
|
||||
}
|
||||
}
|
||||
|
||||
.control-filelist ul li.active > a:after {
|
||||
background: @brand-accent;
|
||||
background: @brand-secondary;
|
||||
}
|
||||
|
||||
//
|
||||
|
|
@ -143,21 +172,17 @@ table.table.data {
|
|||
//
|
||||
|
||||
div.control-componentlist {
|
||||
background-color: @custom-dark-secondary;
|
||||
|
||||
&.droppable {
|
||||
background-color: lighten(@custom-dark-secondary, 20%);
|
||||
background-color: lighten(@brand-secondary, 20%);
|
||||
}
|
||||
}
|
||||
|
||||
.fancy-layout {
|
||||
.control-tabs, &.control-tabs {
|
||||
&.primary-tabs {
|
||||
> div > ul.nav-tabs {
|
||||
&.component-area {
|
||||
background: @custom-dark-secondary;
|
||||
}
|
||||
}
|
||||
}
|
||||
//
|
||||
// Stripe Indicator
|
||||
//
|
||||
|
||||
.stripe-loading-indicator {
|
||||
.stripe, .stripe-loaded {
|
||||
background: @brand-accent;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,13 +29,13 @@ tabs:
|
|||
label: backend::lang.branding.primary_color
|
||||
type: colorpicker
|
||||
tab: backend::lang.branding.colors
|
||||
availableColors: [#16a085, #27ae60, #3498db, #9b59b6, #34495e, #f1c40f, #e67e22, #e74c3c, #ecf0f1, #95a5a6]
|
||||
availableColors: [#16a085, #27ae60, #2980b9, #8e44ad, #34495e, #f39c12, #d35400, #c0392b, #7f8c8d, #4f5458]
|
||||
|
||||
secondary_color:
|
||||
label: backend::lang.branding.secondary_color
|
||||
type: colorpicker
|
||||
tab: backend::lang.branding.colors
|
||||
availableColors: [#16a085, #27ae60, #2980b9, #8e44ad, #34495e, #f39c12, #d35400, #c0392b, #bdc3c7, #7f8c8d]
|
||||
availableColors: [#16a085, #27ae60, #3498db, #9b59b6, #34495e, #f39c12, #e67e22, #e74c3c, #708598, #4f5458]
|
||||
|
||||
accent_color:
|
||||
label: backend::lang.branding.accent_color
|
||||
|
|
|
|||
|
|
@ -238,7 +238,7 @@
|
|||
}
|
||||
|
||||
&.active {
|
||||
background: @brand-primary;
|
||||
background: @brand-accent;
|
||||
|
||||
a {color: #ffffff;}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ div.control-componentlist div.components div.layout-cell {
|
|||
.draggable-component-item:hover,
|
||||
.component-list .components div.layout-cell:hover,
|
||||
div.control-componentlist div.components div.layout-cell:hover {
|
||||
background: #3382b6;
|
||||
background: #3498db;
|
||||
}
|
||||
.draggable-component-item > div,
|
||||
.component-list .components div.layout-cell > div,
|
||||
|
|
@ -22,21 +22,27 @@ div.control-componentlist div.components div.layout-cell > div {
|
|||
position: relative;
|
||||
border-right: 1px solid #ecf0f1;
|
||||
}
|
||||
.draggable-component-item > div:hover,
|
||||
.component-list .components div.layout-cell > div:hover,
|
||||
div.control-componentlist div.components div.layout-cell > div:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
.draggable-component-item > div:before,
|
||||
.component-list .components div.layout-cell > div:before,
|
||||
div.control-componentlist div.components div.layout-cell > div:before {
|
||||
position: absolute;
|
||||
font-size: 16px;
|
||||
left: 15px;
|
||||
top: 9px;
|
||||
top: 8px;
|
||||
opacity: 0.7;
|
||||
filter: alpha(opacity=70);
|
||||
}
|
||||
.draggable-component-item > div:hover,
|
||||
.component-list .components div.layout-cell > div:hover,
|
||||
div.control-componentlist div.components div.layout-cell > div:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
.draggable-component-item > div:hover:before,
|
||||
.component-list .components div.layout-cell > div:hover:before,
|
||||
div.control-componentlist div.components div.layout-cell > div:hover:before {
|
||||
opacity: 1;
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
.draggable-component-item > div:after,
|
||||
.component-list .components div.layout-cell > div:after,
|
||||
div.control-componentlist div.components div.layout-cell > div:after {
|
||||
|
|
@ -62,7 +68,7 @@ div.control-componentlist div.components div.layout-cell > div:after {
|
|||
.component-list .components div.layout-cell > div:hover:after,
|
||||
div.control-componentlist div.components div.layout-cell > div:hover:after {
|
||||
text-shadow: none;
|
||||
color: #3382b6;
|
||||
color: #3498db;
|
||||
}
|
||||
.draggable-component-item > div span,
|
||||
.component-list .components div.layout-cell > div span,
|
||||
|
|
@ -76,7 +82,7 @@ div.control-componentlist div.components div.layout-cell > div span.name {
|
|||
padding: 8px 15px 0;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
font-size: 12px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.draggable-component-item > div span.description,
|
||||
.component-list .components div.layout-cell > div span.description,
|
||||
|
|
@ -102,18 +108,20 @@ div.control-componentlist div.components div.layout-cell.placeholder > div:after
|
|||
color: #e0e0e0 !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
[data-field-name="components"] + .control-tabs.primary-tabs {
|
||||
margin-top: -20px;
|
||||
}
|
||||
div.control-componentlist {
|
||||
position: relative;
|
||||
background-color: #2c3e50;
|
||||
padding: 0;
|
||||
-webkit-transition: all 0.3s ease;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
div.control-componentlist.droppable {
|
||||
background-color: #507192;
|
||||
background-color: #f0b37e;
|
||||
}
|
||||
div.control-componentlist.has-components {
|
||||
padding: 10px;
|
||||
padding: 0 20px 20px;
|
||||
}
|
||||
div.control-componentlist div.layout {
|
||||
width: auto;
|
||||
|
|
@ -162,6 +170,10 @@ div.control-componentlist div.components div.layout-cell > div.popover-highlight
|
|||
background: #ffffff !important;
|
||||
color: #475354 !important;
|
||||
}
|
||||
div.control-componentlist div.components div.layout-cell > div.popover-highlight:before {
|
||||
opacity: 0.7;
|
||||
filter: alpha(opacity=70);
|
||||
}
|
||||
div.control-componentlist div.components div.layout-cell > div.popover-highlight:after {
|
||||
color: #ffffff;
|
||||
text-shadow: none;
|
||||
|
|
@ -267,7 +279,7 @@ div.control-componentlist div.components div.layout-cell.adding > div {
|
|||
}
|
||||
.component-list .components div.layout div.layout-row div.layout-cell > div:hover:before {
|
||||
text-shadow: none;
|
||||
color: #3382b6;
|
||||
color: #3498db;
|
||||
}
|
||||
.component-list .components div.layout div.layout-row:first-child div.layout-cell > div:before {
|
||||
display: none;
|
||||
|
|
@ -327,10 +339,6 @@ div.control-componentlist div.components div.layout-cell.adding > div {
|
|||
text-shadow: 0 0 1px #475354 !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.fancy-layout .control-tabs.primary-tabs > div > ul.nav-tabs.component-area,
|
||||
.fancy-layout.control-tabs.primary-tabs > div > ul.nav-tabs.component-area {
|
||||
background: #2c3e50;
|
||||
}
|
||||
body.drag div.control-componentlist div.components div.layout-cell > div,
|
||||
body.drag div.control-componentlist div.components div.layout-cell > div:hover,
|
||||
body.drag div.control-componentlist div.components div.layout-cell > div:active {
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
// Component list
|
||||
// --------------------------------------------------
|
||||
|
||||
@color-component-list-bg: #2C3E50;
|
||||
@color-component-list-bg: @brand-secondary;
|
||||
@color-component-bg: #ffffff;
|
||||
@color-component-text: #475354;
|
||||
@color-component-hover-bg: #3382b6;
|
||||
@color-component-hover-bg: #3498db;
|
||||
@color-component-hover-text: #ffffff;
|
||||
@color-component-placeholder: #e0e0e0;
|
||||
@color-group-bg: #f1f3f4;
|
||||
|
|
@ -47,18 +47,21 @@ div.control-componentlist div.components div.layout-cell {
|
|||
position: relative;
|
||||
border-right: 1px solid @color-panel-light;
|
||||
|
||||
&:hover {
|
||||
color: @color-component-hover-text;
|
||||
}
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
font-size: 16px;
|
||||
left: 15px;
|
||||
top: 9px;
|
||||
top: 8px;
|
||||
.opacity(0.7);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: @color-component-hover-text;
|
||||
&:before {
|
||||
.opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
&:after {
|
||||
.component-lego-icon();
|
||||
}
|
||||
|
|
@ -76,14 +79,14 @@ div.control-componentlist div.components div.layout-cell {
|
|||
padding: 8px 15px 0;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
font-size: 12px;
|
||||
font-size: @font-size-base - 1;
|
||||
}
|
||||
|
||||
&.description {
|
||||
padding: 0 15px 10px;
|
||||
margin-top: 8px;
|
||||
font-weight: 100;
|
||||
font-size: 11px;
|
||||
font-size: @font-size-base - 3;
|
||||
line-height: 150%;
|
||||
}
|
||||
}
|
||||
|
|
@ -99,9 +102,14 @@ div.control-componentlist div.components div.layout-cell {
|
|||
}
|
||||
}
|
||||
|
||||
// Reduce the double standard padding, since the tabs have padding
|
||||
// at the top and the components field has padding at the bottom.
|
||||
[data-field-name="components"] + .control-tabs.primary-tabs {
|
||||
margin-top: -@padding-standard;
|
||||
}
|
||||
|
||||
div.control-componentlist {
|
||||
position: relative;
|
||||
background-color: @color-component-list-bg;
|
||||
padding: 0;
|
||||
.transition(all 0.3s ease);
|
||||
|
||||
|
|
@ -110,7 +118,7 @@ div.control-componentlist {
|
|||
}
|
||||
|
||||
&.has-components {
|
||||
padding: 10px;
|
||||
padding: 0 @padding-standard @padding-standard;
|
||||
}
|
||||
|
||||
div.layout {
|
||||
|
|
@ -164,6 +172,9 @@ div.control-componentlist {
|
|||
border-right-color: rgba(0,0,0,0);
|
||||
background: @color-component-bg!important;
|
||||
color: @color-component-text!important;
|
||||
&:before {
|
||||
.opacity(0.7);
|
||||
}
|
||||
|
||||
&:after {
|
||||
color: @color-component-bg;
|
||||
|
|
@ -353,17 +364,19 @@ div.control-componentlist {
|
|||
}
|
||||
}
|
||||
|
||||
.fancy-layout {
|
||||
.control-tabs, &.control-tabs {
|
||||
&.primary-tabs {
|
||||
> div > ul.nav-tabs {
|
||||
&.component-area {
|
||||
background: @color-component-list-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// Modifies the color of the tab background when components are present
|
||||
// this is no longer required since the colors are the same! :-) -sg
|
||||
// .fancy-layout {
|
||||
// .control-tabs, &.control-tabs {
|
||||
// &.primary-tabs {
|
||||
// > div > ul.nav-tabs {
|
||||
// &.component-area {
|
||||
// background: @color-component-list-bg;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
body.drag div.control-componentlist div.components div.layout-cell {
|
||||
> div, > div:hover, > div:active {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div class="control-componentlist">
|
||||
<div class="control-componentlist bg-s">
|
||||
<?php foreach ($components as $component): ?>
|
||||
<?php if ($component->isHidden): ?>
|
||||
<?= $this->makePartial('component', ['component' => $component]) ?>
|
||||
|
|
|
|||
|
|
@ -366,8 +366,8 @@ cite{font-style:normal}
|
|||
.text-center{text-align:center}
|
||||
.text-justify{text-align:justify}
|
||||
.text-muted{color:#999999}
|
||||
.text-primary{color:#3498db}
|
||||
a.text-primary:hover{color:#217dbb}
|
||||
.text-primary{color:#34495e}
|
||||
a.text-primary:hover{color:#222f3d}
|
||||
.text-success{color:#3c763d}
|
||||
a.text-success:hover{color:#2b542c}
|
||||
.text-info{color:#31708f}
|
||||
|
|
@ -376,8 +376,8 @@ a.text-info:hover{color:#245269}
|
|||
a.text-warning:hover{color:#66512c}
|
||||
.text-danger{color:#a94442}
|
||||
a.text-danger:hover{color:#843534}
|
||||
.bg-primary{color:#fff;background-color:#3498db}
|
||||
a.bg-primary:hover{background-color:#217dbb}
|
||||
.bg-primary{color:#fff;background-color:#34495e}
|
||||
a.bg-primary:hover{background-color:#222f3d}
|
||||
.bg-success{background-color:#dff0d8}
|
||||
a.bg-success:hover{background-color:#c1e2b3}
|
||||
.bg-info{background-color:#d9edf7}
|
||||
|
|
|
|||
|
|
@ -18,37 +18,55 @@
|
|||
var StripeLoadIndicator = function () {
|
||||
var self = this
|
||||
this.counter = 0
|
||||
this.indicator = $('<div/>').addClass('stripe-loading-indicator loaded')
|
||||
.append($('<div />').addClass('stripe'))
|
||||
.append($('<div />').addClass('stripe-loaded'))
|
||||
this.indicator = this.makeIndicator()
|
||||
this.stripe = this.indicator.find('.stripe')
|
||||
this.animationTimer = null
|
||||
|
||||
$(document).ready(function(){
|
||||
$(document.body).append(self.indicator)
|
||||
})
|
||||
}
|
||||
|
||||
StripeLoadIndicator.prototype.makeIndicator = function() {
|
||||
return $('<div/>')
|
||||
.addClass('stripe-loading-indicator loaded')
|
||||
.append($('<div />').addClass('stripe'))
|
||||
.append($('<div />').addClass('stripe-loaded'))
|
||||
}
|
||||
|
||||
StripeLoadIndicator.prototype.show = function() {
|
||||
window.clearTimeout(this.animationTimer)
|
||||
this.indicator.show()
|
||||
this.counter++
|
||||
|
||||
// Restart the animation
|
||||
this.stripe.after(this.stripe = this.stripe.clone()).remove()
|
||||
|
||||
if (this.counter > 1)
|
||||
if (this.counter > 1) {
|
||||
return
|
||||
}
|
||||
|
||||
this.indicator.removeClass('loaded')
|
||||
$(document.body).addClass('loading')
|
||||
}
|
||||
|
||||
StripeLoadIndicator.prototype.hide = function(force) {
|
||||
|
||||
this.counter--
|
||||
if (force !== undefined && force)
|
||||
if (force !== undefined && force) {
|
||||
this.counter = 0
|
||||
}
|
||||
|
||||
if (this.counter <= 0) {
|
||||
this.indicator.addClass('loaded')
|
||||
$(document.body).removeClass('loading')
|
||||
|
||||
// Stripe should be hidden using `display: none` because leaving the animated
|
||||
// element in the rendering tree, even invisible, affects performance.
|
||||
var self = this
|
||||
this.animationTimer = window.setTimeout(function() {
|
||||
self.indicator.hide()
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@
|
|||
|
||||
this.$container = this.createPopupContainer()
|
||||
this.$content = this.$container.find('.modal-content:first')
|
||||
this.$dialog = this.$container.find('.modal-dialog:first')
|
||||
this.$modal = this.$container.modal({ show: false, backdrop: false, keyboard: this.options.keyboard })
|
||||
|
||||
/*
|
||||
|
|
@ -254,6 +255,10 @@
|
|||
this.$modal.on('click.dismiss.popup', '[data-dismiss="popup"]', $.proxy(this.hide, this))
|
||||
this.triggerEvent('popupShow') // Deprecated
|
||||
this.triggerEvent('show.oc.popup')
|
||||
|
||||
// Fixes an issue where the Modal makes `position: fixed` elements relative to itself
|
||||
// https://github.com/twbs/bootstrap/issues/15856
|
||||
this.$dialog.css('transform', 'inherit')
|
||||
}
|
||||
|
||||
Popup.prototype.hide = function() {
|
||||
|
|
@ -262,6 +267,10 @@
|
|||
|
||||
if (this.allowHide)
|
||||
this.$modal.modal('hide')
|
||||
|
||||
// Fixes an issue where the Modal makes `position: fixed` elements relative to itself
|
||||
// https://github.com/twbs/bootstrap/issues/15856
|
||||
this.$dialog.css('transform', '')
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@
|
|||
}
|
||||
|
||||
li {
|
||||
font-size: 15px;
|
||||
font-size: @font-size-base;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 12px 10px 12px 30px;
|
||||
|
|
|
|||
|
|
@ -110,9 +110,9 @@
|
|||
//
|
||||
// Colors
|
||||
// --------------------------------------------------
|
||||
@brand-primary: #3498db;
|
||||
@brand-secondary: #34495e;
|
||||
@brand-accent: #e67e22;
|
||||
@brand-primary: #34495e;
|
||||
@brand-secondary: #e67e22;
|
||||
@brand-accent: #3498db;
|
||||
@brand-success: #31ac5f;
|
||||
@brand-info: #5bc0de;
|
||||
@brand-warning: #f0ad4e;
|
||||
|
|
|
|||
|
|
@ -160,7 +160,7 @@ table.table.data {
|
|||
}
|
||||
}
|
||||
tr:not(.no-data):active td {
|
||||
background: mix(black, @color-list-hover-bg, 10%) !important;
|
||||
background: @color-list-active-bg !important;
|
||||
color: white;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -30,7 +30,8 @@
|
|||
@color-list-stripe-active: #ff9933;
|
||||
@color-list-accent: #ECF0F1;
|
||||
@color-list-norecords-text: #555555;
|
||||
@color-list-hover-bg: #4da7e8;
|
||||
@color-list-hover-bg: mix(white, @brand-accent, 13%);
|
||||
@color-list-active-bg: @brand-accent;
|
||||
@color-list-active-sort: #c63e26;
|
||||
@color-list-grid: #E4E7E8;
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
// --------------------------------------------------
|
||||
|
||||
@color-loading-indicator-text: #999999;
|
||||
@color-stripe-loader: #0090c0;
|
||||
@color-stripe-loader: @brand-accent;
|
||||
@loader-image-path: @image-path;
|
||||
|
||||
.loading-indicator {
|
||||
|
|
@ -238,22 +238,15 @@ html.cssanimations {
|
|||
|
||||
.stripe-loaded {
|
||||
width: 0;
|
||||
|
||||
// Opacity replaced with display. Leaving the animated indicator element
|
||||
// in the rendering tree, even invisible, affects the performance.
|
||||
// .opacity(0);
|
||||
display: none;
|
||||
.opacity(0);
|
||||
}
|
||||
|
||||
&.loaded {
|
||||
// .opacity(0);
|
||||
display: none;
|
||||
|
||||
.opacity(0);
|
||||
.transition(opacity .4s linear);
|
||||
.transition-delay(.3s);
|
||||
.stripe-loaded {
|
||||
display: block;
|
||||
// .opacity(1);
|
||||
.opacity(1);
|
||||
.transition(width .3s linear);
|
||||
width: 100% !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
|
||||
@color-popover-bg: #ffffff;
|
||||
@color-popover-border: @dropdown-border;
|
||||
@color-popover-head-bg: mix(black, saturate(@brand-accent, 20%), 25%);
|
||||
@color-popover-head-bg: mix(black, saturate(@brand-secondary, 20%), 25%);
|
||||
@color-popover-head-text: #ffffff;
|
||||
@color-popover-danger-bg: #ab2a1c;
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
|
||||
@import "popup.base.less";
|
||||
|
||||
@color-popup-header-bg: mix(black, saturate(@brand-accent, 20%), 25%);
|
||||
@color-popup-header-bg: mix(black, saturate(@brand-secondary, 20%), 25%);
|
||||
@color-popup-header-text: #ECF0F1;
|
||||
@color-popup-footer-bg: transparent;
|
||||
@color-popup-content-bg: @body-bg;
|
||||
|
|
|
|||
|
|
@ -2314,20 +2314,24 @@ $(document).on('ajaxPromise','[data-cursor-load-indicator]',function(){$.oc.curs
|
|||
$.oc={}
|
||||
var StripeLoadIndicator=function(){var self=this
|
||||
this.counter=0
|
||||
this.indicator=$('<div/>').addClass('stripe-loading-indicator loaded').append($('<div />').addClass('stripe')).append($('<div />').addClass('stripe-loaded'))
|
||||
this.indicator=this.makeIndicator()
|
||||
this.stripe=this.indicator.find('.stripe')
|
||||
this.animationTimer=null
|
||||
$(document).ready(function(){$(document.body).append(self.indicator)})}
|
||||
StripeLoadIndicator.prototype.show=function(){this.counter++
|
||||
StripeLoadIndicator.prototype.makeIndicator=function(){return $('<div/>').addClass('stripe-loading-indicator loaded').append($('<div />').addClass('stripe')).append($('<div />').addClass('stripe-loaded'))}
|
||||
StripeLoadIndicator.prototype.show=function(){window.clearTimeout(this.animationTimer)
|
||||
this.indicator.show()
|
||||
this.counter++
|
||||
this.stripe.after(this.stripe=this.stripe.clone()).remove()
|
||||
if(this.counter>1)
|
||||
return
|
||||
if(this.counter>1){return}
|
||||
this.indicator.removeClass('loaded')
|
||||
$(document.body).addClass('loading')}
|
||||
StripeLoadIndicator.prototype.hide=function(force){this.counter--
|
||||
if(force!==undefined&&force)
|
||||
this.counter=0
|
||||
StripeLoadIndicator.prototype.hide=function(force){var self=this
|
||||
this.counter--
|
||||
if(force!==undefined&&force){this.counter=0}
|
||||
if(this.counter<=0){this.indicator.addClass('loaded')
|
||||
$(document.body).removeClass('loading')}}
|
||||
$(document.body).removeClass('loading')
|
||||
this.animationTimer=window.setTimeout(function(){self.indicator.hide()},1000)}}
|
||||
$.oc.stripeLoadIndicator=new StripeLoadIndicator()
|
||||
$(document).on('ajaxPromise','[data-stripe-load-indicator]',function(event){event.stopPropagation()
|
||||
$.oc.stripeLoadIndicator.show()
|
||||
|
|
@ -2469,6 +2473,7 @@ this.firstDiv=null
|
|||
this.allowHide=true
|
||||
this.$container=this.createPopupContainer()
|
||||
this.$content=this.$container.find('.modal-content:first')
|
||||
this.$dialog=this.$container.find('.modal-dialog:first')
|
||||
this.$modal=this.$container.modal({show:false,backdrop:false,keyboard:this.options.keyboard})
|
||||
this.$container.data('oc.popup',this)
|
||||
this.$modal.on('hide.bs.modal',function(){self.triggerEvent('hide.oc.popup')
|
||||
|
|
@ -2546,11 +2551,13 @@ Popup.prototype.reload=function(){this.init()}
|
|||
Popup.prototype.show=function(){this.$modal.modal('show')
|
||||
this.$modal.on('click.dismiss.popup','[data-dismiss="popup"]',$.proxy(this.hide,this))
|
||||
this.triggerEvent('popupShow')
|
||||
this.triggerEvent('show.oc.popup')}
|
||||
this.triggerEvent('show.oc.popup')
|
||||
this.$dialog.css('transform','inherit')}
|
||||
Popup.prototype.hide=function(){this.triggerEvent('popupHide')
|
||||
this.triggerEvent('hide.oc.popup')
|
||||
if(this.allowHide)
|
||||
this.$modal.modal('hide')}
|
||||
this.$modal.modal('hide')
|
||||
this.$dialog.css('transform','')}
|
||||
Popup.prototype.visible=function(val){if(val)
|
||||
this.$modal.addClass('in')
|
||||
else
|
||||
|
|
|
|||
|
|
@ -366,8 +366,8 @@ cite{font-style:normal}
|
|||
.text-center{text-align:center}
|
||||
.text-justify{text-align:justify}
|
||||
.text-muted{color:#999999}
|
||||
.text-primary{color:#3498db}
|
||||
a.text-primary:hover{color:#217dbb}
|
||||
.text-primary{color:#34495e}
|
||||
a.text-primary:hover{color:#222f3d}
|
||||
.text-success{color:#3c763d}
|
||||
a.text-success:hover{color:#2b542c}
|
||||
.text-info{color:#31708f}
|
||||
|
|
@ -376,8 +376,8 @@ a.text-info:hover{color:#245269}
|
|||
a.text-warning:hover{color:#66512c}
|
||||
.text-danger{color:#a94442}
|
||||
a.text-danger:hover{color:#843534}
|
||||
.bg-primary{color:#fff;background-color:#3498db}
|
||||
a.bg-primary:hover{background-color:#217dbb}
|
||||
.bg-primary{color:#fff;background-color:#34495e}
|
||||
a.bg-primary:hover{background-color:#222f3d}
|
||||
.bg-success{background-color:#dff0d8}
|
||||
a.bg-success:hover{background-color:#c1e2b3}
|
||||
.bg-info{background-color:#d9edf7}
|
||||
|
|
@ -410,24 +410,24 @@ blockquote footer:before,blockquote small:before,blockquote .small:before{conten
|
|||
.blockquote-reverse footer:after,blockquote.pull-right footer:after,.blockquote-reverse small:after,blockquote.pull-right small:after,.blockquote-reverse .small:after,blockquote.pull-right .small:after{content:'\00A0 \2014'}
|
||||
blockquote:before,blockquote:after{content:""}
|
||||
address{margin-bottom:20px;font-style:normal;line-height:1.42857143}
|
||||
.br-p{color:#3498db}
|
||||
.br-s{color:#34495e}
|
||||
.br-a{color:#e67e22}
|
||||
.br-p-s10{color:#289ae7}
|
||||
.br-s-s10{color:#2d4965}
|
||||
.br-a-s10{color:#f27d16}
|
||||
.br-p-s20{color:#1c9df3}
|
||||
.br-s-s20{color:#25496d}
|
||||
.br-a-s20{color:#ff7c09}
|
||||
.bg-p{background-color:#3498db}
|
||||
.bg-s{background-color:#34495e}
|
||||
.bg-a{background-color:#e67e22}
|
||||
.bg-p-s10{background-color:#289ae7}
|
||||
.bg-s-s10{background-color:#2d4965}
|
||||
.bg-a-s10{background-color:#f27d16}
|
||||
.bg-p-s20{background-color:#1c9df3}
|
||||
.bg-s-s20{background-color:#25496d}
|
||||
.bg-a-s20{background-color:#ff7c09}
|
||||
.br-p{color:#34495e}
|
||||
.br-s{color:#e67e22}
|
||||
.br-a{color:#3498db}
|
||||
.br-p-s10{color:#2d4965}
|
||||
.br-s-s10{color:#f27d16}
|
||||
.br-a-s10{color:#289ae7}
|
||||
.br-p-s20{color:#25496d}
|
||||
.br-s-s20{color:#ff7c09}
|
||||
.br-a-s20{color:#1c9df3}
|
||||
.bg-p{background-color:#34495e}
|
||||
.bg-s{background-color:#e67e22}
|
||||
.bg-a{background-color:#3498db}
|
||||
.bg-p-s10{background-color:#2d4965}
|
||||
.bg-s-s10{background-color:#f27d16}
|
||||
.bg-a-s10{background-color:#289ae7}
|
||||
.bg-p-s20{background-color:#25496d}
|
||||
.bg-s-s20{background-color:#ff7c09}
|
||||
.bg-a-s20{background-color:#1c9df3}
|
||||
.t-ww{word-wrap:break-word;word-break:break-word}
|
||||
.pos-r{position:relative !important}
|
||||
.pos-a{position:absolute !important}
|
||||
|
|
@ -1278,7 +1278,7 @@ button.close{padding:0;cursor:pointer;background:transparent;border:0;-webkit-ap
|
|||
.dropdown-menu .divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}
|
||||
.dropdown-menu > li > a{display:block;padding:3px 20px;clear:both;font-weight:normal;line-height:1.42857143;color:#39454a;white-space:nowrap}
|
||||
.dropdown-menu > li > a:hover,.dropdown-menu > li > a:focus{text-decoration:none;color:#262626;background-color:#f5f5f5}
|
||||
.dropdown-menu > .active > a,.dropdown-menu > .active > a:hover,.dropdown-menu > .active > a:focus{color:#ffffff;text-decoration:none;outline:0;background-color:#3498db}
|
||||
.dropdown-menu > .active > a,.dropdown-menu > .active > a:hover,.dropdown-menu > .active > a:focus{color:#ffffff;text-decoration:none;outline:0;background-color:#34495e}
|
||||
.dropdown-menu > .disabled > a,.dropdown-menu > .disabled > a:hover,.dropdown-menu > .disabled > a:focus{color:#999999}
|
||||
.dropdown-menu > .disabled > a:hover,.dropdown-menu > .disabled > a:focus{text-decoration:none;background-color:transparent;background-image:none;filter:progid:DXImageTransform.Microsoft.gradient(enabled = false);cursor:not-allowed}
|
||||
.open > .dropdown-menu{display:block}
|
||||
|
|
@ -1374,7 +1374,7 @@ body.popover-open .control-popover .popover-head:before{display:none}
|
|||
}
|
||||
.control-breadcrumb{margin:-20px -20px 20px -20px;background-color:#d0d9dd;-webkit-box-shadow:inset 0 -2px 0 rgba(0,0,0,0.05);box-shadow:inset 0 -2px 0 rgba(0,0,0,0.05)}
|
||||
.control-breadcrumb ul{padding:0;margin:0;font-size:0}
|
||||
.control-breadcrumb li{font-size:15px;list-style:none;margin:0;padding:12px 10px 12px 30px;display:inline-block;position:relative;color:#ffffff;background-color:#9098a2}
|
||||
.control-breadcrumb li{font-size:14px;list-style:none;margin:0;padding:12px 10px 12px 30px;display:inline-block;position:relative;color:#ffffff;background-color:#9098a2}
|
||||
.control-breadcrumb li a{display:inline-block;color:#ffffff;text-decoration:none;text-shadow:0 1px 0 rgba(0,0,0,0.2)}
|
||||
.control-breadcrumb li a:hover{color:#ffffff}
|
||||
.control-breadcrumb li:before,.control-breadcrumb li:after{top:0;right:-15px;position:absolute;z-index:10}
|
||||
|
|
@ -1464,7 +1464,7 @@ to{background-position:0 0}
|
|||
.nav-pills > li{float:left}
|
||||
.nav-pills > li > a{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}
|
||||
.nav-pills > li + li{margin-left:2px}
|
||||
.nav-pills > li.active > a,.nav-pills > li.active > a:hover,.nav-pills > li.active > a:focus{color:#ffffff;background-color:#3498db}
|
||||
.nav-pills > li.active > a,.nav-pills > li.active > a:hover,.nav-pills > li.active > a:focus{color:#ffffff;background-color:#34495e}
|
||||
.nav-stacked > li{float:none}
|
||||
.nav-stacked > li + li{margin-top:2px;margin-left:0}
|
||||
.nav-justified{width:100%}
|
||||
|
|
@ -1622,7 +1622,7 @@ ul.status-list li a:hover{color:#0181b9;text-decoration:none}
|
|||
ul.status-list li span.status{display:inline-block;padding:1px 5px;color:white;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}
|
||||
ul.status-list li span.status.circle{-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;width:12px;height:12px;vertical-align:middle;position:relative;top:-1px}
|
||||
ul.status-list li span.status.success{background:#31ac5f}
|
||||
ul.status-list li span.status.primary{background:#3498db}
|
||||
ul.status-list li span.status.primary{background:#34495e}
|
||||
ul.status-list li span.status.warning{background:#f0ad4e}
|
||||
ul.status-list li span.status.danger{background:#ab2a1c}
|
||||
ul.status-list li span.status.info{background:#5bc0de}
|
||||
|
|
@ -2125,11 +2125,11 @@ html.cssanimations .cursor-loading-indicator.hide{display:none}
|
|||
.bar-loading-indicator.bar-loaded{opacity:0;filter:alpha(opacity=0);-webkit-transition-delay:0.3s;transition-delay:0.3s}
|
||||
.bar-loading-indicator.bar-loaded .progress-bar{width:100% !important;-webkit-transition:width 0.3s linear;transition:width 0.3s linear;-webkit-animation:none;animation:none}
|
||||
.stripe-loading-indicator{height:4px;background:transparent;position:fixed;top:0;left:0;width:100%;overflow:hidden;z-index:2000}
|
||||
.stripe-loading-indicator .stripe,.stripe-loading-indicator .stripe-loaded{height:4px;display:block;background:#0090c0;position:absolute;-webkit-box-shadow:inset 0 1px 1px -1px #FFF,inset 0 -1px 1px -1px #FFF;box-shadow:inset 0 1px 1px -1px #FFF,inset 0 -1px 1px -1px #FFF}
|
||||
.stripe-loading-indicator .stripe,.stripe-loading-indicator .stripe-loaded{height:4px;display:block;background:#3498db;position:absolute;-webkit-box-shadow:inset 0 1px 1px -1px #FFF,inset 0 -1px 1px -1px #FFF;box-shadow:inset 0 1px 1px -1px #FFF,inset 0 -1px 1px -1px #FFF}
|
||||
.stripe-loading-indicator .stripe{width:100%;-webkit-animation:infinite-loader 60s linear;animation:infinite-loader 60s linear}
|
||||
.stripe-loading-indicator .stripe-loaded{width:0;display:none}
|
||||
.stripe-loading-indicator.loaded{display:none;-webkit-transition:opacity 0.4s linear;transition:opacity 0.4s linear;-webkit-transition-delay:0.3s;transition-delay:0.3s}
|
||||
.stripe-loading-indicator.loaded .stripe-loaded{display:block;-webkit-transition:width 0.3s linear;transition:width 0.3s linear;width:100% !important}
|
||||
.stripe-loading-indicator .stripe-loaded{width:0;opacity:0;filter:alpha(opacity=0)}
|
||||
.stripe-loading-indicator.loaded{opacity:0;filter:alpha(opacity=0);-webkit-transition:opacity 0.4s linear;transition:opacity 0.4s linear;-webkit-transition-delay:0.3s;transition-delay:0.3s}
|
||||
.stripe-loading-indicator.loaded .stripe-loaded{opacity:1;filter:alpha(opacity=100);-webkit-transition:width 0.3s linear;transition:width 0.3s linear;width:100% !important}
|
||||
.stripe-loading-indicator.hide{display:none}
|
||||
@-moz-keyframes infinite-loader{0%{width:0%}
|
||||
10%{width:42%}
|
||||
|
|
@ -2365,7 +2365,7 @@ html.cssanimations .cursor-loading-indicator.hide{display:none}
|
|||
.custom-checkbox input:disabled + label:before,.custom-radio input:disabled + label:before{border:1px solid #bdc3c7 !important}
|
||||
.custom-checkbox input:disabled:checked + label:before,.custom-radio input:disabled:checked + label:before{background-color:#999}
|
||||
.custom-checkbox:focus,.custom-radio:focus{outline:none}
|
||||
.custom-checkbox:focus label:before,.custom-radio:focus label:before{border-color:#3498db}
|
||||
.custom-checkbox:focus label:before,.custom-radio:focus label:before{border-color:#34495e}
|
||||
.custom-checkbox p.help-block,.custom-radio p.help-block{padding-left:6px;margin-bottom:17px}
|
||||
.custom-radio label:before{-webkit-border-radius:18px;-moz-border-radius:18px;border-radius:18px}
|
||||
.custom-checkbox label:before{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}
|
||||
|
|
@ -2550,9 +2550,9 @@ table.table.data tbody tr:last-child th,table.table.data tbody tr:last-child td{
|
|||
table.table.data tbody tr td:first-child{border-left:3px solid transparent;padding-left:22px}
|
||||
table.table.data tbody tr.active td{color:#000000}
|
||||
table.table.data tbody tr.active td:first-child{border-left:3px solid #ff9933}
|
||||
table.table.data tbody tr:not(.no-data):hover td,table.table.data tbody tr:not(.no-data).selected td{background:#4da7e8 !important;text-shadow:0 -1px 0 rgba(0,0,0,0.3);color:white}
|
||||
table.table.data tbody tr:not(.no-data):hover td,table.table.data tbody tr:not(.no-data).selected td{background:#4ea5e0 !important;text-shadow:0 -1px 0 rgba(0,0,0,0.3);color:white}
|
||||
table.table.data tbody tr:not(.no-data):hover td a:not(.btn),table.table.data tbody tr:not(.no-data).selected td a:not(.btn),table.table.data tbody tr:not(.no-data):hover td span,table.table.data tbody tr:not(.no-data).selected td span,table.table.data tbody tr:not(.no-data):hover td i[class^="icon-"],table.table.data tbody tr:not(.no-data).selected td i[class^="icon-"]{color:white}
|
||||
table.table.data tbody tr:not(.no-data):active td{background:#4596d1 !important;color:white}
|
||||
table.table.data tbody tr:not(.no-data):active td{background:#3498db !important;color:white}
|
||||
table.table.data tbody tr.hidden td,table.table.data tbody tr.hidden th,table.table.data tbody tr.hidden td a,table.table.data tbody tr.hidden th a{display:none}
|
||||
table.table.data tbody tr.strike td,table.table.data tbody tr.strike th,table.table.data tbody tr.strike td a,table.table.data tbody tr.strike th a{text-decoration:line-through}
|
||||
table.table.data tbody tr.frozen td,table.table.data tbody tr.frozen th,table.table.data tbody tr.frozen td a,table.table.data tbody tr.frozen th a{color:#337ab7}
|
||||
|
|
@ -2609,7 +2609,7 @@ table.table.data tr.list-tree-level-10 td.list-cell-index-1{padding-left:125px}
|
|||
.control-list table.table.data .list-setup{width:48px}
|
||||
.control-list table.table.data .list-setup a{display:block;color:#000000}
|
||||
.control-list table.table.data .list-setup a:before{font-size:14px;line-height:14px;font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f0ca";display:inline-block;margin-left:8px;vertical-align:baseline;opacity:0.6;filter:alpha(opacity=60)}
|
||||
.control-list table.table.data .list-setup a:hover:before{opacity:1;filter:alpha(opacity=100);color:#4da7e8 !important}
|
||||
.control-list table.table.data .list-setup a:hover:before{opacity:1;filter:alpha(opacity=100);color:#4ea5e0 !important}
|
||||
.control-list table.table.data .list-pagination{font-size:14px;text-align:right;padding-top:20px}
|
||||
.control-list table.table.data .list-pagination .loading-indicator div{margin-left:20px;font-size:12px}
|
||||
.list-header{background-color:transparent;padding:0 20px 1px 20px}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div class="layout-cell sidenav-tree bg-s" data-control="sidenav-tree" data-search-input="#settings-search-input">
|
||||
<div class="layout-cell sidenav-tree bg-p" data-control="sidenav-tree" data-search-input="#settings-search-input">
|
||||
<a class="back-link" href="<?= Backend::url('system/settings') ?>"><i class="icon-angle-left"></i><?= e(trans('system::lang.settings.menu_label')) ?></a>
|
||||
|
||||
<div class="layout">
|
||||
|
|
|
|||
Loading…
Reference in New Issue