fix: remove body background-color/color transitions to prevent theme flash
- Remove transition: background-color/color from body in all CSS files - These transitions caused visible flash when navigating between pages - The browser would animate from old theme colors to new theme colors
This commit is contained in:
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/accounting.min.css
vendored
2
pos/static/css/accounting.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -12,8 +12,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/catalog.min.css
vendored
2
pos/static/css/catalog.min.css
vendored
@@ -12,8 +12,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/config.min.css
vendored
2
pos/static/css/config.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -20,8 +20,6 @@
|
|||||||
font-weight: var(--font-weight-regular);
|
font-weight: var(--font-weight-regular);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
2
pos/static/css/customers.min.css
vendored
2
pos/static/css/customers.min.css
vendored
@@ -20,8 +20,6 @@
|
|||||||
font-weight: var(--font-weight-regular);
|
font-weight: var(--font-weight-regular);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|||||||
@@ -23,8 +23,6 @@
|
|||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Modern theme dot-grid on body */
|
/* Modern theme dot-grid on body */
|
||||||
|
|||||||
2
pos/static/css/dashboard.min.css
vendored
2
pos/static/css/dashboard.min.css
vendored
@@ -23,8 +23,6 @@
|
|||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Modern theme dot-grid on body */
|
/* Modern theme dot-grid on body */
|
||||||
|
|||||||
@@ -12,8 +12,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/diagrams.min.css
vendored
2
pos/static/css/diagrams.min.css
vendored
@@ -12,8 +12,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/fleet.min.css
vendored
2
pos/static/css/fleet.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/inventory.min.css
vendored
2
pos/static/css/inventory.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/invoicing.min.css
vendored
2
pos/static/css/invoicing.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-slow) var(--ease-in-out),
|
|
||||||
color var(--duration-slow) var(--ease-in-out);
|
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -58,8 +56,6 @@
|
|||||||
background-color: var(--color-bg-elevated);
|
background-color: var(--color-bg-elevated);
|
||||||
border-bottom: 1px solid var(--color-border);
|
border-bottom: 1px solid var(--color-border);
|
||||||
box-shadow: var(--shadow-sm);
|
box-shadow: var(--shadow-sm);
|
||||||
transition: background-color var(--duration-slow) var(--ease-in-out),
|
|
||||||
border-color var(--duration-slow) var(--ease-in-out);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.theme-bar__label {
|
.theme-bar__label {
|
||||||
@@ -657,8 +653,6 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
gap: var(--space-4);
|
gap: var(--space-4);
|
||||||
background: var(--color-surface-1);
|
background: var(--color-surface-1);
|
||||||
transition: background-color var(--duration-slow) var(--ease-in-out),
|
|
||||||
border-color var(--duration-slow) var(--ease-in-out);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer-version {
|
.footer-version {
|
||||||
|
|||||||
6
pos/static/css/login.min.css
vendored
6
pos/static/css/login.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-slow) var(--ease-in-out),
|
|
||||||
color var(--duration-slow) var(--ease-in-out);
|
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -58,8 +56,6 @@
|
|||||||
background-color: var(--color-bg-elevated);
|
background-color: var(--color-bg-elevated);
|
||||||
border-bottom: 1px solid var(--color-border);
|
border-bottom: 1px solid var(--color-border);
|
||||||
box-shadow: var(--shadow-sm);
|
box-shadow: var(--shadow-sm);
|
||||||
transition: background-color var(--duration-slow) var(--ease-in-out),
|
|
||||||
border-color var(--duration-slow) var(--ease-in-out);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.theme-bar__label {
|
.theme-bar__label {
|
||||||
@@ -657,8 +653,6 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
gap: var(--space-4);
|
gap: var(--space-4);
|
||||||
background: var(--color-surface-1);
|
background: var(--color-surface-1);
|
||||||
transition: background-color var(--duration-slow) var(--ease-in-out),
|
|
||||||
border-color var(--duration-slow) var(--ease-in-out);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer-version {
|
.footer-version {
|
||||||
|
|||||||
@@ -21,8 +21,6 @@
|
|||||||
font-weight: var(--font-weight-regular);
|
font-weight: var(--font-weight-regular);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|||||||
2
pos/static/css/pos.min.css
vendored
2
pos/static/css/pos.min.css
vendored
@@ -21,8 +21,6 @@
|
|||||||
font-weight: var(--font-weight-regular);
|
font-weight: var(--font-weight-regular);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/reports.min.css
vendored
2
pos/static/css/reports.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body);
|
font-size: var(--text-body);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
2
pos/static/css/whatsapp.min.css
vendored
2
pos/static/css/whatsapp.min.css
vendored
@@ -19,8 +19,6 @@
|
|||||||
font-size: var(--text-body-sm);
|
font-size: var(--text-body-sm);
|
||||||
color: var(--color-text-primary);
|
color: var(--color-text-primary);
|
||||||
background-color: var(--color-bg-base);
|
background-color: var(--color-bg-base);
|
||||||
transition: background-color var(--duration-normal) var(--ease-in-out),
|
|
||||||
color var(--duration-normal) var(--ease-in-out);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user