add missing chrome styles + animations across app
- List activity area: timestamps, comments, like button with heart animation - Indicator pills: metallic colored variants (blue, green, red, orange, etc) - SVG icons: chrome tinting with drop-shadow - Tag pills: metallic gradient styling - Filter area: chrome popover, remove button hover - List sidebar: buttons, links, filter pills - Filter/sort selector button groups: metallic gradient - Animations: dropdown slide-down, modal scale-in, toast slide-up, button metal-press + shine sweep, list row glint on hover, popover fade-scale, sidebar slide, navbar lift, card transitions, number widget hover scale, comment box focus glow Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
513522efb8
commit
96638dd26f
|
|
@ -823,6 +823,554 @@
|
|||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
List Row Activity Area — timestamps, comments, likes
|
||||
========================================================================== */
|
||||
|
||||
[data-jey-theme="chrome"] .list-row-activity {
|
||||
color: #777 !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-row-activity .modified,
|
||||
[data-jey-theme="chrome"] .list-row-activity .frappe-timestamp {
|
||||
color: #888 !important;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,0.4);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-row-activity .comment-count {
|
||||
color: #777 !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-row-activity .es-icon,
|
||||
[data-jey-theme="chrome"] .list-row-activity .icon {
|
||||
color: #999 !important;
|
||||
transition: color 0.2s ease, transform 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-row-activity .comment-count:hover .es-icon {
|
||||
color: #555 !important;
|
||||
transform: scale(1.15);
|
||||
}
|
||||
|
||||
/* Like button */
|
||||
[data-jey-theme="chrome"] .like-action {
|
||||
transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .like-action:hover {
|
||||
transform: scale(1.3);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .like-action .like-icon {
|
||||
color: #aaa !important;
|
||||
transition: color 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .like-action:hover .like-icon {
|
||||
color: #c44 !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .like-action.liked .like-icon {
|
||||
color: #c44 !important;
|
||||
filter: drop-shadow(0 0 3px rgba(204,68,68,0.3));
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Indicator Pills — Metallic colored variants
|
||||
========================================================================== */
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill {
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.4),
|
||||
1px 1px 2px rgba(0,0,0,0.1),
|
||||
-1px -1px 1px rgba(255,255,255,0.2) !important;
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||
border: 1px solid rgba(0,0,0,0.08) !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.5),
|
||||
2px 2px 4px rgba(0,0,0,0.12),
|
||||
-1px -1px 2px rgba(255,255,255,0.25) !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.blue {
|
||||
background: linear-gradient(45deg, #6090c0 5%, #8ec0f0 30%, #7ab0e0 60%, #8ec0f0 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #5080b0 !important;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.green {
|
||||
background: linear-gradient(45deg, #3a8a5a 5%, #5cc080 30%, #48a868 60%, #5cc080 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #2f7a4a !important;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.red {
|
||||
background: linear-gradient(45deg, #b84040 5%, #e07070 30%, #cc5555 60%, #e07070 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #a03030 !important;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.orange {
|
||||
background: linear-gradient(45deg, #c07030 5%, #e8a060 30%, #d88848 60%, #e8a060 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #a86028 !important;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.yellow {
|
||||
background: linear-gradient(45deg, #b89820 5%, #e0c850 30%, #cca830 60%, #e0c850 90%) !important;
|
||||
color: #444 !important;
|
||||
border-color: #a08818 !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.gray {
|
||||
background: linear-gradient(45deg, #999 5%, #c0c0c0 30%, #aaa 60%, #c0c0c0 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #888 !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.purple {
|
||||
background: linear-gradient(45deg, #7050a0 5%, #a080d0 30%, #8868b8 60%, #a080d0 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #6040a0 !important;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.cyan {
|
||||
background: linear-gradient(45deg, #2090a0 5%, #50c0d0 30%, #38a8b8 60%, #50c0d0 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #1880a0 !important;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .indicator-pill.pink {
|
||||
background: linear-gradient(45deg, #c05088 5%, #e888b8 30%, #d068a0 60%, #e888b8 90%) !important;
|
||||
color: #fff !important;
|
||||
border-color: #b04080 !important;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
SVG Icons — Chrome Tinting
|
||||
========================================================================== */
|
||||
|
||||
[data-jey-theme="chrome"] .icon,
|
||||
[data-jey-theme="chrome"] .es-icon {
|
||||
color: #777 !important;
|
||||
transition: color 0.2s ease, transform 0.2s ease, filter 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .navbar .icon,
|
||||
[data-jey-theme="chrome"] .navbar .es-icon {
|
||||
color: #666 !important;
|
||||
filter: drop-shadow(0 1px 0 rgba(255,255,255,0.4));
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Tag Pills
|
||||
========================================================================== */
|
||||
|
||||
[data-jey-theme="chrome"] .tag-pill {
|
||||
background: linear-gradient(45deg, #bbb, #d8d8d8, #c0c0c0) !important;
|
||||
border: 1px solid #999 !important;
|
||||
color: #444 !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.4),
|
||||
1px 1px 1px rgba(0,0,0,0.08);
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .tag-pill:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.5),
|
||||
2px 2px 3px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Filter Area — Chrome styled
|
||||
========================================================================== */
|
||||
|
||||
[data-jey-theme="chrome"] .filter-popover {
|
||||
background: linear-gradient(45deg, #c0c0c0 3%, #e5e5e5 12%, #d0d0d0 30%, #eaeaea 50%, #d0d0d0 70%, #e5e5e5 88%, #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"] .filter-box {
|
||||
border-bottom: 1px solid #b0b0b0 !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .filter-box .filter-field .form-control {
|
||||
background: linear-gradient(180deg, #c8c8c8 0%, #d5d5d5 100%) !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .remove-filter {
|
||||
color: #999 !important;
|
||||
transition: color 0.2s ease, transform 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .remove-filter:hover {
|
||||
color: #c44 !important;
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .active-tag-bar .btn {
|
||||
background: linear-gradient(45deg, #bbb, #ddd, #c0c0c0) !important;
|
||||
border: 1px solid #999 !important;
|
||||
color: #444 !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.5),
|
||||
1px 1px 2px rgba(0,0,0,0.08);
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
List Sidebar — Chrome Styled
|
||||
========================================================================== */
|
||||
|
||||
[data-jey-theme="chrome"] .list-sidebar .list-sidebar-button {
|
||||
color: #555 !important;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,0.4);
|
||||
transition: color 0.2s ease, transform 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-sidebar .list-sidebar-button:hover {
|
||||
color: #333 !important;
|
||||
transform: translateX(3px);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-sidebar .filter-pill {
|
||||
background: linear-gradient(45deg, #bbb, #ddd, #c0c0c0) !important;
|
||||
border: 1px solid #999 !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.4),
|
||||
1px 1px 1px rgba(0,0,0,0.06);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-sidebar .list-link {
|
||||
color: #555 !important;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-sidebar .list-link:hover {
|
||||
color: #333 !important;
|
||||
background: linear-gradient(90deg, rgba(255,255,255,0.2) 0%, transparent 100%) !important;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Filter/Sort Selector Button Groups
|
||||
========================================================================== */
|
||||
|
||||
[data-jey-theme="chrome"] .filter-selector .btn,
|
||||
[data-jey-theme="chrome"] .sort-selector .btn {
|
||||
background: linear-gradient(45deg, #bbb 5%, #e0e0e0 15%, #ccc 40%, #ddd 60%, #ccc 85%, #bbb 95%) !important;
|
||||
border: 1px solid #999 !important;
|
||||
color: #444 !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.5),
|
||||
inset 0 -1px 0 rgba(0,0,0,0.05),
|
||||
1px 1px 2px rgba(0,0,0,0.08) !important;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,0.4);
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .filter-selector .btn:hover,
|
||||
[data-jey-theme="chrome"] .sort-selector .btn:hover {
|
||||
background: linear-gradient(45deg, #c0c0c0 5%, #e8e8e8 15%, #d4d4d4 40%, #e5e5e5 60%, #d4d4d4 85%, #c0c0c0 95%) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255,255,255,0.6),
|
||||
2px 2px 4px rgba(0,0,0,0.1) !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .filter-label {
|
||||
background: linear-gradient(45deg, #888, #aaa, #888) !important;
|
||||
color: #f0f0f0 !important;
|
||||
box-shadow: inset 0 1px 0 rgba(255,255,255,0.2);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .btn-group {
|
||||
box-shadow: 1px 1px 3px rgba(0,0,0,0.08), -1px -1px 2px rgba(255,255,255,0.3);
|
||||
border-radius: var(--border-radius) !important;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .btn-paging {
|
||||
background: linear-gradient(45deg, #bbb, #ddd, #c0c0c0, #ddd, #bbb) !important;
|
||||
border: 1px solid #999 !important;
|
||||
color: #444 !important;
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
ANIMATIONS
|
||||
========================================================================== */
|
||||
|
||||
/* --- Shine sweep keyframe --- */
|
||||
@keyframes jey-shine-sweep {
|
||||
0% { left: -30%; }
|
||||
100% { left: 130%; }
|
||||
}
|
||||
|
||||
/* --- Metal press (button click) --- */
|
||||
@keyframes jey-metal-press {
|
||||
0% { transform: scale(1); }
|
||||
40% { transform: scale(0.95); }
|
||||
100% { transform: scale(1); }
|
||||
}
|
||||
|
||||
/* --- Slide down reveal --- */
|
||||
@keyframes jey-slide-down {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px) scaleY(0.95);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0) scaleY(1);
|
||||
}
|
||||
}
|
||||
|
||||
/* --- Slide up reveal --- */
|
||||
@keyframes jey-slide-up {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(8px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* --- Fade in scale --- */
|
||||
@keyframes jey-fade-scale {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: scale(0.92);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
/* --- Metal glint (subtle highlight flash) --- */
|
||||
@keyframes jey-glint {
|
||||
0% { opacity: 0; left: -20%; }
|
||||
50% { opacity: 1; }
|
||||
100% { opacity: 0; left: 120%; }
|
||||
}
|
||||
|
||||
|
||||
/* --- Dropdown menus: slide down --- */
|
||||
[data-jey-theme="chrome"] .dropdown-menu.show {
|
||||
animation: jey-slide-down 0.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
|
||||
transform-origin: top center;
|
||||
}
|
||||
|
||||
/* --- Filter popover: slide down --- */
|
||||
[data-jey-theme="chrome"] .filter-popover {
|
||||
animation: jey-slide-down 0.25s cubic-bezier(0.22, 1, 0.36, 1) forwards;
|
||||
transform-origin: top center;
|
||||
}
|
||||
|
||||
/* --- Modals: scale in --- */
|
||||
[data-jey-theme="chrome"] .modal.show .modal-dialog {
|
||||
animation: jey-fade-scale 0.25s cubic-bezier(0.22, 1, 0.36, 1) forwards;
|
||||
}
|
||||
|
||||
/* --- Popovers: scale in --- */
|
||||
[data-jey-theme="chrome"] .popover.show {
|
||||
animation: jey-fade-scale 0.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
|
||||
}
|
||||
|
||||
/* --- Toasts: slide up --- */
|
||||
[data-jey-theme="chrome"] .desk-alert {
|
||||
animation: jey-slide-up 0.3s cubic-bezier(0.22, 1, 0.36, 1) forwards;
|
||||
}
|
||||
|
||||
/* --- All buttons: smooth transitions + metal press on click --- */
|
||||
[data-jey-theme="chrome"] .btn {
|
||||
transition: all 0.2s ease, transform 0.15s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .btn:active {
|
||||
animation: jey-metal-press 0.15s ease forwards;
|
||||
}
|
||||
|
||||
/* --- Default/Secondary buttons: shine sweep on hover --- */
|
||||
[data-jey-theme="chrome"] .btn-default,
|
||||
[data-jey-theme="chrome"] .btn-secondary {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .btn-default::before,
|
||||
[data-jey-theme="chrome"] .btn-secondary::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0; left: -30%; width: 20%; height: 100%;
|
||||
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
|
||||
transform: skewX(-15deg);
|
||||
pointer-events: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .btn-default:hover::before,
|
||||
[data-jey-theme="chrome"] .btn-secondary:hover::before {
|
||||
animation: jey-shine-sweep 0.5s ease forwards;
|
||||
}
|
||||
|
||||
/* --- Sidebar items: smooth slide hover --- */
|
||||
[data-jey-theme="chrome"] .body-sidebar .standard-sidebar-item .item-anchor {
|
||||
transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .body-sidebar .standard-sidebar-item .item-anchor:hover {
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
/* --- Navbar links: lift on hover --- */
|
||||
[data-jey-theme="chrome"] .navbar .navbar-nav .nav-link {
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .navbar .navbar-nav .nav-link:hover {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
/* --- List rows: metallic glint on hover --- */
|
||||
[data-jey-theme="chrome"] .list-row-container {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-row-container::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0; left: -20%; width: 15%; height: 100%;
|
||||
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
|
||||
transform: skewX(-15deg);
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .list-row-container:hover::before {
|
||||
animation: jey-glint 0.6s ease forwards;
|
||||
}
|
||||
|
||||
/* --- Grid rows: hover transition --- */
|
||||
[data-jey-theme="chrome"] .rows .grid-row {
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
/* --- Form sections: smooth collapse/expand --- */
|
||||
[data-jey-theme="chrome"] .section-body {
|
||||
transition: max-height 0.3s cubic-bezier(0.22, 1, 0.36, 1),
|
||||
opacity 0.25s ease;
|
||||
}
|
||||
|
||||
/* --- Form tabs: smooth underline slide --- */
|
||||
[data-jey-theme="chrome"] .form-tabs .nav-link {
|
||||
transition: all 0.25s cubic-bezier(0.22, 1, 0.36, 1) !important;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* --- Awesomebar dropdown: slide down --- */
|
||||
[data-jey-theme="chrome"] .awesomplete > ul {
|
||||
animation: jey-slide-down 0.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
|
||||
background: linear-gradient(45deg, #c0c0c0 3%, #e5e5e5 12%, #d0d0d0 30%, #eaeaea 50%, #d0d0d0 70%, #e5e5e5 88%, #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"] .awesomplete > ul > li:hover,
|
||||
[data-jey-theme="chrome"] .awesomplete > ul > li[aria-selected="true"] {
|
||||
background: linear-gradient(90deg, rgba(255,255,255,0.3) 0%, rgba(255,255,255,0.05) 100%) !important;
|
||||
}
|
||||
|
||||
/* --- Card hover: lift + enhanced shadow --- */
|
||||
[data-jey-theme="chrome"] .frappe-card {
|
||||
transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
|
||||
box-shadow 0.25s ease;
|
||||
}
|
||||
|
||||
/* --- Indicator pills: bounce on appear --- */
|
||||
[data-jey-theme="chrome"] .indicator-pill {
|
||||
animation: jey-slide-up 0.2s ease forwards;
|
||||
}
|
||||
|
||||
/* --- Comment box: fade in --- */
|
||||
[data-jey-theme="chrome"] .comment-box {
|
||||
transition: box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .comment-box:focus-within {
|
||||
box-shadow:
|
||||
2px 2px 6px 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;
|
||||
}
|
||||
|
||||
/* --- Page container fade in on route change --- */
|
||||
[data-jey-theme="chrome"] .page-container[data-page-container] {
|
||||
animation: jey-fade-scale 0.2s ease forwards;
|
||||
}
|
||||
|
||||
/* --- Link item in widget cards: slide right on hover --- */
|
||||
[data-jey-theme="chrome"] .links-widget-box .link-item {
|
||||
transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1),
|
||||
background 0.2s ease,
|
||||
box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .links-widget-box .link-item:hover {
|
||||
box-shadow: inset 3px 0 0 #999;
|
||||
}
|
||||
|
||||
/* --- Sidebar section labels: subtle slide --- */
|
||||
[data-jey-theme="chrome"] .sidebar-section {
|
||||
transition: background 0.2s ease;
|
||||
}
|
||||
|
||||
/* --- Number widget value: count up glow --- */
|
||||
[data-jey-theme="chrome"] .number-widget-box .widget-title {
|
||||
color: #555 !important;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .number-widget-box .number {
|
||||
color: #333 !important;
|
||||
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
[data-jey-theme="chrome"] .number-widget-box:hover .number {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Print — Reset
|
||||
========================================================================== */
|
||||
|
|
|
|||
Loading…
Reference in New Issue