Replace hardcoded #6b7280/#1c2330/#8a8a8a greys with design tokens ($light-gray/$text-color)

This commit is contained in:
2026-04-20 03:02:10 +03:00
parent c4ba540e1c
commit 1156dd6f90
10 changed files with 41 additions and 37 deletions
@@ -261,7 +261,7 @@
background: transparent !important;
border: 1px solid #e0e0e0 !important;
border-left: none !important;
color: #6b7280 !important;
color: colors.$light-gray !important;
box-shadow: none !important;
}
.flights-map-filter .p-calendar.p-calendar-w-btn .p-datepicker-trigger.p-button:hover,
@@ -127,7 +127,7 @@
&__duration {
font-size: 12px;
color: #8a8a8a;
color: colors.$light-gray;
}
&__progress-labels {
@@ -135,7 +135,7 @@
justify-content: space-between;
width: 100%;
font-size: 12px;
color: #8a8a8a;
color: colors.$light-gray;
margin-top: 4px;
}
@@ -240,7 +240,7 @@
.flight-details {
&__estimated-note {
padding: 0 vars.$space-xl vars.$space-xl;
color: #8a8a8a;
color: colors.$light-gray;
font-size: 12px;
line-height: 1.5;
}
@@ -375,7 +375,7 @@
}
&__time-label {
color: #8a8a8a;
color: colors.$light-gray;
font-size: 12px;
}
@@ -385,12 +385,12 @@
}
&__time-offset {
color: #8a8a8a;
color: colors.$light-gray;
font-size: 11px;
}
&__time-date {
color: #8a8a8a;
color: colors.$light-gray;
font-size: 11px;
}
@@ -400,7 +400,7 @@
&__footer-notes {
padding: vars.$space-s vars.$space-xl vars.$space-xl;
color: #8a8a8a;
color: colors.$light-gray;
font-size: 12px;
line-height: 1.5;
@@ -12,7 +12,7 @@
grid-template-columns: 80px 120px 100px minmax(80px, 1fr) 100px 100px minmax(80px, 1fr) 16px;
gap: 16px;
padding: 14px 24px;
color: #6b7280;
color: colors.$light-gray;
font-size: 11px;
font-weight: 500;
text-transform: uppercase;
@@ -80,7 +80,7 @@
}
&__weekday {
color: #6b7280;
color: colors.$light-gray;
font-size: 13px;
text-transform: capitalize;
}
@@ -53,12 +53,12 @@
&__flight-number {
font-size: 22px;
font-weight: fonts.$font-medium;
color: #1c2330;
color: colors.$text-color;
margin: 0;
}
&__status {
color: #6b7280;
color: colors.$light-gray;
font-size: 14px;
}
@@ -23,7 +23,7 @@
.label--filter {
display: block;
font-size: 12px;
color: #6b7280;
color: colors.$light-gray;
margin-bottom: 4px;
}
@@ -60,7 +60,7 @@
padding: 4px 0;
cursor: pointer;
font-size: 13px;
color: #1c2330;
color: colors.$text-color;
input[type="checkbox"] {
width: 16px;
@@ -85,12 +85,12 @@
.time-selector__label {
font-size: 12px;
color: #6b7280;
color: colors.$light-gray;
}
.time-selector__value {
font-size: 12px;
color: #1c2330;
color: colors.$text-color;
font-weight: fonts.$font-medium;
}
@@ -15,7 +15,7 @@
gap: 0 vars.$space-l;
padding: vars.$space-l vars.$space-xl;
font-size: 14px;
color: #1c2330;
color: colors.$text-color;
}
&__leg-number {
@@ -32,7 +32,7 @@
}
&__leg-flight-number {
color: #1c2330;
color: colors.$text-color;
font-weight: fonts.$font-medium;
}
@@ -45,7 +45,7 @@
&__leg-aircraft {
font-size: 11px;
color: #6b7280;
color: colors.$light-gray;
}
&__leg-time {
@@ -70,7 +70,7 @@
padding-top: 6px;
margin-top: 6px;
text-align: center;
color: #6b7280;
color: colors.$light-gray;
font-size: 13px;
}
@@ -88,7 +88,7 @@
margin-top: -8px;
margin-bottom: -8px;
font-size: 12px;
color: #1c2330;
color: colors.$text-color;
&::after {
content: "";
@@ -157,7 +157,7 @@
display: inline-flex;
align-items: center;
gap: 6px;
color: #6b7280;
color: colors.$light-gray;
}
&__actions {
@@ -226,7 +226,7 @@
padding: vars.$space-l vars.$space-xl vars.$space-m;
border-bottom: 1px solid colors.$border;
background: #fff;
color: #1c2330;
color: colors.$text-color;
}
&__timeline-row {
@@ -254,7 +254,7 @@
align-items: center;
flex: 1 1 0;
min-width: 60px;
color: #6b7280;
color: colors.$light-gray;
font-size: 13px;
position: relative;
}
@@ -275,7 +275,7 @@
border: 1px solid colors.$border;
border-radius: 3px;
background: #fff;
color: #1c2330;
color: colors.$text-color;
font-size: 12px;
font-weight: fonts.$font-medium;
margin-bottom: 2px;
@@ -283,14 +283,14 @@
&__timeline-section-dur {
margin-top: 2px;
color: #6b7280;
color: colors.$light-gray;
font-size: 12px;
white-space: nowrap;
}
&__timeline-transit {
flex-shrink: 0;
color: #1c2330;
color: colors.$text-color;
font-weight: fonts.$font-medium;
font-size: 13px;
padding: 0 vars.$space-s;
@@ -316,12 +316,12 @@
}
&__timeline-station-city {
color: #1c2330;
color: colors.$text-color;
font-weight: fonts.$font-medium;
}
&__timeline-station-terminal {
color: #6b7280;
color: colors.$light-gray;
font-size: 12px;
}
}
@@ -49,7 +49,7 @@
background: transparent;
border: 0;
border-right: 1px solid colors.$border;
color: #6b7280;
color: colors.$light-gray;
font-size: 14px;
font-weight: 500;
cursor: pointer;
@@ -71,7 +71,7 @@
}
&__icon {
color: #6b7280;
color: colors.$light-gray;
transition: color 120ms ease;
fill: currentColor;
@@ -1,3 +1,5 @@
@use "../../../styles/colors" as colors;
.week-tabs {
display: flex;
align-items: stretch;
@@ -10,7 +12,7 @@
&__nav {
background: transparent;
border: none;
color: #6b7280;
color: colors.$light-gray;
font-size: 18px;
width: 28px;
cursor: pointer;
@@ -1,3 +1,5 @@
@use "../../styles/colors" as colors;
.city-autocomplete-popup {
position: absolute;
width: 630px;
@@ -94,7 +96,7 @@
margin-bottom: 8px;
.city--item {
color: #8a8a8a;
color: colors.$light-gray;
}
}
}
+4 -4
View File
@@ -91,7 +91,7 @@
&__icon {
flex-shrink: 0;
width: 24px;
color: #6b7280;
color: colors.$light-gray;
display: flex;
align-items: center;
justify-content: center;
@@ -108,18 +108,18 @@
&__title {
font-size: 12px;
color: #6b7280;
color: colors.$light-gray;
}
&__city {
font-size: 14px;
font-weight: fonts.$font-medium;
color: #1c2330;
color: colors.$text-color;
line-height: 1.2;
}
&__date {
font-size: 12px;
color: #6b7280;
color: colors.$light-gray;
}
}