diff --git a/pro/.storybook/preview-head.html b/pro/.storybook/preview-head.html index 2f6a0b44820..28b9275ab57 100644 --- a/pro/.storybook/preview-head.html +++ b/pro/.storybook/preview-head.html @@ -22,15 +22,4 @@ local('Montserrat-Italic'), url('/pass-culture-main/fonts/Montserrat-Italic.woff2') format('woff2'); } - - @font-face { - font-family: Montserrat-ExtraBold; - font-weight: 800; - font-style: normal; - font-display: 'swap'; - src: - local('Montserrat ExtraBold'), - local('Montserrat-ExtraBold'), - url('/pass-culture-main/fonts/Montserrat-ExtraBold.woff2') format('woff2'); - } diff --git a/pro/src/components/CollectiveOfferLayout/CollectiveOfferLayout.module.scss b/pro/src/components/CollectiveOfferLayout/CollectiveOfferLayout.module.scss index 4ea5f541d7a..d7f4e862342 100644 --- a/pro/src/components/CollectiveOfferLayout/CollectiveOfferLayout.module.scss +++ b/pro/src/components/CollectiveOfferLayout/CollectiveOfferLayout.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .eac-layout { position: relative; @@ -13,7 +14,7 @@ } &-heading { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(8px); } diff --git a/pro/src/components/Dialog/Dialog/Dialog.module.scss b/pro/src/components/Dialog/Dialog/Dialog.module.scss index c7844454383..9291dfb955a 100644 --- a/pro/src/components/Dialog/Dialog/Dialog.module.scss +++ b/pro/src/components/Dialog/Dialog/Dialog.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .dialog { @@ -12,7 +12,7 @@ &-title { max-width: rem.torem(532px); - @include fonts.title3; + @include fonts-design-system.title3; margin-top: rem.torem(32px); diff --git a/pro/src/components/FormLayout/FormLayout.module.scss b/pro/src/components/FormLayout/FormLayout.module.scss index 75e5ea123aa..ac9f79e8916 100644 --- a/pro/src/components/FormLayout/FormLayout.module.scss +++ b/pro/src/components/FormLayout/FormLayout.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; $info-box-width: clamp(rem.torem(240px), 29vw, rem.torem(316px)); @@ -36,7 +37,7 @@ $info-box-margin-left: rem.torem(24px); margin-bottom: rem.torem(24px); &-title { - @include fonts.title3; + @include fonts-design-system.title2; } &-header { @@ -62,7 +63,7 @@ $info-box-margin-left: rem.torem(24px); &-title { margin-bottom: rem.torem(24px); - @include fonts.title4; + @include fonts-design-system.title4; } } diff --git a/pro/src/components/Header/HeaderDropdown/HeaderDropdown.module.scss b/pro/src/components/Header/HeaderDropdown/HeaderDropdown.module.scss index 0d4515bbbb5..a8df5a0e068 100644 --- a/pro/src/components/Header/HeaderDropdown/HeaderDropdown.module.scss +++ b/pro/src/components/Header/HeaderDropdown/HeaderDropdown.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_layout.scss" as layout; @use "styles/variables/_size.scss" as size; @use "styles/variables/_z-index.scss" as zIndex; @@ -278,7 +279,7 @@ $sub-popin-full-width-breakpoint: rem.torem(673px); margin-top: rem.torem(8px); margin-bottom: rem.torem(16px); - @include fonts.title4; + @include fonts-design-system.title4; } @media (min-width: $sub-popin-full-width-breakpoint) { diff --git a/pro/src/components/ImageUploader/ButtonAppPreview/ModalAppPreview.module.scss b/pro/src/components/ImageUploader/ButtonAppPreview/ModalAppPreview.module.scss index b4a6871219e..920a4b347c6 100644 --- a/pro/src/components/ImageUploader/ButtonAppPreview/ModalAppPreview.module.scss +++ b/pro/src/components/ImageUploader/ButtonAppPreview/ModalAppPreview.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .container { @@ -8,7 +8,7 @@ } .header { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(16px); } diff --git a/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageCrop.module.scss b/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageCrop.module.scss index cc841530bfa..aaac5ec56c4 100644 --- a/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageCrop.module.scss +++ b/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageCrop.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; @@ -35,7 +35,7 @@ } &-header { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(16px); } diff --git a/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadBrowser.module.scss b/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadBrowser.module.scss index 0d40aaade84..cfc98e92d5b 100644 --- a/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadBrowser.module.scss +++ b/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadBrowser.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; @@ -14,7 +14,7 @@ } .header { - @include fonts.title3; + @include fonts-design-system.title3; } .horizontal-rule { diff --git a/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadConfirm.module.scss b/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadConfirm.module.scss index bddab50e9a9..ed837997bda 100644 --- a/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadConfirm.module.scss +++ b/pro/src/components/ImageUploader/ButtonImageEdit/ModalImageEdit/ModalImageUploadConfirm.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; @@ -9,7 +9,7 @@ } .header { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(16px); } diff --git a/pro/src/components/NewNavReview/NewNavReviewDialog/NewNavReviewDialog.module.scss b/pro/src/components/NewNavReview/NewNavReviewDialog/NewNavReviewDialog.module.scss index 37a3b528b57..ddb2dc754fa 100644 --- a/pro/src/components/NewNavReview/NewNavReviewDialog/NewNavReviewDialog.module.scss +++ b/pro/src/components/NewNavReview/NewNavReviewDialog/NewNavReviewDialog.module.scss @@ -1,12 +1,12 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .dialog { max-width: rem.torem(300px); &-title { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(24px); } @@ -64,7 +64,7 @@ margin-top: rem.torem(48px); &-title { - @include fonts.title3; + @include fonts-design-system.title3; } &-icon { diff --git a/pro/src/components/NoData/NoData.module.scss b/pro/src/components/NoData/NoData.module.scss index 671933ca0f8..75be88ca3e0 100644 --- a/pro/src/components/NoData/NoData.module.scss +++ b/pro/src/components/NoData/NoData.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .no-data { - @include fonts.title4; + @include fonts-design-system.title4; align-items: center; display: flex; diff --git a/pro/src/components/ReimbursementBankAccount/ReimbursementBankAccount.module.scss b/pro/src/components/ReimbursementBankAccount/ReimbursementBankAccount.module.scss index 516d4187c2e..8d86953ece5 100644 --- a/pro/src/components/ReimbursementBankAccount/ReimbursementBankAccount.module.scss +++ b/pro/src/components/ReimbursementBankAccount/ReimbursementBankAccount.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .bank-account { @@ -33,7 +34,7 @@ } &-title { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(16px); } diff --git a/pro/src/components/StocksEventList/NoResultsRow.module.scss b/pro/src/components/StocksEventList/NoResultsRow.module.scss index 97ebd87cd92..b8a92b5248d 100644 --- a/pro/src/components/StocksEventList/NoResultsRow.module.scss +++ b/pro/src/components/StocksEventList/NoResultsRow.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .no-data { vertical-align: middle; @@ -13,7 +13,7 @@ } &-message { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(16px); } diff --git a/pro/src/components/SummaryLayout/SummaryLayout.module.scss b/pro/src/components/SummaryLayout/SummaryLayout.module.scss index 54e1e33492c..72bb954b1ab 100644 --- a/pro/src/components/SummaryLayout/SummaryLayout.module.scss +++ b/pro/src/components/SummaryLayout/SummaryLayout.module.scss @@ -1,6 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .summary-layout { display: flex; @@ -48,7 +48,7 @@ margin-bottom: rem.torem(24px); &-title { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(24px); } @@ -87,7 +87,7 @@ } .section-title { - @include fonts.title3; + @include fonts-design-system.title2; padding-right: rem.torem(16px); diff --git a/pro/src/pages/Accessibility/AccessibilityMenu.module.scss b/pro/src/pages/Accessibility/AccessibilityMenu.module.scss index e51a7d5ba0c..3db0a3778b8 100644 --- a/pro/src/pages/Accessibility/AccessibilityMenu.module.scss +++ b/pro/src/pages/Accessibility/AccessibilityMenu.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .menu-accessibility { display: flex; @@ -14,7 +14,7 @@ } .title-accessibility { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/pages/Accessibility/Commitment.module.scss b/pro/src/pages/Accessibility/Commitment.module.scss index f5e21b5f633..31ad1fc209d 100644 --- a/pro/src/pages/Accessibility/Commitment.module.scss +++ b/pro/src/pages/Accessibility/Commitment.module.scss @@ -1,14 +1,14 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .heading1-commitment { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } .heading2-commitment { - @include fonts.title2; + @include fonts-design-system.title2; } .heading2-commitment, diff --git a/pro/src/pages/Accessibility/Declaration.module.scss b/pro/src/pages/Accessibility/Declaration.module.scss index b2277bf3400..3775d931d79 100644 --- a/pro/src/pages/Accessibility/Declaration.module.scss +++ b/pro/src/pages/Accessibility/Declaration.module.scss @@ -1,14 +1,14 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .heading1-declaration { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } .heading2 { - @include fonts.title2; + @include fonts-design-system.title2; } .heading2, diff --git a/pro/src/pages/Accessibility/MultiyearScheme.module.scss b/pro/src/pages/Accessibility/MultiyearScheme.module.scss index 671637f912f..243d472d595 100644 --- a/pro/src/pages/Accessibility/MultiyearScheme.module.scss +++ b/pro/src/pages/Accessibility/MultiyearScheme.module.scss @@ -1,14 +1,14 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .heading1-scheme { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } .heading2 { - @include fonts.title2; + @include fonts-design-system.title2; } .heading2, diff --git a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscovery.module.scss b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscovery.module.scss index 6298c499be1..83f09050665 100644 --- a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscovery.module.scss +++ b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscovery.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .discovery { @@ -14,5 +14,5 @@ } .playlist-carousel-title { - @include fonts.title3; + @include fonts-design-system.title2; } diff --git a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscoveryBanner/AdageDiscoveryBanner.module.scss b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscoveryBanner/AdageDiscoveryBanner.module.scss index 6a116b166e6..4282a44e43f 100644 --- a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscoveryBanner/AdageDiscoveryBanner.module.scss +++ b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/AdageDiscoveryBanner/AdageDiscoveryBanner.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .discovery-banner { @@ -10,7 +10,7 @@ position: relative; &-title { - @include fonts.title1; + @include fonts-design-system.title1; margin: 0; color: var(--color-white); diff --git a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/ClassroomPlaylist/ClassroomPlaylist.module.scss b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/ClassroomPlaylist/ClassroomPlaylist.module.scss index 9e155baef5a..2d0d7be6cd3 100644 --- a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/ClassroomPlaylist/ClassroomPlaylist.module.scss +++ b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/ClassroomPlaylist/ClassroomPlaylist.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .playlist-carousel-title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: unset; } diff --git a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOfferPlaylist/NewOfferPlaylist.module.scss b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOfferPlaylist/NewOfferPlaylist.module.scss index 9e155baef5a..2d0d7be6cd3 100644 --- a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOfferPlaylist/NewOfferPlaylist.module.scss +++ b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOfferPlaylist/NewOfferPlaylist.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .playlist-carousel-title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: unset; } diff --git a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOffererPlaylist/NewOffererPlaylist.module.scss b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOffererPlaylist/NewOffererPlaylist.module.scss index 9e155baef5a..2d0d7be6cd3 100644 --- a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOffererPlaylist/NewOffererPlaylist.module.scss +++ b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/NewOffererPlaylist/NewOffererPlaylist.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .playlist-carousel-title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: unset; } diff --git a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/VenuePlaylist/VenuePlaylist.module.scss b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/VenuePlaylist/VenuePlaylist.module.scss index ff305a6348d..81ffdf566fa 100644 --- a/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/VenuePlaylist/VenuePlaylist.module.scss +++ b/pro/src/pages/AdageIframe/app/components/AdageDiscovery/Playlist/VenuePlaylist/VenuePlaylist.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .playlist-carousel-title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: unset; } diff --git a/pro/src/pages/AdageIframe/app/components/AdageHeader/AdageHeaderBudget/AdageHeaderBudget.module.scss b/pro/src/pages/AdageIframe/app/components/AdageHeader/AdageHeaderBudget/AdageHeaderBudget.module.scss index e88cfea72ea..2c4bc6f1840 100644 --- a/pro/src/pages/AdageIframe/app/components/AdageHeader/AdageHeaderBudget/AdageHeaderBudget.module.scss +++ b/pro/src/pages/AdageIframe/app/components/AdageHeader/AdageHeaderBudget/AdageHeaderBudget.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .adage-header-budget { @@ -20,7 +21,7 @@ } &-value { - @include fonts.title4; + @include fonts-design-system.title4; white-space: nowrap; color: var(--color-brand); diff --git a/pro/src/pages/AdageIframe/app/components/DiffuseHelp/DiffuseHelp.module.scss b/pro/src/pages/AdageIframe/app/components/DiffuseHelp/DiffuseHelp.module.scss index 8fe3c2de2fb..a1158e22081 100644 --- a/pro/src/pages/AdageIframe/app/components/DiffuseHelp/DiffuseHelp.module.scss +++ b/pro/src/pages/AdageIframe/app/components/DiffuseHelp/DiffuseHelp.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .diffuse-help { margin-top: rem.torem(16px); @@ -14,7 +15,7 @@ } &-container { - @include fonts.title1; + @include fonts-design-system.title1; display: flex; flex-direction: row; diff --git a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOffer.module.scss b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOffer.module.scss index bc4d0377609..621258bbbb5 100644 --- a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOffer.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOffer.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .offer { @@ -56,7 +57,7 @@ margin-bottom: rem.torem(16px); &-title { - @include fonts.title3; + @include fonts-design-system.title2; } } diff --git a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferHeader/AdageOfferHeader.module.scss b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferHeader/AdageOfferHeader.module.scss index b153b27eee4..1e18b5318aa 100644 --- a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferHeader/AdageOfferHeader.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferHeader/AdageOfferHeader.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .offer-header-image-container { @@ -39,7 +40,7 @@ } .offer-header-title { - @include fonts.title4; + @include fonts-design-system.title4; } .offer-header-details-structure { @@ -89,7 +90,7 @@ @container (min-width: #{size.$mobile}) { .offer-header-title { - @include fonts.title3; + @include fonts-design-system.title3; } .offer-header-title-container { @@ -108,6 +109,6 @@ @container (min-width: #{size.$tablet}) { .offer-header-title { - @include fonts.title1; + @include fonts-design-system.title1; } } diff --git a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferInstitutionPanel/AdageOfferInstitutionPanel.module.scss b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferInstitutionPanel/AdageOfferInstitutionPanel.module.scss index 36e834d2fc4..310e2b7ac63 100644 --- a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferInstitutionPanel/AdageOfferInstitutionPanel.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferInstitutionPanel/AdageOfferInstitutionPanel.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .institution-panel { width: 100%; @@ -13,7 +14,7 @@ gap: rem.torem(8px); &-title { - @include fonts.title3; + @include fonts-design-system.title2; } } diff --git a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferPartnerPanel/AdageOfferPartnerPanel.module.scss b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferPartnerPanel/AdageOfferPartnerPanel.module.scss index 25b51cd722d..5b75837f6ae 100644 --- a/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferPartnerPanel/AdageOfferPartnerPanel.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OfferInfos/AdageOffer/AdageOfferPartnerPanel/AdageOfferPartnerPanel.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .partner-panel { @@ -14,7 +15,7 @@ gap: rem.torem(8px); &-title { - @include fonts.title3; + @include fonts-design-system.title2; } } diff --git a/pro/src/pages/AdageIframe/app/components/OfferInfos/OfferInfos.module.scss b/pro/src/pages/AdageIframe/app/components/OfferInfos/OfferInfos.module.scss index 780ce4327d0..256c109a143 100644 --- a/pro/src/pages/AdageIframe/app/components/OfferInfos/OfferInfos.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OfferInfos/OfferInfos.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .offers-info { @@ -13,7 +13,7 @@ padding: 0 rem.torem(20px) rem.torem(20px); &-title { - @include fonts.title2; + @include fonts-design-system.title2; margin: rem.torem(24px) 0 rem.torem(32px) 0; } diff --git a/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavorites.module.scss b/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavorites.module.scss index 61d0f71582b..eaf562f226f 100644 --- a/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavorites.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavorites.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .favorite-list { diff --git a/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavoritesNoResult/OffersFavoritesNoResult.module.scss b/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavoritesNoResult/OffersFavoritesNoResult.module.scss index 26966694a75..970af0e4207 100644 --- a/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavoritesNoResult/OffersFavoritesNoResult.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OffersFavorites/OffersFavoritesNoResult/OffersFavoritesNoResult.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .no-results { margin-top: rem.torem(16px); @@ -10,7 +10,7 @@ } .no-results-title { - @include fonts.title2; + @include fonts-design-system.title2; margin: rem.torem(40px) 0 rem.torem(8px) 0; } diff --git a/pro/src/pages/AdageIframe/app/components/OffersForInstitution/OffersForMyInstitution.module.scss b/pro/src/pages/AdageIframe/app/components/OffersForInstitution/OffersForMyInstitution.module.scss index e887e35713e..ce3b2c099f0 100644 --- a/pro/src/pages/AdageIframe/app/components/OffersForInstitution/OffersForMyInstitution.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OffersForInstitution/OffersForMyInstitution.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .no-results { @@ -14,7 +14,7 @@ } .no-results-title { - @include fonts.title2; + @include fonts-design-system.title2; margin: rem.torem(40px) 0 rem.torem(32px) 0; } diff --git a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/AdageOfferListCard/AdageOfferListCard.module.scss b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/AdageOfferListCard/AdageOfferListCard.module.scss index 318bca57943..3d143bce0ed 100644 --- a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/AdageOfferListCard/AdageOfferListCard.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/AdageOfferListCard/AdageOfferListCard.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .offer-card-link { @@ -117,7 +118,7 @@ } .offer-title { - @include fonts.title3; + @include fonts-design-system.title2; } .offer-headband { diff --git a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/ContactButton/RequestFormDialog/RequestFormDialog.module.scss b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/ContactButton/RequestFormDialog/RequestFormDialog.module.scss index 263096dc92a..d8c68df4f4f 100644 --- a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/ContactButton/RequestFormDialog/RequestFormDialog.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/ContactButton/RequestFormDialog/RequestFormDialog.module.scss @@ -1,4 +1,5 @@ @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .dialog-container { @@ -31,7 +32,7 @@ } &-title { - @include fonts.title3; + @include fonts-design-system.title3; } &-description { diff --git a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/NoResultsPage/NoResultsPage.module.scss b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/NoResultsPage/NoResultsPage.module.scss index 48b5d0c55d4..0a892f900c7 100644 --- a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/NoResultsPage/NoResultsPage.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/Offers/NoResultsPage/NoResultsPage.module.scss @@ -1,11 +1,11 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .no-results { margin: rem.torem(40px) 0; &-text { - @include fonts.title2; + @include fonts-design-system.title2; &-query-container { white-space: nowrap; diff --git a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/OffersSuggestions/OffersSuggestionsHeader/OffersSuggestionsHeader.module.scss b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/OffersSuggestions/OffersSuggestionsHeader/OffersSuggestionsHeader.module.scss index d9c7fba8e78..b0f5261126f 100644 --- a/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/OffersSuggestions/OffersSuggestionsHeader/OffersSuggestionsHeader.module.scss +++ b/pro/src/pages/AdageIframe/app/components/OffersInstantSearch/OffersSearch/OffersSuggestions/OffersSuggestionsHeader/OffersSuggestionsHeader.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .offers-suggestions-header { @@ -6,7 +6,7 @@ border-top: rem.torem(1px) solid var(--color-grey-medium); &-text { - @include fonts.title3; + @include fonts-design-system.title3; } &-link { diff --git a/pro/src/pages/AdageIframe/app/components/SurveySatisfaction/SurveySatisfaction.module.scss b/pro/src/pages/AdageIframe/app/components/SurveySatisfaction/SurveySatisfaction.module.scss index fcda9a52639..7c9c896ac3b 100644 --- a/pro/src/pages/AdageIframe/app/components/SurveySatisfaction/SurveySatisfaction.module.scss +++ b/pro/src/pages/AdageIframe/app/components/SurveySatisfaction/SurveySatisfaction.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .survey-satisfaction { margin-top: rem.torem(16px); @@ -24,7 +25,7 @@ } .survey-title { - @include fonts.title3; + @include fonts-design-system.title3; color: var(--color-secondary-light); } diff --git a/pro/src/pages/AdageIframe/app/components/UnauthenticatedError/UnauthenticatedError.module.scss b/pro/src/pages/AdageIframe/app/components/UnauthenticatedError/UnauthenticatedError.module.scss index b72d82e5e35..a29c756f4c0 100644 --- a/pro/src/pages/AdageIframe/app/components/UnauthenticatedError/UnauthenticatedError.module.scss +++ b/pro/src/pages/AdageIframe/app/components/UnauthenticatedError/UnauthenticatedError.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .error { min-height: 100vh; @@ -18,7 +18,7 @@ padding: rem.torem(32px); &-title { - @include fonts.title1; + @include fonts-design-system.title1; font-size: rem.torem(40px); margin-bottom: rem.torem(16px); diff --git a/pro/src/pages/Bookings/NoBookingsForPreFiltersMessage/NoBookingsForPreFiltersMessage.module.scss b/pro/src/pages/Bookings/NoBookingsForPreFiltersMessage/NoBookingsForPreFiltersMessage.module.scss index 72504bf3033..c8fac62c281 100644 --- a/pro/src/pages/Bookings/NoBookingsForPreFiltersMessage/NoBookingsForPreFiltersMessage.module.scss +++ b/pro/src/pages/Bookings/NoBookingsForPreFiltersMessage/NoBookingsForPreFiltersMessage.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .search-no-results { text-align: center; @@ -10,7 +10,7 @@ } &-title4 { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(16px); } diff --git a/pro/src/pages/Collaborators/Collaborators.module.scss b/pro/src/pages/Collaborators/Collaborators.module.scss index 386e9d92712..cf6d33a49ce 100644 --- a/pro/src/pages/Collaborators/Collaborators.module.scss +++ b/pro/src/pages/Collaborators/Collaborators.module.scss @@ -1,4 +1,5 @@ @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .section { @@ -7,7 +8,7 @@ padding-top: 0; .main-list-title { - @include fonts.title3; + @include fonts-design-system.title2; border-bottom: rem.torem(2px) solid var(--color-black); margin-bottom: rem.torem(24px); @@ -15,7 +16,7 @@ } .main-list-title-new { - @include fonts.title2; + @include fonts-design-system.title2; margin-top: rem.torem(26px); margin-bottom: rem.torem(24px); @@ -120,5 +121,5 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; } diff --git a/pro/src/pages/CollectiveOfferFromRequest/CollectiveOfferFromRequest.module.scss b/pro/src/pages/CollectiveOfferFromRequest/CollectiveOfferFromRequest.module.scss index 40a0f7e964a..5d3dc19d326 100644 --- a/pro/src/pages/CollectiveOfferFromRequest/CollectiveOfferFromRequest.module.scss +++ b/pro/src/pages/CollectiveOfferFromRequest/CollectiveOfferFromRequest.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .eac { diff --git a/pro/src/pages/CollectiveOfferPreviewEdition/CollectiveOfferPreviewEdition.module.scss b/pro/src/pages/CollectiveOfferPreviewEdition/CollectiveOfferPreviewEdition.module.scss index 5078d5ba253..2f3d5eff9ff 100644 --- a/pro/src/pages/CollectiveOfferPreviewEdition/CollectiveOfferPreviewEdition.module.scss +++ b/pro/src/pages/CollectiveOfferPreviewEdition/CollectiveOfferPreviewEdition.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .preview-info { diff --git a/pro/src/pages/Desk/Desk.module.scss b/pro/src/pages/Desk/Desk.module.scss index 39524390104..36ae9e15e40 100644 --- a/pro/src/pages/Desk/Desk.module.scss +++ b/pro/src/pages/Desk/Desk.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } @@ -37,7 +37,7 @@ } .advice { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(32px); diff --git a/pro/src/pages/Errors/NotFound/NotFound.module.scss b/pro/src/pages/Errors/NotFound/NotFound.module.scss index 46e737c2dff..8b37f02e3e5 100644 --- a/pro/src/pages/Errors/NotFound/NotFound.module.scss +++ b/pro/src/pages/Errors/NotFound/NotFound.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .no-match { align-items: center; @@ -14,14 +14,14 @@ height: 100vh; .title { - @include fonts.title1; + @include fonts-design-system.title1; color: var(--color-white); margin: rem.torem(32px) 0 rem.torem(16px); } p { - @include fonts.title4; + @include fonts-design-system.title4; } .nm-redirection-link { diff --git a/pro/src/pages/Errors/Unavailable/Unavailable.module.scss b/pro/src/pages/Errors/Unavailable/Unavailable.module.scss index 23523cbbb9f..9cb2e775edc 100644 --- a/pro/src/pages/Errors/Unavailable/Unavailable.module.scss +++ b/pro/src/pages/Errors/Unavailable/Unavailable.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .unavailable-page { align-items: center; @@ -14,7 +14,7 @@ height: 100vh; .title { - @include fonts.title1; + @include fonts-design-system.title1; color: var(--color-white); line-height: normal; @@ -22,7 +22,7 @@ } p { - @include fonts.title4; + @include fonts-design-system.title4; } .error-icon { diff --git a/pro/src/pages/Home/Homepage.module.scss b/pro/src/pages/Home/Homepage.module.scss index ff442fe4940..400c0a5e6f2 100644 --- a/pro/src/pages/Home/Homepage.module.scss +++ b/pro/src/pages/Home/Homepage.module.scss @@ -1,9 +1,9 @@ @use "styles/variables/_size.scss" as size; @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .section { @@ -72,7 +72,7 @@ } &-title { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(8px); } diff --git a/pro/src/pages/Home/Offerers/OffererCreationLinks.module.scss b/pro/src/pages/Home/Offerers/OffererCreationLinks.module.scss index 8f9d1e702be..e5b0e60756d 100644 --- a/pro/src/pages/Home/Offerers/OffererCreationLinks.module.scss +++ b/pro/src/pages/Home/Offerers/OffererCreationLinks.module.scss @@ -1,12 +1,12 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .card { margin-top: rem.torem(24px); } .title { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(8px); } diff --git a/pro/src/pages/Home/Offerers/Offerers.module.scss b/pro/src/pages/Home/Offerers/Offerers.module.scss index 60fcd8f7772..74b44f4c6d8 100644 --- a/pro/src/pages/Home/Offerers/Offerers.module.scss +++ b/pro/src/pages/Home/Offerers/Offerers.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: rem.torem(16px); } diff --git a/pro/src/pages/Home/Offerers/PartnerPage.module.scss b/pro/src/pages/Home/Offerers/PartnerPage.module.scss index bb1e454f505..3f2610ae97e 100644 --- a/pro/src/pages/Home/Offerers/PartnerPage.module.scss +++ b/pro/src/pages/Home/Offerers/PartnerPage.module.scss @@ -1,4 +1,5 @@ @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; @@ -27,7 +28,7 @@ } .venue-name { - @include fonts.title4; + @include fonts-design-system.title3; margin-top: rem.torem(8px); margin-bottom: rem.torem(8px); @@ -57,7 +58,7 @@ } .details-title { - @include fonts.title4; + @include fonts-design-system.title4; display: inline-block; margin-right: rem.torem(8px); diff --git a/pro/src/pages/Home/Offerers/PartnerPages.module.scss b/pro/src/pages/Home/Offerers/PartnerPages.module.scss index c05a2934356..b94ab2f9c82 100644 --- a/pro/src/pages/Home/Offerers/PartnerPages.module.scss +++ b/pro/src/pages/Home/Offerers/PartnerPages.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .section { @@ -6,7 +6,7 @@ } .title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: rem.torem(8px); } diff --git a/pro/src/pages/Home/Offerers/VenueCreationLinks.module.scss b/pro/src/pages/Home/Offerers/VenueCreationLinks.module.scss index 308a38497fa..aa2b2188024 100644 --- a/pro/src/pages/Home/Offerers/VenueCreationLinks.module.scss +++ b/pro/src/pages/Home/Offerers/VenueCreationLinks.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .container { margin-top: rem.torem(24px); @@ -10,7 +10,7 @@ } .title { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(8px); } diff --git a/pro/src/pages/Home/ProfileAndSupport/Profile.module.scss b/pro/src/pages/Home/ProfileAndSupport/Profile.module.scss index bc5a12815db..844028a56d3 100644 --- a/pro/src/pages/Home/ProfileAndSupport/Profile.module.scss +++ b/pro/src/pages/Home/ProfileAndSupport/Profile.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .header-row { display: flex; @@ -9,7 +9,7 @@ } .title { - @include fonts.title4; + @include fonts-design-system.title4; } .description-list { diff --git a/pro/src/pages/Home/ProfileAndSupport/ProfileAndSupport.module.scss b/pro/src/pages/Home/ProfileAndSupport/ProfileAndSupport.module.scss index c7ec07bbed6..5a22f51e227 100644 --- a/pro/src/pages/Home/ProfileAndSupport/ProfileAndSupport.module.scss +++ b/pro/src/pages/Home/ProfileAndSupport/ProfileAndSupport.module.scss @@ -1,9 +1,9 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: rem.torem(16px); } diff --git a/pro/src/pages/Home/ProfileAndSupport/Support.module.scss b/pro/src/pages/Home/ProfileAndSupport/Support.module.scss index b23199c4dc7..c634926cc15 100644 --- a/pro/src/pages/Home/ProfileAndSupport/Support.module.scss +++ b/pro/src/pages/Home/ProfileAndSupport/Support.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(8px); } diff --git a/pro/src/pages/Home/StatisticsDashboard/OfferStats.module.scss b/pro/src/pages/Home/StatisticsDashboard/OfferStats.module.scss index b98b4121db0..6542b7a06bd 100644 --- a/pro/src/pages/Home/StatisticsDashboard/OfferStats.module.scss +++ b/pro/src/pages/Home/StatisticsDashboard/OfferStats.module.scss @@ -1,9 +1,10 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .title { - @include fonts.bold; + @include fonts-design-system.title3; margin-bottom: rem.torem(8px); } diff --git a/pro/src/pages/Home/StatisticsDashboard/StatisticsDashboard.module.scss b/pro/src/pages/Home/StatisticsDashboard/StatisticsDashboard.module.scss index 1b66b678667..87a6c502ecc 100644 --- a/pro/src/pages/Home/StatisticsDashboard/StatisticsDashboard.module.scss +++ b/pro/src/pages/Home/StatisticsDashboard/StatisticsDashboard.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .section { @@ -18,7 +19,7 @@ } .title { - @include fonts.title3; + @include fonts-design-system.title2; } .no-data { diff --git a/pro/src/pages/Home/VenueOfferSteps/VenueOfferSteps.module.scss b/pro/src/pages/Home/VenueOfferSteps/VenueOfferSteps.module.scss index 743d060d895..ec45ad1e613 100644 --- a/pro/src/pages/Home/VenueOfferSteps/VenueOfferSteps.module.scss +++ b/pro/src/pages/Home/VenueOfferSteps/VenueOfferSteps.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .card-wrapper { margin-left: 0 !important; @@ -48,7 +49,7 @@ display: block; margin-bottom: rem.torem(8px); - @include fonts.title4; + @include fonts-design-system.title3; } .inside-partner-block { diff --git a/pro/src/pages/Home/Venues/Venue.module.scss b/pro/src/pages/Home/Venues/Venue.module.scss index 2a7cc00afbd..703f89b4d2e 100644 --- a/pro/src/pages/Home/Venues/Venue.module.scss +++ b/pro/src/pages/Home/Venues/Venue.module.scss @@ -1,6 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .venue-list { margin-top: rem.torem(16px); @@ -24,16 +24,18 @@ .toggle-wrapper { display: flex; align-items: center; + + @include fonts-design-system.title3; } .venue-name { - @include fonts.title4; - background: none; border: none; word-break: break-all; &-button { + @include fonts-design-system.title3; + cursor: pointer; } } diff --git a/pro/src/pages/Home/WelcomeToTheNewBetaBanner/WelcomeToTheNewBetaBanner.module.scss b/pro/src/pages/Home/WelcomeToTheNewBetaBanner/WelcomeToTheNewBetaBanner.module.scss index 20326fb7abf..16040d07936 100644 --- a/pro/src/pages/Home/WelcomeToTheNewBetaBanner/WelcomeToTheNewBetaBanner.module.scss +++ b/pro/src/pages/Home/WelcomeToTheNewBetaBanner/WelcomeToTheNewBetaBanner.module.scss @@ -1,12 +1,12 @@ @use "styles/variables/_size.scss" as size; @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .banner { max-width: rem.torem(632px); &-title { - @include fonts.title3; + @include fonts-design-system.title3; margin-top: rem.torem(62px); } diff --git a/pro/src/pages/LostPassword/ChangePasswordRequestForm/ChangePasswordRequestForm.module.scss b/pro/src/pages/LostPassword/ChangePasswordRequestForm/ChangePasswordRequestForm.module.scss index bfe3fd78b46..f619f7e1c85 100644 --- a/pro/src/pages/LostPassword/ChangePasswordRequestForm/ChangePasswordRequestForm.module.scss +++ b/pro/src/pages/LostPassword/ChangePasswordRequestForm/ChangePasswordRequestForm.module.scss @@ -1,15 +1,15 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .change-password-request-form { .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(16px); } .subtitle { - @include fonts.title4; + @include fonts-design-system.title4; } .validation-button { diff --git a/pro/src/pages/Reimbursements/BankInformations/LinkVenuesDialog.module.scss b/pro/src/pages/Reimbursements/BankInformations/LinkVenuesDialog.module.scss index 5a6455e51ae..f54a4f43c7c 100644 --- a/pro/src/pages/Reimbursements/BankInformations/LinkVenuesDialog.module.scss +++ b/pro/src/pages/Reimbursements/BankInformations/LinkVenuesDialog.module.scss @@ -1,6 +1,7 @@ @use "styles/variables/_forms.scss" as forms; @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; $modal-width: rem.torem(592px); @@ -13,7 +14,7 @@ $banner-height: rem.torem(124px); } &-title { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(16px); padding-right: rem.torem(32px); diff --git a/pro/src/pages/Reimbursements/BankInformations/PricingPointDialog/PricingPointDialog.module.scss b/pro/src/pages/Reimbursements/BankInformations/PricingPointDialog/PricingPointDialog.module.scss index f927334b378..c484d8ce275 100644 --- a/pro/src/pages/Reimbursements/BankInformations/PricingPointDialog/PricingPointDialog.module.scss +++ b/pro/src/pages/Reimbursements/BankInformations/PricingPointDialog/PricingPointDialog.module.scss @@ -1,11 +1,11 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; $modal-width: rem.torem(592px); $modal-height: rem.torem(484px); -.dialog { +.dialog { display: flex; flex-direction: column; @@ -32,7 +32,7 @@ $modal-height: rem.torem(484px); margin-bottom: rem.torem(24px); &-title { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(24px); } diff --git a/pro/src/pages/Reimbursements/Reimbursement.module.scss b/pro/src/pages/Reimbursements/Reimbursement.module.scss index 8de8cb3aa38..1975624867a 100644 --- a/pro/src/pages/Reimbursements/Reimbursement.module.scss +++ b/pro/src/pages/Reimbursements/Reimbursement.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .reimbursements-container { display: flex; @@ -7,7 +7,7 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; margin: 0; } diff --git a/pro/src/pages/Reimbursements/ReimbursementsInvoices/InvoicesNoResult.module.scss b/pro/src/pages/Reimbursements/ReimbursementsInvoices/InvoicesNoResult.module.scss index 16202f55272..df94c624226 100644 --- a/pro/src/pages/Reimbursements/ReimbursementsInvoices/InvoicesNoResult.module.scss +++ b/pro/src/pages/Reimbursements/ReimbursementsInvoices/InvoicesNoResult.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .no-refunds { @@ -13,7 +13,7 @@ } .no-refunds-title { - @include fonts.title4; + @include fonts-design-system.title4; margin: rem.torem(16px) 0; } diff --git a/pro/src/pages/ResetPassword/ResetPassword.module.scss b/pro/src/pages/ResetPassword/ResetPassword.module.scss index c16bb20fc54..9005895fd11 100644 --- a/pro/src/pages/ResetPassword/ResetPassword.module.scss +++ b/pro/src/pages/ResetPassword/ResetPassword.module.scss @@ -1,7 +1,7 @@ @use "styles/mixins/_layout.scss" as layout; @use "styles/variables/_size.scss" as size; @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .logo-side { @include layout.logo-side; @@ -12,7 +12,7 @@ } .change-password-title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(16px); } diff --git a/pro/src/pages/SignIn/Signin.module.scss b/pro/src/pages/SignIn/Signin.module.scss index 5baa73deb5e..99b5e73294d 100644 --- a/pro/src/pages/SignIn/Signin.module.scss +++ b/pro/src/pages/SignIn/Signin.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_layout.scss" as layout; @use "styles/variables/_forms.scss" as forms; @use "styles/variables/_size.scss" as size; @@ -20,7 +21,7 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(16px); } diff --git a/pro/src/pages/Signup/SignupConfirmation/SignupConfirmation.module.scss b/pro/src/pages/Signup/SignupConfirmation/SignupConfirmation.module.scss index 61e8f4a8beb..a92565c345f 100644 --- a/pro/src/pages/Signup/SignupConfirmation/SignupConfirmation.module.scss +++ b/pro/src/pages/Signup/SignupConfirmation/SignupConfirmation.module.scss @@ -1,11 +1,11 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_forms.scss" as forms; @use "styles/mixins/_layout.scss" as layout; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .content { @@ -20,7 +20,7 @@ } .confirmation-text { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(24px); } diff --git a/pro/src/pages/Signup/SignupContainer/SignupContainer.module.scss b/pro/src/pages/Signup/SignupContainer/SignupContainer.module.scss index 157f20dea49..56c1ab3d97c 100644 --- a/pro/src/pages/Signup/SignupContainer/SignupContainer.module.scss +++ b/pro/src/pages/Signup/SignupContainer/SignupContainer.module.scss @@ -1,11 +1,11 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_forms.scss" as forms; @use "styles/mixins/_layout.scss" as layout; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .content { diff --git a/pro/src/pages/Signup/SignupUnavailable/SignupUnavailable.module.scss b/pro/src/pages/Signup/SignupUnavailable/SignupUnavailable.module.scss index bf2b6af5e27..24f294b2878 100644 --- a/pro/src/pages/Signup/SignupUnavailable/SignupUnavailable.module.scss +++ b/pro/src/pages/Signup/SignupUnavailable/SignupUnavailable.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_forms.scss" as forms; @use "styles/variables/_size.scss" as size; @use "styles/mixins/_layout.scss" as layout; @@ -17,11 +17,11 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; margin: rem.torem(24px) 0; } .subtitle { - @include fonts.title2; + @include fonts-design-system.title2; } diff --git a/pro/src/pages/Sitemap/Sitemap.module.scss b/pro/src/pages/Sitemap/Sitemap.module.scss index a37a4ebf609..f3c354bfa1d 100644 --- a/pro/src/pages/Sitemap/Sitemap.module.scss +++ b/pro/src/pages/Sitemap/Sitemap.module.scss @@ -1,8 +1,9 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .sitemap-list { diff --git a/pro/src/pages/VenueCreation/VenueCreationFormScreen.module.scss b/pro/src/pages/VenueCreation/VenueCreationFormScreen.module.scss index af4e0636d5c..e5069f2593d 100644 --- a/pro/src/pages/VenueCreation/VenueCreationFormScreen.module.scss +++ b/pro/src/pages/VenueCreation/VenueCreationFormScreen.module.scss @@ -1,12 +1,12 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .venue-form-heading { margin-bottom: rem.torem(32px); } .title { - @include fonts.title1; + @include fonts-design-system.title1; } .title-page { diff --git a/pro/src/pages/VenueEdition/VenueEdition.module.scss b/pro/src/pages/VenueEdition/VenueEdition.module.scss index 39f59c88e75..48a206d21e5 100644 --- a/pro/src/pages/VenueEdition/VenueEdition.module.scss +++ b/pro/src/pages/VenueEdition/VenueEdition.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .header { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/pages/VenueEdition/VenueEditionHeader.module.scss b/pro/src/pages/VenueEdition/VenueEditionHeader.module.scss index 8ffb9e160f5..8ab74c9c720 100644 --- a/pro/src/pages/VenueEdition/VenueEditionHeader.module.scss +++ b/pro/src/pages/VenueEdition/VenueEditionHeader.module.scss @@ -1,4 +1,5 @@ @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; @@ -45,7 +46,7 @@ } .venue-name { - @include fonts.title3; + @include fonts-design-system.title2; } .separator { diff --git a/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/AllocineProviderFormDialog.module.scss b/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/AllocineProviderFormDialog.module.scss index f717a3a9c50..42007470394 100644 --- a/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/AllocineProviderFormDialog.module.scss +++ b/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/AllocineProviderFormDialog.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .allocine-provider-form-dialog { @@ -14,7 +14,7 @@ } .title { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(32px); diff --git a/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/CinemaProviderFormDialog.module.scss b/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/CinemaProviderFormDialog.module.scss index dcd39e1c647..048a34d718f 100644 --- a/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/CinemaProviderFormDialog.module.scss +++ b/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/CinemaProviderFormDialog.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .cinema-provider-form-dialog { align-items: center; @@ -10,7 +10,7 @@ text-align: left; .title { - @include fonts.title4; + @include fonts-design-system.title4; } .explanation { diff --git a/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/VenueProviderCard.module.scss b/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/VenueProviderCard.module.scss index 6a5567caf93..dd2c2f894db 100644 --- a/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/VenueProviderCard.module.scss +++ b/pro/src/pages/VenueSettings/VenueProvidersManager/VenueProviderList/VenueProviderCard.module.scss @@ -1,4 +1,5 @@ @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; @@ -43,7 +44,7 @@ } .provider-name { - @include fonts.title4; + @include fonts-design-system.title4; overflow: hidden; text-overflow: ellipsis; diff --git a/pro/src/pages/VenueSettings/VenueSettingsScreen.module.scss b/pro/src/pages/VenueSettings/VenueSettingsScreen.module.scss index 6ddf395c971..66f692e52bf 100644 --- a/pro/src/pages/VenueSettings/VenueSettingsScreen.module.scss +++ b/pro/src/pages/VenueSettings/VenueSettingsScreen.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-top: rem.torem(32px); margin-bottom: rem.torem(32px); diff --git a/pro/src/public/fonts/Montserrat-ExtraBold.woff2 b/pro/src/public/fonts/Montserrat-ExtraBold.woff2 deleted file mode 100644 index ba9ffa508f6..00000000000 Binary files a/pro/src/public/fonts/Montserrat-ExtraBold.woff2 and /dev/null differ diff --git a/pro/src/screens/Bookings/Bookings.module.scss b/pro/src/screens/Bookings/Bookings.module.scss index f376ce22ad2..849cd5aa78f 100644 --- a/pro/src/screens/Bookings/Bookings.module.scss +++ b/pro/src/screens/Bookings/Bookings.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/screens/Bookings/BookingsRecapTable/NoFilteredBookings/NoFilteredBookings.module.scss b/pro/src/screens/Bookings/BookingsRecapTable/NoFilteredBookings/NoFilteredBookings.module.scss index 070cbc3e46b..adde2d47740 100644 --- a/pro/src/screens/Bookings/BookingsRecapTable/NoFilteredBookings/NoFilteredBookings.module.scss +++ b/pro/src/screens/Bookings/BookingsRecapTable/NoFilteredBookings/NoFilteredBookings.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .search-no-results { @@ -10,7 +10,7 @@ } &-title4 { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(16px); } diff --git a/pro/src/screens/CollectiveOfferConfirmation/CollectiveOfferConfirmation.module.scss b/pro/src/screens/CollectiveOfferConfirmation/CollectiveOfferConfirmation.module.scss index afdbfc26560..33ac5d18aca 100644 --- a/pro/src/screens/CollectiveOfferConfirmation/CollectiveOfferConfirmation.module.scss +++ b/pro/src/screens/CollectiveOfferConfirmation/CollectiveOfferConfirmation.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .confirmation { text-align: center; @@ -19,7 +20,7 @@ margin-bottom: rem.torem(32px); &-title { - @include fonts.title3; + @include fonts-design-system.title3; } &-header { diff --git a/pro/src/screens/CollectiveOfferSelectionDuplication/CollectiveOfferSelectionDuplication.module.scss b/pro/src/screens/CollectiveOfferSelectionDuplication/CollectiveOfferSelectionDuplication.module.scss index a7d9bd97d08..06b6090c50a 100644 --- a/pro/src/screens/CollectiveOfferSelectionDuplication/CollectiveOfferSelectionDuplication.module.scss +++ b/pro/src/screens/CollectiveOfferSelectionDuplication/CollectiveOfferSelectionDuplication.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .search-container { position: relative; @@ -12,13 +13,13 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } .sub-title { - @include fonts.title4; + @include fonts-design-system.title4; } .search-input input { diff --git a/pro/src/screens/CollectiveOfferVisibility/CollectiveOfferVisibility.module.scss b/pro/src/screens/CollectiveOfferVisibility/CollectiveOfferVisibility.module.scss index 31441b6b31b..915373b9873 100644 --- a/pro/src/screens/CollectiveOfferVisibility/CollectiveOfferVisibility.module.scss +++ b/pro/src/screens/CollectiveOfferVisibility/CollectiveOfferVisibility.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .description-text { margin-bottom: rem.torem(24px); @@ -12,7 +12,7 @@ .legend { border: none; - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(24px); } diff --git a/pro/src/screens/CollectiveOffersScreen/CollectiveOffersScreen.module.scss b/pro/src/screens/CollectiveOffersScreen/CollectiveOffersScreen.module.scss index e2ab405cc44..7f6cb0e39fe 100644 --- a/pro/src/screens/CollectiveOffersScreen/CollectiveOffersScreen.module.scss +++ b/pro/src/screens/CollectiveOffersScreen/CollectiveOffersScreen.module.scss @@ -1,8 +1,9 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/screens/EmailChangeValidation/EmailChangeValidation.module.scss b/pro/src/screens/EmailChangeValidation/EmailChangeValidation.module.scss index 11d6dc0b9ea..cd013d3c534 100644 --- a/pro/src/screens/EmailChangeValidation/EmailChangeValidation.module.scss +++ b/pro/src/screens/EmailChangeValidation/EmailChangeValidation.module.scss @@ -1,11 +1,11 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_forms.scss" as forms; @use "styles/mixins/_layout.scss" as layout; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .title { - @include fonts.title1; + @include fonts-design-system.title1; } .logo-side { @@ -17,7 +17,7 @@ } .subtitle { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(16px); } diff --git a/pro/src/screens/IndividualOffer/BookingsSummary/BookingsSummary.module.scss b/pro/src/screens/IndividualOffer/BookingsSummary/BookingsSummary.module.scss index 9d55970a2e3..f24aea06899 100644 --- a/pro/src/screens/IndividualOffer/BookingsSummary/BookingsSummary.module.scss +++ b/pro/src/screens/IndividualOffer/BookingsSummary/BookingsSummary.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .no-data { text-align: center; @@ -18,8 +18,8 @@ gap: rem.torem(16px); flex-wrap: wrap; margin-bottom: rem.torem(16px); - + &-title { - @include fonts.title3; + @include fonts-design-system.title2; } } diff --git a/pro/src/screens/IndividualOffer/BookingsSummary/DownloadBookingsModal/DownloadBookingsModal.module.scss b/pro/src/screens/IndividualOffer/BookingsSummary/DownloadBookingsModal/DownloadBookingsModal.module.scss index 1f3993c3032..bb386dd680e 100644 --- a/pro/src/screens/IndividualOffer/BookingsSummary/DownloadBookingsModal/DownloadBookingsModal.module.scss +++ b/pro/src/screens/IndividualOffer/BookingsSummary/DownloadBookingsModal/DownloadBookingsModal.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .container { display: flex; @@ -9,11 +10,11 @@ } .header { - @include fonts.title3; + @include fonts-design-system.title2; } .one-booking-date-section { - @include fonts.title4; + @include fonts-design-system.title4; margin: rem.torem(8px) 0; } diff --git a/pro/src/screens/IndividualOffer/DetailsSummary/DetailsSummary.module.scss b/pro/src/screens/IndividualOffer/DetailsSummary/DetailsSummary.module.scss index 59c6903d948..814dfbbdbac 100644 --- a/pro/src/screens/IndividualOffer/DetailsSummary/DetailsSummary.module.scss +++ b/pro/src/screens/IndividualOffer/DetailsSummary/DetailsSummary.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .app-link { @@ -7,14 +7,14 @@ } .title-container { - @include fonts.title2; + @include fonts-design-system.title2; margin-bottom: rem.torem(16px); display: flex; } .title { - @include fonts.title4; + @include fonts-design-system.title4; } .icon-info-phone { diff --git a/pro/src/screens/IndividualOffer/IndivualOfferLayout/IndivualOfferLayout.module.scss b/pro/src/screens/IndividualOffer/IndivualOfferLayout/IndivualOfferLayout.module.scss index 198dbd0a17e..1796ed88bcf 100644 --- a/pro/src/screens/IndividualOffer/IndivualOfferLayout/IndivualOfferLayout.module.scss +++ b/pro/src/screens/IndividualOffer/IndivualOfferLayout/IndivualOfferLayout.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title-without-name { margin-bottom: rem.torem(54px); @@ -10,7 +11,7 @@ } .offer-title { - @include fonts.title4; + @include fonts-design-system.title4; } .title-container { @@ -20,7 +21,7 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; flex: auto; } diff --git a/pro/src/screens/IndividualOffer/StocksEventCreation/HelpSection/HelpSection.module.scss b/pro/src/screens/IndividualOffer/StocksEventCreation/HelpSection/HelpSection.module.scss index 52594ad4ec7..aa14e7c4b21 100644 --- a/pro/src/screens/IndividualOffer/StocksEventCreation/HelpSection/HelpSection.module.scss +++ b/pro/src/screens/IndividualOffer/StocksEventCreation/HelpSection/HelpSection.module.scss @@ -2,6 +2,7 @@ @use "styles/variables/_forms.scss" as forms; @use "styles/variables/_size.scss" as size; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .container { position: relative; @@ -11,7 +12,7 @@ } .title { - @include fonts.title3; + @include fonts-design-system.title2; position: absolute; top: 0; diff --git a/pro/src/screens/IndividualOffer/StocksEventCreation/RecurrenceForm.module.scss b/pro/src/screens/IndividualOffer/StocksEventCreation/RecurrenceForm.module.scss index f96b2432011..5284badb8ac 100644 --- a/pro/src/screens/IndividualOffer/StocksEventCreation/RecurrenceForm.module.scss +++ b/pro/src/screens/IndividualOffer/StocksEventCreation/RecurrenceForm.module.scss @@ -3,11 +3,12 @@ @use "styles/variables/_size.scss" as size; @use "styles/mixins/_forms.scss" as formsM; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { margin-bottom: rem.torem(24px); - @include fonts.title3; + @include fonts-design-system.title3; @media (max-width: size.$tablet) { margin-top: rem.torem(32px); @@ -22,7 +23,7 @@ } .legend { - @include fonts.title4; + @include fonts-design-system.title4; display: flex; align-items: center; diff --git a/pro/src/screens/IndividualOffer/StocksThing/ActivationCodeFormDialog/ActivationCodeFormDialog.module.scss b/pro/src/screens/IndividualOffer/StocksThing/ActivationCodeFormDialog/ActivationCodeFormDialog.module.scss index 8e45131437f..5e256dd3071 100644 --- a/pro/src/screens/IndividualOffer/StocksThing/ActivationCodeFormDialog/ActivationCodeFormDialog.module.scss +++ b/pro/src/screens/IndividualOffer/StocksThing/ActivationCodeFormDialog/ActivationCodeFormDialog.module.scss @@ -1,4 +1,5 @@ @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; @@ -43,7 +44,7 @@ } .activation-codes-upload-gabarit { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(16px); } diff --git a/pro/src/screens/IndividualOffer/SummaryScreen/SummaryScreen.module.scss b/pro/src/screens/IndividualOffer/SummaryScreen/SummaryScreen.module.scss index fdbb52c38ca..10ff8190d05 100644 --- a/pro/src/screens/IndividualOffer/SummaryScreen/SummaryScreen.module.scss +++ b/pro/src/screens/IndividualOffer/SummaryScreen/SummaryScreen.module.scss @@ -1,4 +1,4 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .offer-preview-app-link { @@ -22,7 +22,7 @@ } .title { - @include fonts.title4; + @include fonts-design-system.title4; } } diff --git a/pro/src/screens/IndividualOfferConfirmationScreen/IndividualOfferConfirmationScreen.module.scss b/pro/src/screens/IndividualOfferConfirmationScreen/IndividualOfferConfirmationScreen.module.scss index 6bcb28af327..c13c849ab9f 100644 --- a/pro/src/screens/IndividualOfferConfirmationScreen/IndividualOfferConfirmationScreen.module.scss +++ b/pro/src/screens/IndividualOfferConfirmationScreen/IndividualOfferConfirmationScreen.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/variables/_size.scss" as size; .confirmation-container { @@ -18,7 +18,7 @@ } .confirmation-title { - @include fonts.title3; + @include fonts-design-system.title2; margin-bottom: rem.torem(24px); } diff --git a/pro/src/screens/IndividualOffersScreen/IndividualOffersScreen.module.scss b/pro/src/screens/IndividualOffersScreen/IndividualOffersScreen.module.scss index c7d3e2315a1..ba4ba6b6a9a 100644 --- a/pro/src/screens/IndividualOffersScreen/IndividualOffersScreen.module.scss +++ b/pro/src/screens/IndividualOffersScreen/IndividualOffersScreen.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title-container { display: flex; @@ -10,7 +10,7 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; flex-grow: 1; } diff --git a/pro/src/screens/IndividualOffersScreen/NoResults/NoResults.module.scss b/pro/src/screens/IndividualOffersScreen/NoResults/NoResults.module.scss index 9a6b1568f72..9fb94c38b68 100644 --- a/pro/src/screens/IndividualOffersScreen/NoResults/NoResults.module.scss +++ b/pro/src/screens/IndividualOffersScreen/NoResults/NoResults.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .search-no-results { text-align: center; @@ -10,7 +10,7 @@ } &-title4 { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(32px); } diff --git a/pro/src/screens/OfferType/OfferType.module.scss b/pro/src/screens/OfferType/OfferType.module.scss index 2f593c95408..371082d0164 100644 --- a/pro/src/screens/OfferType/OfferType.module.scss +++ b/pro/src/screens/OfferType/OfferType.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .offer-type-title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/screens/OffererStats/OffererStatsScreen.module.scss b/pro/src/screens/OffererStats/OffererStatsScreen.module.scss index 3b6c6956419..af21b8aa97e 100644 --- a/pro/src/screens/OffererStats/OffererStatsScreen.module.scss +++ b/pro/src/screens/OffererStats/OffererStatsScreen.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .dashboard-iframe { width: 100%; @@ -8,7 +8,7 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/screens/SignupJourneyForm/Activity/ActivityForm.module.scss b/pro/src/screens/SignupJourneyForm/Activity/ActivityForm.module.scss index 565e72b4712..6a6a1546c7f 100644 --- a/pro/src/screens/SignupJourneyForm/Activity/ActivityForm.module.scss +++ b/pro/src/screens/SignupJourneyForm/Activity/ActivityForm.module.scss @@ -1,10 +1,11 @@ @use "styles/variables/_forms.scss" as forms; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; @use "styles/variables/_size.scss" as size; .activity-form-wrapper { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(24px); } diff --git a/pro/src/screens/SignupJourneyForm/Authentication/OffererAuthenticationForm.module.scss b/pro/src/screens/SignupJourneyForm/Authentication/OffererAuthenticationForm.module.scss index c28f3c0a507..e46bdf71bdc 100644 --- a/pro/src/screens/SignupJourneyForm/Authentication/OffererAuthenticationForm.module.scss +++ b/pro/src/screens/SignupJourneyForm/Authentication/OffererAuthenticationForm.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .title { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: rem.torem(24px); } diff --git a/pro/src/screens/SignupJourneyForm/ConfirmedAttachment/ConfirmedAttachment.module.scss b/pro/src/screens/SignupJourneyForm/ConfirmedAttachment/ConfirmedAttachment.module.scss index 1e17cfc550c..4d0b6d81943 100644 --- a/pro/src/screens/SignupJourneyForm/ConfirmedAttachment/ConfirmedAttachment.module.scss +++ b/pro/src/screens/SignupJourneyForm/ConfirmedAttachment/ConfirmedAttachment.module.scss @@ -1,5 +1,5 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; $confirmed-attachment-gap: rem.torem(32px); @@ -11,7 +11,7 @@ $confirmed-attachment-gap: rem.torem(32px); } .title { - @include fonts.title1; + @include fonts-design-system.title1; } .home-button { diff --git a/pro/src/screens/SignupJourneyForm/Offerer/OffererForm.module.scss b/pro/src/screens/SignupJourneyForm/Offerer/OffererForm.module.scss index 122fb83ebee..c3f16e8e209 100644 --- a/pro/src/screens/SignupJourneyForm/Offerer/OffererForm.module.scss +++ b/pro/src/screens/SignupJourneyForm/Offerer/OffererForm.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .title { - @include fonts.title3; + @include fonts-design-system.title3; } .input-siret { diff --git a/pro/src/screens/SignupJourneyForm/Offerers/Offerers.module.scss b/pro/src/screens/SignupJourneyForm/Offerers/Offerers.module.scss index c996e9db179..94a8a192e9d 100644 --- a/pro/src/screens/SignupJourneyForm/Offerers/Offerers.module.scss +++ b/pro/src/screens/SignupJourneyForm/Offerers/Offerers.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; $offerers-gap: rem.torem(16px); $medium-gap: rem.torem(16px); @@ -54,7 +55,7 @@ $small-gap: rem.torem(8px); } .title-4 { - @include fonts.title4; + @include fonts-design-system.title4; } .dialog-content { diff --git a/pro/src/screens/SignupJourneyForm/Validation/Validation.module.scss b/pro/src/screens/SignupJourneyForm/Validation/Validation.module.scss index eb4281f6ac9..7ed59af2b9a 100644 --- a/pro/src/screens/SignupJourneyForm/Validation/Validation.module.scss +++ b/pro/src/screens/SignupJourneyForm/Validation/Validation.module.scss @@ -1,14 +1,15 @@ @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .title { - @include fonts.title3; + @include fonts-design-system.title3; margin-bottom: 0; } .subtitle { - @include fonts.title4; + @include fonts-design-system.title4; } .data-displaying { diff --git a/pro/src/screens/SignupJourneyForm/Welcome/Welcome.module.scss b/pro/src/screens/SignupJourneyForm/Welcome/Welcome.module.scss index 6370e648063..3d20ca984cb 100644 --- a/pro/src/screens/SignupJourneyForm/Welcome/Welcome.module.scss +++ b/pro/src/screens/SignupJourneyForm/Welcome/Welcome.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; $welcome-gap: rem.torem(32px); @@ -12,7 +13,7 @@ $welcome-gap: rem.torem(32px); } .title { - @include fonts.title1; + @include fonts-design-system.title1; } .continue-button { diff --git a/pro/src/screens/TemplateCollectiveOffersScreen/TemplateCollectiveOffersScreen.module.scss b/pro/src/screens/TemplateCollectiveOffersScreen/TemplateCollectiveOffersScreen.module.scss index a0cfc831330..aef69c99ae5 100644 --- a/pro/src/screens/TemplateCollectiveOffersScreen/TemplateCollectiveOffersScreen.module.scss +++ b/pro/src/screens/TemplateCollectiveOffersScreen/TemplateCollectiveOffersScreen.module.scss @@ -1,5 +1,6 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .banner { margin-bottom: rem.torem(16px); @@ -16,7 +17,7 @@ } .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/screens/UserProfile/UserProfile.module.scss b/pro/src/screens/UserProfile/UserProfile.module.scss index 20b125da4e3..fe02744a169 100644 --- a/pro/src/screens/UserProfile/UserProfile.module.scss +++ b/pro/src/screens/UserProfile/UserProfile.module.scss @@ -1,12 +1,12 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .profil-container { max-width: rem.torem(810px); } .profil-title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(32px); } diff --git a/pro/src/styles/components/_CookieModals.scss b/pro/src/styles/components/_CookieModals.scss index 4257c333a8a..187c5a7bae9 100644 --- a/pro/src/styles/components/_CookieModals.scss +++ b/pro/src/styles/components/_CookieModals.scss @@ -2,6 +2,7 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_a11y.scss" as a11y; @use "styles/variables/_size.scss" as size; @@ -122,7 +123,7 @@ $action-gap: rem.torem(10px); &-title { margin-bottom: rem.torem(8px); - @include fonts.title3; + @include fonts-design-system.title3; } &-description { @@ -190,7 +191,7 @@ $action-gap: rem.torem(10px); } &-title { - @include fonts.title4; + @include fonts-design-system.title4; } &-description { diff --git a/pro/src/styles/global/_font_faces.scss b/pro/src/styles/global/_font_faces.scss index dd11a2d48e3..850d8432a5e 100644 --- a/pro/src/styles/global/_font_faces.scss +++ b/pro/src/styles/global/_font_faces.scss @@ -24,14 +24,3 @@ local("Montserrat-Italic"), url("/fonts/Montserrat-Italic.woff2") format("woff2"); } - -@font-face { - font-family: Montserrat-ExtraBold; - font-weight: 800; - font-style: normal; - font-display: "swap"; - src: - local("Montserrat ExtraBold"), - local("Montserrat-ExtraBold"), - url("/fonts/Montserrat-ExtraBold.woff2") format("woff2"); -} diff --git a/pro/src/styles/mixins/_fonts-legacy.scss b/pro/src/styles/mixins/_fonts-legacy.scss index 191142791c3..2fd005f26a4 100644 --- a/pro/src/styles/mixins/_fonts-legacy.scss +++ b/pro/src/styles/mixins/_fonts-legacy.scss @@ -3,18 +3,12 @@ @mixin bold() { font-family: Montserrat-Bold, system-ui, sans-serif; - font-weight: 700; - font-style: normal; } @mixin semi-bold() { font-family: Montserrat-SemiBold, system-ui, sans-serif; - font-weight: 600; - font-style: normal; } @mixin medium() { font-family: Montserrat-Medium, system-ui, sans-serif; - font-weight: 500; - font-style: normal; } diff --git a/pro/src/styles/mixins/_fonts.scss b/pro/src/styles/mixins/_fonts.scss index d81fff429fc..ccfb1f29e94 100644 --- a/pro/src/styles/mixins/_fonts.scss +++ b/pro/src/styles/mixins/_fonts.scss @@ -6,78 +6,34 @@ $body-line-height: 1.25em; $body-font-size: rem.torem(15px); $caption-line-height: rem.torem(16px); -@mixin title1() { - font-family: Montserrat-ExtraBold, system-ui, sans-serif; - font-weight: 800; - font-style: normal; - font-size: rem.torem(26px); - line-height: rem.torem(34px); -} - -@mixin title2() { - font-family: Montserrat-Medium, system-ui, sans-serif; - font-weight: 500; - font-style: normal; - font-size: rem.torem(22px); - line-height: rem.torem(26px); -} - -@mixin title3() { - font-family: Montserrat-Bold, system-ui, sans-serif; - font-weight: 700; - font-style: normal; - font-size: rem.torem(20px); - line-height: rem.torem(24px); -} - -@mixin title4() { - font-family: Montserrat-SemiBold, system-ui, sans-serif; - font-weight: 600; - font-style: normal; - font-size: rem.torem(18px); - line-height: rem.torem(22px); -} - @mixin button() { font-family: Montserrat-Bold, system-ui, sans-serif; - font-weight: 700; - font-style: normal; font-size: rem.torem(15px); } @mixin body() { font-family: Montserrat-Regular, system-ui, sans-serif; - font-weight: 400; - font-style: normal; font-size: $body-font-size; line-height: $body-line-height; } @mixin body-important() { font-family: Montserrat-Medium, system-ui, sans-serif; - font-weight: 500; - font-style: normal; font-size: $body-font-size; } @mixin body-exergue() { font-family: Montserrat-SemiBold, system-ui, sans-serif; - font-weight: 600; - font-style: normal; font-size: $body-font-size; } @mixin caption() { font-family: Montserrat-SemiBold, system-ui, sans-serif; - font-weight: 600; - font-style: normal; font-size: rem.torem(12px); line-height: $caption-line-height; } @mixin placeholder() { font-family: Montserrat-RegularItalic, system-ui, sans-serif; - font-weight: 400; - font-style: italic; font-size: rem.torem(15px); } diff --git a/pro/src/ui-kit/DropdownMenuWrapper/DropdownMenuWrapper.module.scss b/pro/src/ui-kit/DropdownMenuWrapper/DropdownMenuWrapper.module.scss index c15b2c4ec11..0db01619631 100644 --- a/pro/src/ui-kit/DropdownMenuWrapper/DropdownMenuWrapper.module.scss +++ b/pro/src/ui-kit/DropdownMenuWrapper/DropdownMenuWrapper.module.scss @@ -1,8 +1,9 @@ @use "styles/mixins/_rem.scss" as rem; @use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .menu-button { - @include fonts.title2; + @include fonts-design-system.title2; background-color: transparent; border: none; @@ -61,4 +62,4 @@ path { fill: var(--color-black); } -} \ No newline at end of file +} diff --git a/pro/src/ui-kit/Hero/Hero.module.scss b/pro/src/ui-kit/Hero/Hero.module.scss index 4d30ccffb23..e6db648bb4b 100644 --- a/pro/src/ui-kit/Hero/Hero.module.scss +++ b/pro/src/ui-kit/Hero/Hero.module.scss @@ -1,15 +1,15 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .hero { .title { - @include fonts.title1; + @include fonts-design-system.title1; margin-bottom: rem.torem(16px); } .subtitle { - @include fonts.title4; + @include fonts-design-system.title4; margin-bottom: rem.torem(24px); } diff --git a/pro/src/ui-kit/Icons/Icons.module.scss b/pro/src/ui-kit/Icons/Icons.module.scss index 834eeab7a1b..207600d0ad2 100644 --- a/pro/src/ui-kit/Icons/Icons.module.scss +++ b/pro/src/ui-kit/Icons/Icons.module.scss @@ -1,8 +1,8 @@ @use "styles/mixins/_rem.scss" as rem; -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; .title { - @include fonts.title2; + @include fonts-design-system.title2; } .icon-stories { diff --git a/pro/src/ui-kit/Toggle/Toggle.module.scss b/pro/src/ui-kit/Toggle/Toggle.module.scss index 91ffdd9761e..def82449059 100644 --- a/pro/src/ui-kit/Toggle/Toggle.module.scss +++ b/pro/src/ui-kit/Toggle/Toggle.module.scss @@ -1,8 +1,8 @@ -@use "styles/mixins/_fonts.scss" as fonts; +@use "styles/mixins/fonts-design-system.scss" as fonts-design-system; @use "styles/mixins/_rem.scss" as rem; .toggle { - @include fonts.title4; + @include fonts-design-system.title4; display: flex; flex-wrap: wrap;