Skip to content

Refactor font styles #5745

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sharhio merged 8 commits into from
Apr 16, 2026
Merged

Refactor font styles #5745

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
dfdab56
chore: update axios
vesameskanen Apr 13, 2026
f3a66e0
Revert "chore: update axios"
vesameskanen Apr 13, 2026
208c420
fix: more consistent font weights
vesameskanen Apr 13, 2026
72c4452
chore: remiove useless heading-font-family and button-font-family
vesameskanen Apr 13, 2026
894c78c
chore: remove some unused sass variables
vesameskanen Apr 13, 2026
479f65a
chore: remove unnecessary font definitions
vesameskanen Apr 13, 2026
52bf74c
Merge branch 'v3' into font-weights
vesameskanen Apr 16, 2026
43e783a
fix: route page stop list fonts
vesameskanen Apr 16, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions app/component/DisruptionBannerAlert.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ const DisruptionBannerAlert = (
<div className="disruption-source-label">
{mapAlertSource(config, language, alert.feed)}
</div>
<div className="disruption-message-font-weight">
<div className="disruption-message-font">
<TruncatedMessage
className="disruption-show-more"
lines={3}
Expand All @@ -60,7 +60,7 @@ const DisruptionBannerAlert = (
<div className="disruption-source-label">
{mapAlertSource(config, language, alert.feed)}
</div>
<div className="disruption-message-font-weight">
<div className="disruption-message-font">
<TruncatedMessage
className="disruption-show-more"
lines={3}
Expand Down
2 changes: 1 addition & 1 deletion app/component/alert-banner.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@

.alert-text {
font-size: 0.813rem;
font-weight: 400;
font-weight: $font-weight-book;
}

.arrow-icon {
Expand Down
1 change: 0 additions & 1 deletion app/component/checkbox.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,6 @@

&::before {
color: $theme-primary-color;
font-family: $font-family;
font-size: 1.25em;
font-weight: $font-weight-medium;
line-height: 1;
Expand Down
2 changes: 1 addition & 1 deletion app/component/date-select.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@
.left-column {
color: #333;
font-size: 0.92rem;
font-weight: 500;
font-weight: $font-weight-medium;
text-align: left;
overflow: visible;
text-overflow: ellipsis;
Expand Down
2 changes: 1 addition & 1 deletion app/component/disclaimer.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
.disclaimer-container {
background-color: $disclaimer-background-color;
font-weight: $font-weight-disclaimer;
font-weight: $font-weight-book;
border-radius: 0 $border-radius-disclaimer $border-radius-disclaimer 0;
display: flex;
font-size: $font-size-xsmall;
Expand Down
2 changes: 1 addition & 1 deletion app/component/disruption.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -172,7 +172,7 @@

.alert-body {
font-size: $font-size-small;
font-weight: $disruption-message-font-weight;
font-weight: $font-weight-book;
white-space: pre-wrap;

.alert-url {
Expand Down
2 changes: 0 additions & 2 deletions app/component/embedded/embedded-search-generator.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
.embedded-search-generator {
font-family: $font-family;
margin: auto;

fieldset {
Expand Down Expand Up @@ -104,7 +103,6 @@
h2,
h3,
label {
font-family: $heading-font-family;
letter-spacing: $letter-spacing;
color: $black;
}
Expand Down
3 changes: 1 addition & 2 deletions app/component/embedded/embedded-search.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,11 +31,10 @@

.search-button {
background-color: $theme-primary-color;
font-family: $button-font-family;
border: 2px solid $theme-primary-color;
color: white;
border-radius: 40px;
font-weight: 500;
font-weight: $font-weight-medium;
min-width: 128px;
height: 40px;
padding: 5px 10px;
Expand Down
1 change: 0 additions & 1 deletion app/component/itinerary/alt-travel-bar.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,7 +153,6 @@
text-align: left;
margin: 0;
padding: 0 1rem 0 0.9em;
font-family: $font-family;
font-size: $font-size-xxsmall;
display: inline-block;
background-color: $white;
Expand Down
2 changes: 1 addition & 1 deletion app/component/itinerary/customizesearch/customize-search.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -298,7 +298,7 @@
padding: 0 16px 0 16px;
background: white;
font-size: $font-size-normal;
font-weight: normal;
font-weight: $font-weight-book;
color: $gray;

.section-header {
Expand Down
2 changes: 1 addition & 1 deletion app/component/itinerary/customizesearch/search-settings-dropdown.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@

.kmh-value {
float: right;
font-weight: normal;
font-weight: $font-weight-book;
color: $gray;
}

Expand Down
2 changes: 1 addition & 1 deletion app/component/itinerary/itinerary-list-header.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
.itinerary-summary-subtitle-container {
background-color: $background-color-lighter;
font-size: 15px;
font-weight: normal;
font-weight: $font-weight-book;
font-stretch: normal;
font-style: normal;
line-height: normal;
Expand Down
9 changes: 3 additions & 6 deletions app/component/itinerary/itinerary-page.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,6 @@
@include font-book;

text-align: left;
font-family: $font-family !important;
display: flex !important;
border: 1px solid #ddd;

Expand Down Expand Up @@ -378,7 +377,6 @@
}

h1 {
font-family: $heading-font-family;
width: 100%;
text-align: center;
margin: 1.7em 0 25px 0;
Expand Down Expand Up @@ -439,9 +437,8 @@
border-radius: 5px;
margin: 15px 60px 15px 60px;
padding: 15px;
font-family: $font-family;
font-style: normal;
font-weight: normal;
font-weight: $font-weight-book;
line-height: 21px;
letter-spacing: -0.03em;
color: #000;
Expand All @@ -457,7 +454,7 @@
}

h3 {
font-weight: bold;
font-weight: $font-weight-bold;
font-size: $font-size-xsmall;
}

Expand All @@ -471,7 +468,7 @@
color: $theme-primary-color;

#change-settings-button {
font-weight: bold;
font-weight: $font-weight-bold;
}
}
}
Expand Down
5 changes: 2 additions & 3 deletions app/component/itinerary/itinerary-summary.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,9 +118,8 @@
.itinerary-co2-value {
min-width: auto;
height: 16px;
font-family: $font-family;
font-style: normal;
font-weight: $itinerary-co2-badge-font-weight;
font-weight: $font-weight-medium;
font-size: 13px;
line-height: 16px;
color: #3b7f00;
Expand All @@ -145,7 +144,7 @@
padding: 6px 10px 2px 4px;
background: $infobox-color-generic-blue;
border-radius: 5px;
font-weight: normal;
font-weight: $font-weight-book;
font-size: 13px;
color: #333;
line-height: 16px;
Expand Down
39 changes: 16 additions & 23 deletions app/component/itinerary/itinerary.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,7 @@ $itinerary-tab-switch-height: 48px;

.disclaimer-container {
background-color: $disclaimer-background-color;
font-weight: $font-weight-disclaimer;
font-weight: $font-weight-book;
border: 1px solid $disclaimer-border-color;
border-radius: $border-radius-disclaimer;
display: flex;
Expand Down Expand Up @@ -205,7 +205,7 @@ $itinerary-tab-switch-height: 48px;

.route-disclaimer-container {
background-color: $disclaimer-background-color;
font-weight: $font-weight-disclaimer;
font-weight: $font-weight-book;
border: 1px solid $disclaimer-border-color;
border-radius: $border-radius-disclaimer;
display: flex;
Expand Down Expand Up @@ -384,9 +384,8 @@ $itinerary-tab-switch-height: 48px;
width: auto;
}

font-family: $font-family;
font-style: normal;
font-weight: $itinerary-co2-font-weight;
font-weight: $font-weight-book;
font-size: 15px;
line-height: 20px;
letter-spacing: -0.03em;
Expand Down Expand Up @@ -438,9 +437,8 @@ $itinerary-tab-switch-height: 48px;
height: 18px;
left: 48px;
top: 528px;
font-family: $font-family;
font-style: normal;
font-weight: $itinerary-co2-font-weight;
font-weight: $font-weight-book;
font-size: 15px;
line-height: 18px;

Expand Down Expand Up @@ -470,9 +468,8 @@ $itinerary-tab-switch-height: 48px;
.itinerary-co2-value {
min-width: 29px;
height: 16px;
font-family: $font-family;
font-style: normal;
font-weight: $itinerary-co2-badge-font-weight;
font-weight: $font-weight-medium;
font-size: 13px;
line-height: 16px;
color: #3b7f00;
Expand Down Expand Up @@ -587,7 +584,7 @@ $itinerary-tab-switch-height: 48px;
display: block;
font-size: 15px;
line-height: 18px;
font-weight: normal;
font-weight: $font-weight-book;
letter-spacing: -0.025em;
color: #666;

Expand Down Expand Up @@ -723,7 +720,7 @@ $itinerary-tab-switch-height: 48px;
margin: 17px 15px 15px 15px;
white-space: normal;
color: #666;
font-weight: normal;
font-weight: $font-weight-book;
font-size: 13px;
line-height: 16px;
display: flex;
Expand Down Expand Up @@ -1783,7 +1780,7 @@ $itinerary-tab-switch-height: 48px;
color: #333;

.bold {
font-weight: 700;
font-weight: $font-weight-bold;
}

.no-wrap {
Expand Down Expand Up @@ -1981,13 +1978,11 @@ $itinerary-tab-switch-height: 48px;

.place {
font-size: 0.813rem;
font-weight: normal;
font-weight: $font-weight-book;
}

.platform-short {
@include font-medium;

font-weight: normal;
font-weight: $font-weight-book;
font-size: 0.813rem;
align-items: center;
display: inline-flex;
Expand All @@ -2000,7 +1995,6 @@ $itinerary-tab-switch-height: 48px;
margin: 0 3px 0 3px;
background-color: $background-color-lighter;
font-weight: $font-weight-medium;
font-family: $id-font-family;

&.platform-updated {
@include platformUpdated;
Expand Down Expand Up @@ -2270,11 +2264,11 @@ $itinerary-tab-switch-height: 48px;

.leg-departure-time {
margin: 7px;
font-weight: 500;
font-weight: $font-weight-medium;
}

.distance-bold {
font-weight: 500;
font-weight: $font-weight-medium;
}

&.alternative-leg-suggestion {
Expand Down Expand Up @@ -2303,7 +2297,7 @@ $itinerary-tab-switch-height: 48px;
overflow: hidden;
color: #333;
font-size: 0.813rem;
font-weight: normal;
font-weight: $font-weight-book;
display: flex;
align-items: center;
}
Expand Down Expand Up @@ -2361,7 +2355,7 @@ $itinerary-tab-switch-height: 48px;

.info-header {
font-size: $font-size-xsmall;
font-weight: bold;
font-weight: $font-weight-bold;
margin: 0 4px 0 8px;
}
}
Expand Down Expand Up @@ -3003,7 +2997,7 @@ div.itinerary-container-content {

@include font-medium;

font-weight: 600;
font-weight: $font-weight-medium;

a {
text-decoration: none;
Expand Down Expand Up @@ -3245,7 +3239,6 @@ $font-print-decrease: 0.7;
}

.itinerary-leg-stopname {
font-family: $font-family;
font-weight: $font-weight-medium;
font-size: $font-size-large;
color: $black;
Expand Down Expand Up @@ -3465,7 +3458,7 @@ $font-print-decrease: 0.7;
height: max-content;
border-radius: 5px;
padding: 18px 32px 18px 16px;
font-weight: normal;
font-weight: $font-weight-book;
font-size: 14px;

&.caution {
Expand Down
5 changes: 2 additions & 3 deletions app/component/itinerary/navigator/navigator.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
margin: 4px 0 0 0;
padding: var(--space-s) var(--space-m) var(--space-s) var(--space-s);
gap: var(--space-s);
font-weight: normal;
font-weight: $font-weight-book;
border-radius: $border-radius-bigger;
letter-spacing: $letter-spacing;

Expand Down Expand Up @@ -467,7 +467,6 @@

.platform-short {
width: unset;
font-family: $font-family;
font-size: $font-size-small;
letter-spacing: $letter-spacing;
display: inline-flex;
Expand Down Expand Up @@ -663,7 +662,7 @@
display: flex;
flex-direction: column;
gap: var(--space-xxs);
font-weight: 325;
font-weight: $font-weight-book;
font-size: 14px;
line-height: 21px;

Expand Down
2 changes: 0 additions & 2 deletions app/component/itinerary/settings-panel.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@
.map-layer-header {
font-size: 18px;
font-weight: $font-weight-bold;
font-family: $heading-font-family;
line-height: 88px;
}

Expand All @@ -23,7 +22,6 @@
height: 50px;
min-height: 50px;
font-size: 18px;
font-family: $button-font-family;
font-weight: $font-weight-medium;
letter-spacing: -0.5px;
background: $theme-primary-color;
Expand Down
2 changes: 1 addition & 1 deletion app/component/itinerary/street-mode-selector-button.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,7 @@

.street-mode-button-length {
font-size: 13px;
font-weight: normal;
font-weight: $font-weight-book;
}
}
}
Expand Down
Loading
Loading