v0.14.8
This commit is contained in:
Mateusz Gruszczyński
+328
-79
@@ -4,7 +4,6 @@
|
||||
--canvas: #181818;
|
||||
--surface: #1c1c1c;
|
||||
--surface-2: #222222;
|
||||
--surface-3: #282828;
|
||||
--surface-muted: #202020;
|
||||
--input-bg: #181818;
|
||||
--nav-bg: #171717;
|
||||
@@ -33,11 +32,7 @@
|
||||
--orange: #fb923c;
|
||||
--backdrop: rgba(0, 0, 0, .68);
|
||||
--grid: rgba(255, 255, 255, .07);
|
||||
--scroll-thumb: #444444;
|
||||
--scroll-thumb-hover: #575757;
|
||||
--radius: 16px;
|
||||
--radius-small: 10px;
|
||||
--radius-medium: 14px;
|
||||
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
}
|
||||
|
||||
@@ -47,7 +42,6 @@
|
||||
--canvas: #f8faf9;
|
||||
--surface: #ffffff;
|
||||
--surface-2: #f5f6f6;
|
||||
--surface-3: #eef0ef;
|
||||
--surface-muted: #f6f7f7;
|
||||
--input-bg: #ffffff;
|
||||
--nav-bg: #ffffff;
|
||||
@@ -76,8 +70,6 @@
|
||||
--orange: #c56b21;
|
||||
--backdrop: rgba(23, 23, 23, .32);
|
||||
--grid: rgba(24, 24, 27, .08);
|
||||
--scroll-thumb: #c8ccca;
|
||||
--scroll-thumb-hover: #aeb3b0;
|
||||
}
|
||||
|
||||
* {
|
||||
@@ -119,7 +111,6 @@ button:disabled {
|
||||
top: 0;
|
||||
z-index: 20;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
min-height: 72px;
|
||||
@@ -184,7 +175,6 @@ button:disabled {
|
||||
|
||||
button {
|
||||
border: 0;
|
||||
border-radius: 13px;
|
||||
padding: 11px 15px;
|
||||
color: var(--text);
|
||||
background: var(--surface-2);
|
||||
@@ -285,9 +275,7 @@ h3 {
|
||||
}
|
||||
|
||||
.lead {
|
||||
max-width: 690px;
|
||||
color: var(--muted);
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.hero {
|
||||
@@ -350,7 +338,6 @@ h3 {
|
||||
.metric {
|
||||
padding: 18px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 18px;
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
@@ -392,7 +379,6 @@ h3 {
|
||||
.panel,
|
||||
.list-card {
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
background: var(--surface);
|
||||
}
|
||||
|
||||
@@ -840,7 +826,6 @@ h3 {
|
||||
|
||||
.legend {
|
||||
display: flex;
|
||||
gap: 18px;
|
||||
margin-top: 10px;
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
@@ -885,6 +870,31 @@ select:focus {
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
select:not(.toolbar-picker-select) {
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
padding-right: 38px;
|
||||
background-image:
|
||||
linear-gradient(45deg, transparent 50%, var(--muted) 50%),
|
||||
linear-gradient(135deg, var(--muted) 50%, transparent 50%);
|
||||
background-position:
|
||||
calc(100% - 17px) 50%,
|
||||
calc(100% - 12px) 50%;
|
||||
background-size: 5px 5px, 5px 5px;
|
||||
background-repeat: no-repeat;
|
||||
cursor: pointer;
|
||||
transition: border-color .15s ease, background-color .15s ease, outline-color .15s ease;
|
||||
}
|
||||
|
||||
select:not(.toolbar-picker-select):hover:not(:disabled) {
|
||||
border-color: color-mix(in srgb, var(--accent) 32%, var(--line));
|
||||
background-color: color-mix(in srgb, var(--input-bg) 90%, var(--surface-muted));
|
||||
}
|
||||
|
||||
select:not(.toolbar-picker-select):disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.check {
|
||||
display: flex;
|
||||
grid-auto-flow: column;
|
||||
@@ -1077,9 +1087,6 @@ select:focus {
|
||||
}
|
||||
|
||||
.log-row {
|
||||
display: grid;
|
||||
grid-template-columns: 78px 150px 1fr;
|
||||
gap: 12px;
|
||||
padding: 11px 12px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
font-size: 12px;
|
||||
@@ -1550,11 +1557,27 @@ legend {
|
||||
flex: 0 0 auto;
|
||||
min-width: 94px;
|
||||
padding: 10px 13px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 14px;
|
||||
background: var(--surface-muted);
|
||||
color: var(--text);
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
button.outside-pill {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button.outside-pill:hover {
|
||||
border-color: color-mix(in srgb, var(--accent) 28%, var(--line));
|
||||
background: color-mix(in srgb, var(--surface-muted) 86%, var(--accent-soft));
|
||||
}
|
||||
|
||||
button.outside-pill:focus-visible {
|
||||
outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.outside-pill small,
|
||||
.outside-pill strong {
|
||||
display: block;
|
||||
@@ -1570,6 +1593,92 @@ legend {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.outdoor-history-dialog {
|
||||
width: min(920px, calc(100% - 24px));
|
||||
}
|
||||
|
||||
.outdoor-history-current {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
padding: 12px 14px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 14px;
|
||||
background: var(--surface-muted);
|
||||
}
|
||||
|
||||
.outdoor-history-current small {
|
||||
color: var(--muted);
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.outdoor-history-current strong {
|
||||
font-size: 24px;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.outdoor-history-dialog .history-chart-card {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.outdoor-history-dialog .history-chart-card:not(.chart-fullscreen-fallback) .chart-wrap {
|
||||
height: auto;
|
||||
max-height: none;
|
||||
}
|
||||
|
||||
.outdoor-history-dialog .history-chart-card:not(.chart-fullscreen-fallback) canvas {
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
.outdoor-history-links {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px 14px;
|
||||
flex-wrap: wrap;
|
||||
padding: 11px 2px 0;
|
||||
color: var(--muted);
|
||||
font-size: 11px;
|
||||
font-weight: 650;
|
||||
}
|
||||
|
||||
.outdoor-history-links > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.outdoor-history-links a {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 32px;
|
||||
padding: 6px 10px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 9px;
|
||||
background: var(--surface-muted);
|
||||
color: var(--text-soft);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.outdoor-history-links a:hover {
|
||||
border-color: color-mix(in srgb, var(--accent) 36%, var(--line));
|
||||
background: var(--surface-2);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.outdoor-history-links .outdoor-history-all {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.outdoor-history-loading {
|
||||
padding: 28px;
|
||||
color: var(--muted);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.automation-plan-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
|
||||
@@ -1908,7 +2017,6 @@ legend {
|
||||
|
||||
.chart-title-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
margin-bottom: 12px;
|
||||
@@ -2096,9 +2204,7 @@ legend {
|
||||
}
|
||||
|
||||
.history-context-controls {
|
||||
display: flex;
|
||||
flex: 1 1 260px;
|
||||
min-width: min(100%, 220px);
|
||||
}
|
||||
|
||||
.history-context-controls label {
|
||||
@@ -2883,7 +2989,6 @@ legend {
|
||||
.settings-block-head {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 13px;
|
||||
}
|
||||
|
||||
.settings-block-head h3 {
|
||||
@@ -3298,7 +3403,6 @@ legend {
|
||||
.device-capability-panel {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
padding: 12px 0 2px;
|
||||
}
|
||||
|
||||
.device-capability-panel>small {
|
||||
@@ -3311,22 +3415,12 @@ legend {
|
||||
.device-capability-buttons {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 7px;
|
||||
}
|
||||
|
||||
.device-capability-buttons button {
|
||||
min-height: 34px;
|
||||
padding: 7px 11px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 11px;
|
||||
background: var(--surface-muted);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.device-capability-buttons button.active {
|
||||
border-color: var(--accent);
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.device-capability-panel {
|
||||
justify-items: center;
|
||||
@@ -3544,7 +3638,6 @@ legend {
|
||||
|
||||
.group-custom-temperature-row {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto auto;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
@@ -4022,9 +4115,6 @@ body.simulation-standalone [data-view="simulation"] {
|
||||
background: var(--warning-soft);
|
||||
}
|
||||
|
||||
.quick-thermostat-control .thermostat-main {
|
||||
margin: 8px 0 7px;
|
||||
}
|
||||
|
||||
.zone-config-card .zone-enable-toggle {
|
||||
min-height: 28px;
|
||||
@@ -4529,7 +4619,6 @@ body.simulation-standalone [data-view="simulation"] {
|
||||
}
|
||||
|
||||
#controlPlan .plan-card-head .eyebrow {
|
||||
font-size: 8px;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
@@ -4542,10 +4631,6 @@ body.simulation-standalone [data-view="simulation"] {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#controlPlan .plan-card>p {
|
||||
font-size: 10px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#controlPlan .plan-temp {
|
||||
gap: 5px;
|
||||
@@ -4587,8 +4672,6 @@ body.simulation-standalone [data-view="simulation"] {
|
||||
#controlPlan .plan-events li {
|
||||
grid-template-columns: 62px minmax(0, 1fr);
|
||||
gap: 5px;
|
||||
font-size: 9px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
#controlPlan .plan-events li span {
|
||||
@@ -4626,14 +4709,12 @@ body.simulation-standalone [data-view="simulation"] {
|
||||
|
||||
#controlPlan .plan-rule-summary strong {
|
||||
color: var(--text);
|
||||
font-size: 10px;
|
||||
font-weight: 650;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
#controlPlan .plan-rule-summary small {
|
||||
color: var(--muted);
|
||||
font-size: 9px;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
@@ -4684,9 +4765,6 @@ body.simulation-standalone [data-view="simulation"] {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
#controlPlan.automation-plan-grid {
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
[data-view="dashboard"] .dashboard-summary-card {
|
||||
@@ -5510,10 +5588,6 @@ textarea[aria-invalid="true"] {
|
||||
box-shadow: 0 0 0 1px color-mix(in srgb, var(--warning) 16%, transparent);
|
||||
}
|
||||
|
||||
.zone-thermostat.lockout-waiting,
|
||||
.zone-config-card.lockout-waiting {
|
||||
background-image: linear-gradient(color-mix(in srgb, var(--warning-soft) 42%, transparent), color-mix(in srgb, var(--warning-soft) 42%, transparent));
|
||||
}
|
||||
|
||||
.group-custom-temperature-row {
|
||||
grid-template-columns: minmax(0, 1fr) auto auto auto;
|
||||
@@ -5816,9 +5890,6 @@ textarea[aria-invalid="true"] {
|
||||
max-width: 70%;
|
||||
}
|
||||
|
||||
body.flow-editor-open {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.flow-editor {
|
||||
position: fixed;
|
||||
@@ -6028,8 +6099,6 @@ body.flow-editor-open {
|
||||
border: 1px solid var(--line);
|
||||
background: var(--surface-2);
|
||||
color: var(--text);
|
||||
border-radius: 10px;
|
||||
padding: 9px 10px;
|
||||
}
|
||||
|
||||
.flow-palette-group button:hover {
|
||||
@@ -6151,9 +6220,6 @@ body.flow-editor-open {
|
||||
.flow-editor .flow-port {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
margin-top: -7px;
|
||||
border-radius: 50%;
|
||||
border: 2px solid var(--surface);
|
||||
background: var(--muted-2);
|
||||
@@ -6161,13 +6227,6 @@ body.flow-editor-open {
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.flow-editor .flow-port-in {
|
||||
left: -8px;
|
||||
}
|
||||
|
||||
.flow-editor .flow-port-out {
|
||||
right: -8px;
|
||||
}
|
||||
|
||||
.flow-editor .flow-port:hover,
|
||||
.flow-editor .flow-port.armed {
|
||||
@@ -6364,16 +6423,13 @@ body.flow-editor-open {
|
||||
}
|
||||
|
||||
.flow-template-card {
|
||||
display: grid;
|
||||
gap: 7px;
|
||||
text-align: left;
|
||||
align-content: start;
|
||||
min-height: 118px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 14px;
|
||||
background: var(--surface-2);
|
||||
color: var(--text);
|
||||
padding: 14px;
|
||||
}
|
||||
|
||||
.flow-template-card:hover {
|
||||
@@ -6494,12 +6550,6 @@ body.flow-editor-open {
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:760px) {
|
||||
.flow-editor-actions {
|
||||
max-width: none;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.flow-device-options {
|
||||
margin: 10px 0;
|
||||
@@ -7754,7 +7804,6 @@ button {
|
||||
}
|
||||
|
||||
.automation-tabs {
|
||||
width: 100%;
|
||||
margin-bottom: 12px;
|
||||
scroll-snap-type: x proximity;
|
||||
}
|
||||
@@ -9064,7 +9113,6 @@ body.flow-editor-open {
|
||||
}
|
||||
|
||||
#controlPlan .plan-rules .plan-events li {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 3px;
|
||||
}
|
||||
}
|
||||
@@ -9643,3 +9691,204 @@ body.flow-editor-open {
|
||||
.history-network-controls { grid-template-columns: 1fr; }
|
||||
.history-jitter-toggle { width: 100%; }
|
||||
}
|
||||
|
||||
/* Unified custom selects -------------------------------------------------- */
|
||||
.select-native-proxy {
|
||||
position: absolute !important;
|
||||
width: 1px !important;
|
||||
min-width: 1px !important;
|
||||
height: 1px !important;
|
||||
min-height: 1px !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
border: 0 !important;
|
||||
opacity: 0 !important;
|
||||
pointer-events: none !important;
|
||||
clip: rect(0 0 0 0) !important;
|
||||
clip-path: inset(50%) !important;
|
||||
}
|
||||
|
||||
.custom-select {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.custom-select[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.custom-select-trigger {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
min-height: 45px;
|
||||
padding: 10px 12px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 12px;
|
||||
outline: 0;
|
||||
background: var(--input-bg);
|
||||
color: var(--text);
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
transition: border-color .15s ease, background-color .15s ease, outline-color .15s ease;
|
||||
}
|
||||
|
||||
.custom-select-trigger:hover:not(:disabled) {
|
||||
border-color: color-mix(in srgb, var(--accent) 32%, var(--line));
|
||||
background: color-mix(in srgb, var(--input-bg) 90%, var(--surface-muted));
|
||||
}
|
||||
|
||||
.custom-select-trigger:focus-visible,
|
||||
.custom-select.custom-select-open .custom-select-trigger {
|
||||
border-color: var(--accent);
|
||||
outline: 2px solid color-mix(in srgb, var(--accent) 18%, transparent);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
.custom-select-trigger:disabled {
|
||||
cursor: not-allowed;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.custom-select-value {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
color: var(--text);
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.custom-select-chevron {
|
||||
margin-top: -2px;
|
||||
color: var(--muted);
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
transition: transform .15s ease;
|
||||
}
|
||||
|
||||
.custom-select-open .custom-select-chevron,
|
||||
.custom-select-toolbar.custom-select-open .toolbar-picker-chevron {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.custom-select-menu {
|
||||
position: fixed;
|
||||
z-index: 10000;
|
||||
margin: 0;
|
||||
padding: 7px;
|
||||
overflow: auto;
|
||||
overscroll-behavior: contain;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 12px;
|
||||
outline: 0;
|
||||
background: var(--surface);
|
||||
color: var(--text);
|
||||
box-shadow: 0 14px 34px rgba(0, 0, 0, .22);
|
||||
}
|
||||
|
||||
.custom-select-menu[popover] {
|
||||
inset: auto;
|
||||
}
|
||||
|
||||
.custom-select-menu.custom-select-menu-fallback-open {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.custom-select-option {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 20px;
|
||||
align-items: center;
|
||||
gap: 9px;
|
||||
width: 100%;
|
||||
min-height: 38px;
|
||||
padding: 7px 8px;
|
||||
border: 0;
|
||||
border-radius: 8px;
|
||||
outline: 0;
|
||||
background: transparent;
|
||||
color: var(--text-soft);
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.custom-select-option:hover:not(:disabled),
|
||||
.custom-select-option:focus-visible {
|
||||
background: var(--surface-muted);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.custom-select-option[aria-selected="true"] {
|
||||
background: color-mix(in srgb, var(--accent) 11%, var(--surface));
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.custom-select-option b {
|
||||
color: var(--accent);
|
||||
font-size: 13px;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.custom-select-option:disabled {
|
||||
opacity: .45;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.custom-select-group {
|
||||
padding: 9px 8px 5px;
|
||||
color: var(--muted);
|
||||
font-size: 10px;
|
||||
font-weight: 800;
|
||||
letter-spacing: .05em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.custom-select-empty {
|
||||
padding: 9px 8px;
|
||||
color: var(--muted);
|
||||
font-size: 11px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.toolbar-picker.custom-select-toolbar {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.toolbar-picker.custom-select-toolbar.custom-select-open {
|
||||
border-color: var(--accent);
|
||||
outline: 2px solid color-mix(in srgb, var(--accent) 18%, transparent);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
|
||||
.toolbar-picker.custom-select-toolbar.custom-select-disabled {
|
||||
opacity: .5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.chart-toolbar .custom-select,
|
||||
.custom-chart-add .custom-select {
|
||||
flex: 1 1 140px;
|
||||
min-width: 140px;
|
||||
}
|
||||
|
||||
.flow-inspector .custom-select-trigger {
|
||||
border-radius: 10px;
|
||||
padding: 9px 10px;
|
||||
}
|
||||
|
||||
.has-error > .custom-select .custom-select-trigger,
|
||||
select.select-native-proxy[aria-invalid="true"] + .custom-select .custom-select-trigger {
|
||||
border-color: color-mix(in srgb, var(--danger) 68%, var(--line));
|
||||
outline: 2px solid color-mix(in srgb, var(--danger) 13%, transparent);
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.custom-select-menu {
|
||||
max-width: calc(100vw - 16px);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user