1014 lines
41 KiB
CSS
1014 lines
41 KiB
CSS
/* ==========================================================================
|
|
THEME: Chrome [data-jey-theme="chrome"]
|
|
Metallic chrome button with conic-gradient rings and rotating glow.
|
|
========================================================================== */
|
|
|
|
@keyframes jey-chrome-rotate-glow {
|
|
from { transform: rotate(0deg); }
|
|
to { transform: rotate(360deg); }
|
|
}
|
|
|
|
@keyframes jey-chrome-face-light {
|
|
0% { background: radial-gradient(circle at 25% 20%, rgba(255,255,255,0.5) 0%, transparent 55%); }
|
|
25% { background: radial-gradient(circle at 75% 25%, rgba(255,255,255,0.5) 0%, transparent 55%); }
|
|
50% { background: radial-gradient(circle at 70% 75%, rgba(255,255,255,0.35) 0%, transparent 55%); }
|
|
75% { background: radial-gradient(circle at 25% 70%, rgba(255,255,255,0.35) 0%, transparent 55%); }
|
|
100% { background: radial-gradient(circle at 25% 20%, rgba(255,255,255,0.5) 0%, transparent 55%); }
|
|
}
|
|
|
|
@keyframes jey-chrome-refl-drift {
|
|
0%, 100% { top: 12%; opacity: 0.7; }
|
|
50% { top: 18%; opacity: 0.5; }
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-chrome {
|
|
width: 72px; height: 72px; border-radius: 50%; position: relative;
|
|
background: radial-gradient(ellipse at 35% 20%, rgba(255,255,255,0.7) 0%, transparent 55%), linear-gradient(180deg, #e0e0e0 0%, #b8b8b8 100%);
|
|
box-shadow: 0 4px 10px rgba(0,0,0,0.18), 0 1px 3px rgba(0,0,0,0.1), inset 0 1px 1px rgba(255,255,255,0.7);
|
|
transition: box-shadow 0.3s ease;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .desktop-icon:hover .jey-chrome {
|
|
box-shadow: 0 6px 16px rgba(0,0,0,0.22), 0 1px 3px rgba(0,0,0,0.12), 0 0 14px rgba(255,255,255,0.2), inset 0 1px 1px rgba(255,255,255,0.7);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-chrome-ring {
|
|
position: absolute; inset: 2px; border-radius: 50%;
|
|
background: conic-gradient(from 140deg, #a0a0a0 0deg, #f2f2f2 40deg, #777 80deg, #e5e5e5 120deg, #959595 170deg, #ededed 210deg, #808080 260deg, #d8d8d8 310deg, #a0a0a0 360deg);
|
|
box-shadow: inset 0 1px 2px rgba(0,0,0,0.2); overflow: hidden;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-ring-glow {
|
|
position: absolute; inset: -10px; border-radius: 50%;
|
|
background: conic-gradient(from 0deg, transparent 0deg, transparent 140deg, rgba(255,255,255,0.55) 165deg, rgba(255,255,255,0.8) 180deg, rgba(255,255,255,0.55) 195deg, transparent 220deg, transparent 360deg);
|
|
animation: jey-chrome-rotate-glow 8s linear infinite; pointer-events: none;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-chrome-gap {
|
|
position: absolute; inset: 5px; border-radius: 50%;
|
|
background: linear-gradient(180deg, #888 0%, #aaa 50%, #999 100%);
|
|
box-shadow: inset 0 1px 3px rgba(0,0,0,0.35), inset 0 -1px 1px rgba(255,255,255,0.2);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-chrome-ring-inner {
|
|
position: absolute; inset: 6px; border-radius: 50%;
|
|
background: conic-gradient(from 200deg, #b0b0b0 0deg, #eee 30deg, #999 70deg, #ddd 110deg, #aaa 160deg, #f0f0f0 200deg, #909090 250deg, #ccc 300deg, #b0b0b0 360deg);
|
|
box-shadow: inset 0 1px 1px rgba(0,0,0,0.15);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-chrome-face {
|
|
position: absolute; inset: 9px; border-radius: 50%; overflow: hidden;
|
|
background: linear-gradient(168deg, #f4f4f4 0%, #e0e0e0 45%, #d4d4d4 100%);
|
|
box-shadow: inset 0 3px 7px rgba(255,255,255,0.7), inset 0 -3px 6px rgba(0,0,0,0.06);
|
|
display: flex; align-items: center; justify-content: center;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-face-glow {
|
|
position: absolute; inset: 0; border-radius: 50%;
|
|
animation: jey-chrome-face-light 8s ease-in-out infinite;
|
|
pointer-events: none; z-index: 1;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-face-reflection {
|
|
position: absolute; top: 15%; left: 10%; width: 80%; height: 30%;
|
|
background: linear-gradient(180deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0.15) 60%, transparent 100%);
|
|
border-radius: 50%; pointer-events: none; z-index: 1;
|
|
animation: jey-chrome-refl-drift 10s ease-in-out infinite;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .jey-chrome-face .jey-icon {
|
|
width: 24px !important; height: 24px !important;
|
|
stroke: #505050 !important; fill: none !important;
|
|
stroke-width: 1.8 !important; stroke-linecap: round !important; stroke-linejoin: round !important;
|
|
filter: drop-shadow(0 1px 0 rgba(255,255,255,0.5)) !important;
|
|
position: relative; z-index: 2;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
FULL APP CHROME THEME
|
|
Real metallic chrome with 45° multi-stop reflective gradients,
|
|
brushed metal textures, beveled edges, and conic-gradient accents.
|
|
========================================================================== */
|
|
|
|
/* --- Shine sweep animation for interactive elements --- */
|
|
@keyframes jey-chrome-shine {
|
|
0% { transform: translateX(-100%) skewX(-15deg); }
|
|
100% { transform: translateX(200%) skewX(-15deg); }
|
|
}
|
|
|
|
/* ==========================================================================
|
|
CSS Variable Overrides
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] {
|
|
/* --- Surfaces --- */
|
|
--bg-color: #d8d8d8;
|
|
--fg-color: #e8e8e8;
|
|
--card-bg: #e0e0e0;
|
|
--subtle-accent: #d4d4d4;
|
|
--subtle-fg: #d0d0d0;
|
|
--fg-hover-color: #ccc;
|
|
--highlight-color: #d4d4d4;
|
|
--navbar-bg: #d0d0d0;
|
|
--modal-bg: #ddd;
|
|
--toast-bg: #ddd;
|
|
--popover-bg: #e0e0e0;
|
|
--control-bg: #d5d5d5;
|
|
--control-bg-on-gray: #ccc;
|
|
--awesomebar-focus-bg: #e8e8e8;
|
|
--disabled-control-bg: #d0d0d0;
|
|
--skeleton-bg: #c8c8c8;
|
|
--surface-menu-bar: #d4d4d4;
|
|
--surface-white: #e0e0e0;
|
|
--surface-gray-1: #d8d8d8;
|
|
--surface-gray-2: #d0d0d0;
|
|
--surface-gray-3: #c8c8c8;
|
|
--surface-gray-4: #bbb;
|
|
--surface-modal: #ddd;
|
|
--placeholder-color: #ccc;
|
|
|
|
/* --- Sidebar --- */
|
|
--sidebar-hover-color: #c8c8c8;
|
|
--sidebar-active-color: #d8d8d8;
|
|
--sidebar-border-color: #aaa;
|
|
--divider-color: #b0b0b0;
|
|
|
|
/* --- Text --- */
|
|
--heading-color: #333;
|
|
--text-color: #404040;
|
|
--text-neutral: #333;
|
|
--text-muted: #666;
|
|
--text-light: #888;
|
|
--text-dark: #f0f0f0;
|
|
--disabled-text-color: #888;
|
|
--ink-gray-7: #555;
|
|
--ink-gray-8: #404040;
|
|
--ink-gray-9: #333;
|
|
|
|
/* --- Borders --- */
|
|
--border-color: #aaa;
|
|
--dark-border-color: #999;
|
|
--table-border-color: #aaa;
|
|
--btn-group-border-color: #999;
|
|
--outline-gray-1: #b0b0b0;
|
|
--outline-gray-2: #999;
|
|
--outline-gray-modals: #aaa;
|
|
|
|
/* --- Primary / Buttons --- */
|
|
--primary: #555;
|
|
--brand-color: #555;
|
|
--btn-primary: #777;
|
|
--btn-default-bg: #ccc;
|
|
--btn-default-hover-bg: #bbb;
|
|
--btn-ghost-hover-bg: #c0c0c0;
|
|
--border-primary: #777;
|
|
|
|
/* --- Shadows (beveled metallic) --- */
|
|
--shadow-xs: 1px 1px 2px rgba(0,0,0,0.15), -1px -1px 1px rgba(255,255,255,0.5);
|
|
--shadow-sm: 1px 1px 3px rgba(0,0,0,0.18), -1px -1px 2px rgba(255,255,255,0.45);
|
|
--shadow-base: 2px 2px 4px rgba(0,0,0,0.15), -1px -1px 2px rgba(255,255,255,0.4);
|
|
--shadow-md: 2px 2px 6px rgba(0,0,0,0.18), -1px -1px 3px rgba(255,255,255,0.35);
|
|
--shadow-lg: 3px 3px 10px rgba(0,0,0,0.15), -2px -2px 5px rgba(255,255,255,0.3);
|
|
--shadow-xl: 4px 4px 16px rgba(0,0,0,0.18), -2px -2px 6px rgba(255,255,255,0.25);
|
|
--shadow-2xl: 6px 6px 24px rgba(0,0,0,0.2), -3px -3px 8px rgba(255,255,255,0.2);
|
|
--shadow-inset: inset 0px -1px 0px #999;
|
|
--btn-shadow: 1px 1px 2px rgba(0,0,0,0.15), -1px -1px 1px rgba(255,255,255,0.4);
|
|
--card-shadow: 2px 2px 6px rgba(0,0,0,0.12), -1px -1px 3px rgba(255,255,255,0.4);
|
|
--modal-shadow: 6px 6px 30px rgba(0,0,0,0.3), -3px -3px 10px rgba(255,255,255,0.15);
|
|
--awesomebar-shadow: 3px 3px 12px rgba(0,0,0,0.15), -2px -2px 6px rgba(255,255,255,0.3);
|
|
|
|
/* --- Focus rings --- */
|
|
--focus-default: 0 0 0 2px rgba(150,150,150,0.5);
|
|
|
|
/* --- Scrollbar --- */
|
|
--scrollbar-thumb-color: #999;
|
|
--scrollbar-track-color: #c8c8c8;
|
|
|
|
/* --- Checkbox / Switch --- */
|
|
--switch-bg: #aaa;
|
|
--checkbox-color: #555;
|
|
--checkbox-gradient: linear-gradient(180deg, #777 0%, #666 100%);
|
|
|
|
/* --- Timeline --- */
|
|
--timeline-badge-color: #555;
|
|
--timeline-badge-bg: #ccc;
|
|
|
|
/* --- Date picker --- */
|
|
--date-active-bg: #777;
|
|
--date-active-text: #f0f0f0;
|
|
--date-range-bg: #ccc;
|
|
|
|
/* --- Progress / Misc --- */
|
|
--progress-bar-bg: #777;
|
|
--code-block-bg: #444;
|
|
--code-block-text: #ccc;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Body — Brushed Metal Background
|
|
3 layered repeating-gradients at different lengths = realistic grain
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] body {
|
|
background:
|
|
radial-gradient(ellipse at 25% 15%, rgba(255,255,255,0.45) 0%, transparent 50%),
|
|
radial-gradient(ellipse at 80% 80%, rgba(255,255,255,0.2) 0%, transparent 45%),
|
|
radial-gradient(ellipse at 50% 50%, rgba(0,0,0,0.03) 0%, transparent 70%),
|
|
linear-gradient(168deg, #d8d8d8 0%, #c4c4c4 40%, #b8b8b8 70%, #c8c8c8 100%) !important;
|
|
background-attachment: fixed !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .page-container {
|
|
background: transparent !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Navbar — Reflective Chrome Bar
|
|
45° multi-stop gradient simulating polished metal reflection
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .navbar {
|
|
background:
|
|
linear-gradient(45deg, #aaa 2%, #ddd 8%, #bbb 18%, #e8e8e8 30%, #ccc 45%, #eee 55%, #bbb 68%, #ddd 80%, #aaa 95%) !important;
|
|
border-bottom: 1px solid #888 !important;
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0.7),
|
|
inset 0 -1px 0 rgba(0,0,0,0.08),
|
|
0 2px 4px rgba(0,0,0,0.15) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .navbar .navbar-nav .nav-link {
|
|
color: #444 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .navbar .navbar-nav .nav-link:hover {
|
|
color: #222 !important;
|
|
background: linear-gradient(180deg, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0.1) 100%) !important;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Awesomebar — Sunken Metal Slot
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .search-bar input {
|
|
background: linear-gradient(180deg, #c0c0c0 0%, #d0d0d0 100%) !important;
|
|
border: 1px solid #999 !important;
|
|
box-shadow:
|
|
inset 0 2px 4px rgba(0,0,0,0.15),
|
|
inset 0 0 0 1px rgba(0,0,0,0.05),
|
|
0 1px 0 rgba(255,255,255,0.5) !important;
|
|
color: #333 !important;
|
|
border-radius: 6px !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .search-bar input:focus {
|
|
background: linear-gradient(180deg, #d5d5d5 0%, #e0e0e0 100%) !important;
|
|
border-color: #888 !important;
|
|
box-shadow:
|
|
inset 0 1px 3px rgba(0,0,0,0.1),
|
|
0 0 0 2px rgba(150,150,150,0.3),
|
|
0 1px 0 rgba(255,255,255,0.4) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .search-bar .search-icon {
|
|
color: #777 !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Sidebar — Brushed Metal Panel
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .body-sidebar-container {
|
|
background: linear-gradient(160deg, #b8b8b8 0%, #f0f0f0 12%, #c0c0c0 28%, #f4f4f4 42%, #b8b8b8 58%, #ededed 72%, #aaa 88%, #ddd 100%) !important;
|
|
border-right: 1px solid #888 !important;
|
|
box-shadow:
|
|
inset -1px 0 0 rgba(255,255,255,0.6),
|
|
inset 0 1px 0 rgba(255,255,255,0.7),
|
|
inset 0 -1px 0 rgba(0,0,0,0.1),
|
|
2px 0 8px rgba(0,0,0,0.12) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .body-sidebar-container .body-sidebar,
|
|
[data-jey-theme="chrome"] .body-sidebar-container .body-sidebar-top,
|
|
[data-jey-theme="chrome"] .body-sidebar-container .body-sidebar-bottom,
|
|
[data-jey-theme="chrome"] .body-sidebar-container .body-sidebar-cards {
|
|
background: transparent !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .body-sidebar .standard-sidebar-item .item-anchor:hover {
|
|
background: linear-gradient(90deg, rgba(255,255,255,0.25) 0%, rgba(255,255,255,0.05) 100%) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .body-sidebar .standard-sidebar-item.active-sidebar .item-anchor {
|
|
background: linear-gradient(45deg, #bbb 5%, #ddd 30%, #ccc 60%, #ddd 90%) !important;
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0.6),
|
|
inset 0 -1px 0 rgba(0,0,0,0.08),
|
|
1px 1px 2px rgba(0,0,0,0.1),
|
|
-1px -1px 1px rgba(255,255,255,0.3) !important;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .body-sidebar .sidebar-item-icon {
|
|
color: #666 !important;
|
|
filter: drop-shadow(0 1px 0 rgba(255,255,255,0.5));
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Context Menu — Themed icons
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .frappe-menu .menu-item-icon .jey-icon {
|
|
width: 20px !important;
|
|
height: 20px !important;
|
|
stroke: #555 !important;
|
|
fill: none !important;
|
|
stroke-width: 1.8 !important;
|
|
stroke-linecap: round !important;
|
|
stroke-linejoin: round !important;
|
|
filter: drop-shadow(0 1px 0 rgba(255,255,255,0.4)) !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Sidebar Header — Themed icon
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .sidebar-header .header-logo .jey-icon {
|
|
width: 22px !important;
|
|
height: 22px !important;
|
|
stroke: #555 !important;
|
|
fill: none !important;
|
|
stroke-width: 1.8 !important;
|
|
stroke-linecap: round !important;
|
|
stroke-linejoin: round !important;
|
|
filter: drop-shadow(0 1px 0 rgba(255,255,255,0.4)) !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Primary Buttons — Polished Chrome with Shine
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .btn-primary {
|
|
background: linear-gradient(45deg, #666 5%, #aaa 10%, #888 30%, #999 50%, #888 70%, #aaa 85%, #666 95%) !important;
|
|
color: #f0f0f0 !important;
|
|
border: 1px solid #555 !important;
|
|
box-shadow:
|
|
2px 2px 4px rgba(0,0,0,0.2),
|
|
-1px -1px 2px rgba(255,255,255,0.15),
|
|
inset 0 1px 0 rgba(255,255,255,0.3),
|
|
inset 0 -1px 0 rgba(0,0,0,0.15),
|
|
inset 2px 2px 5px rgba(0,0,0,0),
|
|
inset -1px -1px 2px rgba(255,255,255,0) !important;
|
|
text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
|
|
position: relative;
|
|
overflow: hidden;
|
|
transition:
|
|
box-shadow 0.25s cubic-bezier(0.22, 1, 0.36, 1),
|
|
border-color 0.25s cubic-bezier(0.22, 1, 0.36, 1) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .btn-primary::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0; left: -50%; width: 30%; height: 100%;
|
|
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
|
|
transform: skewX(-15deg);
|
|
transition: left 0.4s ease;
|
|
pointer-events: none;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .btn-primary:hover::before {
|
|
left: 120%;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .btn-primary:hover {
|
|
background: linear-gradient(45deg, #777 5%, #bbb 10%, #999 30%, #aaa 50%, #999 70%, #bbb 85%, #777 95%) !important;
|
|
box-shadow:
|
|
2px 2px 6px rgba(0,0,0,0.25),
|
|
-1px -1px 3px rgba(255,255,255,0.2),
|
|
inset 0 1px 0 rgba(255,255,255,0.35),
|
|
inset 0 -1px 0 rgba(0,0,0,0.15),
|
|
inset 2px 2px 5px rgba(0,0,0,0),
|
|
inset -1px -1px 2px rgba(255,255,255,0) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .btn-primary:active {
|
|
background: linear-gradient(45deg, #555 5%, #888 10%, #777 30%, #888 50%, #777 70%, #888 85%, #555 95%) !important;
|
|
box-shadow:
|
|
2px 2px 4px rgba(0,0,0,0),
|
|
-1px -1px 2px rgba(255,255,255,0),
|
|
inset 0 1px 0 rgba(255,255,255,0),
|
|
inset 0 -1px 0 rgba(0,0,0,0.05),
|
|
inset 3px 3px 7px rgba(0,0,0,0.35),
|
|
inset -1px -1px 2px rgba(255,255,255,0.12) !important;
|
|
transition: box-shadow 0.08s ease-out !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Default/Secondary Buttons — Brushed Metal
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .btn-default,
|
|
[data-jey-theme="chrome"] .btn-secondary {
|
|
background: linear-gradient(45deg, #bbb 5%, #eee 10%, #ccc 30%, #e0e0e0 50%, #ccc 70%, #eee 85%, #bbb 95%) !important;
|
|
border: 1px solid #999 !important;
|
|
color: #444 !important;
|
|
box-shadow:
|
|
1px 1px 3px rgba(0,0,0,0.12),
|
|
-1px -1px 2px rgba(255,255,255,0.4),
|
|
inset 0 1px 0 rgba(255,255,255,0.6),
|
|
inset 0 -1px 0 rgba(0,0,0,0.06),
|
|
inset 2px 2px 4px rgba(0,0,0,0),
|
|
inset -1px -1px 1px rgba(255,255,255,0) !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
|
transition:
|
|
box-shadow 0.25s cubic-bezier(0.22, 1, 0.36, 1),
|
|
border-color 0.25s cubic-bezier(0.22, 1, 0.36, 1) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .btn-default:hover,
|
|
[data-jey-theme="chrome"] .btn-secondary:hover {
|
|
background: linear-gradient(45deg, #c0c0c0 5%, #f2f2f2 10%, #d4d4d4 30%, #e8e8e8 50%, #d4d4d4 70%, #f2f2f2 85%, #c0c0c0 95%) !important;
|
|
border-color: #888 !important;
|
|
box-shadow:
|
|
2px 2px 4px rgba(0,0,0,0.15),
|
|
-1px -1px 2px rgba(255,255,255,0.4),
|
|
inset 0 1px 0 rgba(255,255,255,0.7),
|
|
inset 0 -1px 0 rgba(0,0,0,0.06),
|
|
inset 2px 2px 4px rgba(0,0,0,0),
|
|
inset -1px -1px 1px rgba(255,255,255,0) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .btn-default:active,
|
|
[data-jey-theme="chrome"] .btn-secondary:active {
|
|
background: linear-gradient(45deg, #aaa 5%, #d8d8d8 10%, #bbb 30%, #ccc 50%, #bbb 70%, #d8d8d8 85%, #aaa 95%) !important;
|
|
box-shadow:
|
|
1px 1px 3px rgba(0,0,0,0),
|
|
-1px -1px 2px rgba(255,255,255,0),
|
|
inset 0 1px 0 rgba(255,255,255,0),
|
|
inset 0 -1px 0 rgba(0,0,0,0.05),
|
|
inset 3px 3px 6px rgba(0,0,0,0.3),
|
|
inset -1px -1px 1px rgba(255,255,255,0.15) !important;
|
|
transition: box-shadow 0.08s ease-out !important;
|
|
}
|
|
|
|
/* Danger */
|
|
[data-jey-theme="chrome"] .btn-danger {
|
|
background: linear-gradient(45deg, #b33 5%, #e88 10%, #c55 30%, #d77 50%, #c55 70%, #e88 85%, #b33 95%) !important;
|
|
color: #fff !important;
|
|
border: 1px solid #944 !important;
|
|
box-shadow:
|
|
2px 2px 4px rgba(0,0,0,0.2),
|
|
-1px -1px 2px rgba(255,255,255,0.1),
|
|
inset 0 1px 0 rgba(255,255,255,0.25) !important;
|
|
text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .btn-danger:hover {
|
|
background: linear-gradient(45deg, #c44 5%, #f99 10%, #d66 30%, #e88 50%, #d66 70%, #f99 85%, #c44 95%) !important;
|
|
}
|
|
|
|
/* Ghost */
|
|
[data-jey-theme="chrome"] .btn-ghost:hover {
|
|
background: linear-gradient(180deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.05) 100%) !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Input Fields — Sunken Metal Inset
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] input.form-control:not([type="checkbox"]):not([type="radio"]),
|
|
[data-jey-theme="chrome"] textarea.form-control {
|
|
background: #d0d0d0 !important;
|
|
border: 1px solid #999 !important;
|
|
color: #333 !important;
|
|
box-shadow:
|
|
inset 1px 1px 2px rgba(0,0,0,0.10),
|
|
inset -1px -1px 1px rgba(255,255,255,0.25),
|
|
inset 0 1px 1px rgba(0,0,0,0.04) !important;
|
|
transition:
|
|
background-color 0.45s cubic-bezier(0.22, 1, 0.36, 1),
|
|
border-color 0.45s cubic-bezier(0.22, 1, 0.36, 1),
|
|
box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] input.form-control:not([type="checkbox"]):not([type="radio"]):focus,
|
|
[data-jey-theme="chrome"] textarea.form-control:focus {
|
|
background: #cbcbcb !important;
|
|
border-color: #777 !important;
|
|
box-shadow:
|
|
inset 4px 4px 8px rgba(0,0,0,0.28),
|
|
inset -1px -1px 1px rgba(255,255,255,0.15),
|
|
inset 0 3px 5px rgba(0,0,0,0.18) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .form-control:disabled,
|
|
[data-jey-theme="chrome"] .form-control[disabled] {
|
|
background: #d8d8d8 !important;
|
|
color: #888 !important;
|
|
box-shadow: inset 1px 1px 2px rgba(0,0,0,0.06) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .frappe-control .control-label,
|
|
[data-jey-theme="chrome"] .frappe-control label {
|
|
color: #444 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] select.form-control,
|
|
[data-jey-theme="chrome"] select.input-with-feedback {
|
|
background: #d0d0d0 !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Forms / Cards — Raised Metal Panels
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .form-page {
|
|
background:
|
|
linear-gradient(45deg, #ccc 3%, #e8e8e8 10%, #d5d5d5 25%, #eee 45%, #d8d8d8 60%, #e8e8e8 80%, #ccc 97%) !important;
|
|
border: 1px solid #aaa !important;
|
|
box-shadow:
|
|
3px 3px 8px rgba(0,0,0,0.12),
|
|
-2px -2px 4px rgba(255,255,255,0.4),
|
|
inset 0 1px 0 rgba(255,255,255,0.7),
|
|
inset 0 -1px 0 rgba(0,0,0,0.05) !important;
|
|
border-radius: var(--border-radius-lg) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .form-section .section-head {
|
|
color: #444 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
|
border-bottom: 1px solid #b0b0b0 !important;
|
|
position: relative;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .frappe-card {
|
|
background: linear-gradient(45deg, #c8c8c8 3%, #e5e5e5 12%, #d4d4d4 30%, #eaeaea 50%, #d4d4d4 70%, #e5e5e5 88%, #c8c8c8 97%) !important;
|
|
border: 1px solid #aaa !important;
|
|
box-shadow:
|
|
2px 2px 6px rgba(0,0,0,0.1),
|
|
-1px -1px 3px rgba(255,255,255,0.4),
|
|
inset 0 1px 0 rgba(255,255,255,0.6) !important;
|
|
}
|
|
|
|
/* Form sidebar */
|
|
[data-jey-theme="chrome"] .form-sidebar {
|
|
border-left: 1px solid #aaa !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .form-sidebar .sidebar-section {
|
|
border-bottom: 1px solid #b0b0b0 !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Modals / Dialogs — Chrome Frame with Conic-Gradient Border
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .modal-content {
|
|
background: linear-gradient(45deg, #ccc 3%, #e8e8e8 12%, #d5d5d5 30%, #eee 50%, #d5d5d5 70%, #e8e8e8 88%, #ccc 97%) !important;
|
|
border: 1px solid #999 !important;
|
|
box-shadow:
|
|
6px 6px 24px rgba(0,0,0,0.25),
|
|
-3px -3px 8px rgba(255,255,255,0.15),
|
|
inset 0 1px 0 rgba(255,255,255,0.6),
|
|
inset 0 0 0 1px rgba(255,255,255,0.35) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .modal-header {
|
|
background: linear-gradient(45deg, #b0b0b0 5%, #ddd 12%, #c0c0c0 30%, #e5e5e5 50%, #c0c0c0 70%, #ddd 88%, #b0b0b0 95%) !important;
|
|
border-bottom: 1px solid #999 !important;
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0.6),
|
|
inset 0 -1px 0 rgba(0,0,0,0.06) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .modal-header .modal-title {
|
|
color: #333 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .modal-footer {
|
|
background: linear-gradient(45deg, #b8b8b8 5%, #d8d8d8 20%, #c0c0c0 50%, #d8d8d8 80%, #b8b8b8 95%) !important;
|
|
border-top: 1px solid #999 !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .modal-backdrop {
|
|
background-color: rgba(40,40,40,0.55) !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Page Head — Chrome Title Bar
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .page-head {
|
|
background: linear-gradient(45deg, #b8b8b8 3%, #e0e0e0 10%, #c8c8c8 25%, #eaeaea 45%, #ccc 60%, #e0e0e0 80%, #b8b8b8 97%) !important;
|
|
border-bottom: 1px solid #999 !important;
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0.6),
|
|
inset 0 -1px 0 rgba(0,0,0,0.06),
|
|
0 2px 4px rgba(0,0,0,0.08) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .page-head .title-text {
|
|
color: #333 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
List View — Metal Table
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .list-row-head {
|
|
background: linear-gradient(45deg, #aaa 3%, #d8d8d8 10%, #bbb 25%, #e0e0e0 45%, #bbb 60%, #d8d8d8 80%, #aaa 97%) !important;
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0.6),
|
|
inset 0 -1px 0 rgba(0,0,0,0.06) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .list-row-container .list-row {
|
|
border-bottom: 1px solid #b8b8b8 !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .list-row-container:hover {
|
|
background: linear-gradient(90deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.05) 100%) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .result .list-row-container .level-left .list-row--col .level-left .ellipsis {
|
|
color: #404040 !important;
|
|
}
|
|
|
|
/* Sticky right column: blend with metallic body + visible separator.
|
|
Uses a translucent bg so it reads continuous with body gradient while
|
|
still covering horizontally-overflowing columns under it. */
|
|
[data-jey-theme="chrome"] .frappe-list .list-row .level-right,
|
|
[data-jey-theme="chrome"] .frappe-list .list-row-head .level-right {
|
|
background: linear-gradient(90deg,
|
|
rgba(216,216,216,0.85) 0%,
|
|
rgba(208,208,208,0.88) 100%) !important;
|
|
backdrop-filter: blur(3px);
|
|
-webkit-backdrop-filter: blur(3px);
|
|
border-left: 1px solid #a0a0a0 !important;
|
|
box-shadow: inset 1px 0 0 rgba(255,255,255,0.5) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .frappe-list .list-row-container:hover .level-right {
|
|
background: linear-gradient(90deg,
|
|
rgba(224,224,224,0.9) 0%,
|
|
rgba(216,216,216,0.92) 100%) !important;
|
|
box-shadow:
|
|
inset 1px 0 0 rgba(255,255,255,0.55),
|
|
-6px 0 10px rgba(0,0,0,0.05) !important;
|
|
}
|
|
|
|
/* List sidebar */
|
|
[data-jey-theme="chrome"] .layout-side-section {
|
|
border-right: 1px solid #aaa !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Tables / Grids — Metallic Header & Rows
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .frappe-control[data-fieldtype="Table"] .form-grid {
|
|
border: 1px solid #999 !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .grid-heading-row {
|
|
background: linear-gradient(45deg, #aaa 3%, #d5d5d5 10%, #bbb 30%, #ddd 50%, #bbb 70%, #d5d5d5 90%, #aaa 97%) !important;
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0.6),
|
|
inset 0 -1px 0 rgba(0,0,0,0.06) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .grid-heading-row .static-area {
|
|
color: #444 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .rows .grid-row:hover {
|
|
background: linear-gradient(90deg, rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.05) 100%) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .rows .grid-row {
|
|
border-bottom: 1px solid #b8b8b8 !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .grid-footer {
|
|
background: transparent !important;
|
|
border-top: 1px solid #999 !important;
|
|
}
|
|
|
|
/* --- Active (edit-mode) grid cells: identical look to the static row --- */
|
|
/* Keep the row's bottom border visible even when in edit mode */
|
|
[data-jey-theme="chrome"] .rows .grid-row.editable-row,
|
|
[data-jey-theme="chrome"] .rows .grid-row:has(.editable-row) {
|
|
border-bottom: 1px solid #b8b8b8 !important;
|
|
}
|
|
|
|
/* Flatten every form control inside a grid row — no bg, no border, no shadow */
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"]),
|
|
[data-jey-theme="chrome"] .grid-row textarea.form-control,
|
|
[data-jey-theme="chrome"] .grid-row select.form-control,
|
|
[data-jey-theme="chrome"] .grid-row select.input-with-feedback,
|
|
[data-jey-theme="chrome"] .grid-row .awesomplete input,
|
|
[data-jey-theme="chrome"] .grid-row .like-disabled-input {
|
|
background: transparent !important;
|
|
border: 0 !important;
|
|
box-shadow: none !important;
|
|
outline: none !important;
|
|
color: #333 !important;
|
|
transition:
|
|
box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1),
|
|
background 0.45s cubic-bezier(0.22, 1, 0.36, 1) !important;
|
|
}
|
|
|
|
/* Focused cell: pressed-in look — same shadow pattern as .btn-default:active */
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"]):focus,
|
|
[data-jey-theme="chrome"] .grid-row textarea.form-control:focus,
|
|
[data-jey-theme="chrome"] .grid-row select.form-control:focus,
|
|
[data-jey-theme="chrome"] .grid-row select.input-with-feedback:focus,
|
|
[data-jey-theme="chrome"] .grid-row .awesomplete input:focus {
|
|
background: linear-gradient(45deg, #bbb 5%, #d8d8d8 10%, #c4c4c4 30%, #d0d0d0 50%, #c4c4c4 70%, #d8d8d8 85%, #bbb 95%) !important;
|
|
border: 0 !important;
|
|
outline: none !important;
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0),
|
|
inset 0 -1px 0 rgba(0,0,0,0.05),
|
|
inset 3px 3px 6px rgba(0,0,0,0.3),
|
|
inset -1px -1px 1px rgba(255,255,255,0.15) !important;
|
|
transition:
|
|
box-shadow 0.45s cubic-bezier(0.22, 1, 0.36, 1),
|
|
background 0.45s cubic-bezier(0.22, 1, 0.36, 1) !important;
|
|
}
|
|
|
|
/* Read-only cells — darker grey bg. Specificity matches the "flatten" rule above
|
|
(tag.class + two :not()), so it wins over `background: transparent`. Frappe hides
|
|
.field-area on inactive rows, so the tint only shows on the currently-active row. */
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"]):disabled,
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"])[disabled],
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"])[readonly],
|
|
[data-jey-theme="chrome"] .grid-row textarea.form-control:disabled,
|
|
[data-jey-theme="chrome"] .grid-row textarea.form-control[readonly],
|
|
[data-jey-theme="chrome"] .grid-row select.form-control:disabled,
|
|
[data-jey-theme="chrome"] .grid-row select.input-with-feedback:disabled {
|
|
background: #d8d8d8 !important;
|
|
box-shadow: none !important;
|
|
color: #666 !important;
|
|
}
|
|
|
|
/* No pressed-in effect on focus for read-only cells */
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"]):disabled:focus,
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"])[disabled]:focus,
|
|
[data-jey-theme="chrome"] .grid-row input.form-control:not([type="checkbox"]):not([type="radio"])[readonly]:focus,
|
|
[data-jey-theme="chrome"] .grid-row textarea.form-control:disabled:focus,
|
|
[data-jey-theme="chrome"] .grid-row textarea.form-control[readonly]:focus,
|
|
[data-jey-theme="chrome"] .grid-row select.form-control:disabled:focus {
|
|
background: #d8d8d8 !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
/* Match static-row cell height: static cells use padding 10px 8px; form-control in
|
|
Frappe uses padding-top:10px, padding-bottom: calc(--padding-md - 3px). Equalise so
|
|
the active row doesn't grow or shrink compared to an idle row. */
|
|
[data-jey-theme="chrome"] .grid-row .editable-row .form-control {
|
|
padding-top: 10px !important;
|
|
padding-bottom: 10px !important;
|
|
height: auto !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Tabs — Metallic Tab Strip
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .form-tabs .nav-link {
|
|
color: #666 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.4);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .form-tabs .nav-link:hover {
|
|
color: #444 !important;
|
|
background: linear-gradient(180deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.05) 100%) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .form-tabs .nav-link.active {
|
|
color: #333 !important;
|
|
background: linear-gradient(180deg, rgba(255,255,255,0.2) 0%, transparent 100%) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .form-tabs .nav-link::after {
|
|
background: #777;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Dropdowns — Chrome Panel
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .dropdown-menu {
|
|
background: linear-gradient(45deg, #c0c0c0 3%, #e5e5e5 10%, #d0d0d0 30%, #eaeaea 50%, #d0d0d0 70%, #e5e5e5 90%, #c0c0c0 97%) !important;
|
|
border: 1px solid #999 !important;
|
|
box-shadow:
|
|
4px 4px 12px rgba(0,0,0,0.18),
|
|
-2px -2px 4px rgba(255,255,255,0.15),
|
|
inset 0 1px 0 rgba(255,255,255,0.6) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .dropdown-item {
|
|
color: #444 !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .dropdown-item:hover,
|
|
[data-jey-theme="chrome"] .dropdown-item:focus {
|
|
background: linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.05) 100%) !important;
|
|
color: #222 !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .dropdown-divider {
|
|
border-top-color: #aaa !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Alerts / Toasts
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .desk-alert {
|
|
background: linear-gradient(45deg, #c0c0c0 5%, #e5e5e5 15%, #d0d0d0 40%, #e8e8e8 60%, #d0d0d0 85%, #c0c0c0 95%) !important;
|
|
border: 1px solid #999 !important;
|
|
box-shadow:
|
|
3px 3px 8px rgba(0,0,0,0.12),
|
|
-1px -1px 3px rgba(255,255,255,0.3),
|
|
inset 0 1px 0 rgba(255,255,255,0.5) !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Breadcrumbs
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .breadcrumb-container a {
|
|
color: #666 !important;
|
|
text-shadow: 0 1px 0 rgba(255,255,255,0.4);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .breadcrumb-container a:hover {
|
|
color: #333 !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Timeline
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .new-timeline::before {
|
|
border-left-color: #aaa !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .timeline-dot {
|
|
background: linear-gradient(45deg, #bbb, #ddd, #bbb) !important;
|
|
border: 1px solid #999 !important;
|
|
box-shadow: 1px 1px 2px rgba(0,0,0,0.1), -1px -1px 1px rgba(255,255,255,0.3);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .comment-box {
|
|
background: linear-gradient(45deg, #c8c8c8 5%, #e5e5e5 20%, #d5d5d5 50%, #e5e5e5 80%, #c8c8c8 95%) !important;
|
|
border: 1px solid #aaa !important;
|
|
box-shadow: 1px 1px 3px rgba(0,0,0,0.08), -1px -1px 2px rgba(255,255,255,0.3);
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Badges / Indicators
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .indicator-pill {
|
|
box-shadow:
|
|
inset 0 1px 0 rgba(255,255,255,0.3),
|
|
1px 1px 1px rgba(0,0,0,0.08);
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Popovers
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .popover {
|
|
background: linear-gradient(45deg, #c0c0c0 3%, #e5e5e5 10%, #d0d0d0 30%, #eaeaea 50%, #d0d0d0 70%, #e5e5e5 90%, #c0c0c0 97%) !important;
|
|
border: 1px solid #999 !important;
|
|
box-shadow:
|
|
4px 4px 12px rgba(0,0,0,0.15),
|
|
-2px -2px 4px rgba(255,255,255,0.2),
|
|
inset 0 1px 0 rgba(255,255,255,0.5) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .popover .popover-body {
|
|
color: #404040 !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Module Widget Cards — Chrome Panels with Conic Border Accent
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] .ce-block .links-widget-box,
|
|
[data-jey-theme="chrome"] .ce-block .number-widget-box {
|
|
background: linear-gradient(45deg, #c0c0c0 3%, #e5e5e5 12%, #d0d0d0 30%, #eaeaea 50%, #d0d0d0 70%, #e5e5e5 88%, #c0c0c0 97%) !important;
|
|
border: 1px solid #aaa !important;
|
|
box-shadow:
|
|
2px 2px 6px rgba(0,0,0,0.1),
|
|
-1px -1px 3px rgba(255,255,255,0.35),
|
|
inset 0 1px 0 rgba(255,255,255,0.6) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .ce-block .links-widget-box::after,
|
|
[data-jey-theme="chrome"] .ce-block .number-widget-box::after {
|
|
background: conic-gradient(from 140deg, #a0a0a0, #e0e0e0, #888, #d0d0d0, #a0a0a0) !important;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] .ce-block .links-widget-box:hover,
|
|
[data-jey-theme="chrome"] .ce-block .number-widget-box:hover {
|
|
box-shadow:
|
|
3px 3px 10px rgba(0,0,0,0.14),
|
|
-2px -2px 5px rgba(255,255,255,0.3),
|
|
inset 0 1px 0 rgba(255,255,255,0.7) !important;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Scrollbars — Metal Cylinder
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] ::-webkit-scrollbar {
|
|
width: 10px;
|
|
height: 10px;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] ::-webkit-scrollbar-track {
|
|
background: linear-gradient(90deg, #c0c0c0, #d0d0d0, #c0c0c0);
|
|
}
|
|
|
|
[data-jey-theme="chrome"] ::-webkit-scrollbar-thumb {
|
|
background: linear-gradient(90deg, #888, #bbb, #999, #bbb, #888);
|
|
border-radius: 5px;
|
|
border: 1px solid #999;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] ::-webkit-scrollbar-thumb:hover {
|
|
background: linear-gradient(90deg, #777, #aaa, #888, #aaa, #777);
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Link Colors
|
|
========================================================================== */
|
|
|
|
[data-jey-theme="chrome"] a {
|
|
color: #555;
|
|
}
|
|
|
|
[data-jey-theme="chrome"] a:hover {
|
|
color: #333;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Print — Reset
|
|
========================================================================== */
|
|
|
|
@media print {
|
|
[data-jey-theme="chrome"] body,
|
|
[data-jey-theme="chrome"] .page-container,
|
|
[data-jey-theme="chrome"] .form-page,
|
|
[data-jey-theme="chrome"] .frappe-card,
|
|
[data-jey-theme="chrome"] .modal-content,
|
|
[data-jey-theme="chrome"] .navbar {
|
|
background: white !important;
|
|
box-shadow: none !important;
|
|
border-color: #ddd !important;
|
|
text-shadow: none !important;
|
|
}
|
|
[data-jey-theme="chrome"] .btn-primary {
|
|
background: #333 !important;
|
|
text-shadow: none !important;
|
|
}
|
|
}
|