From 75354527f6c6e7a6f07491099ab5292e99e9e23e Mon Sep 17 00:00:00 2001 From: gabek Date: Tue, 19 Apr 2022 21:34:40 +0000 Subject: [PATCH] Prettified Code! --- web/public/fonts/inter/inter.css | 113 +++++++++++++++---------------- web/stories/preview.scss | 2 +- web/styles/variables.scss | 6 +- 3 files changed, 59 insertions(+), 62 deletions(-) diff --git a/web/public/fonts/inter/inter.css b/web/public/fonts/inter/inter.css index f45001012..d92263820 100644 --- a/web/public/fonts/inter/inter.css +++ b/web/public/fonts/inter/inter.css @@ -1,154 +1,152 @@ @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 100; font-display: swap; - src: url("Inter-Thin.woff2?v=3.19") format("woff2"), - url("Inter-Thin.woff?v=3.19") format("woff"); + src: url('Inter-Thin.woff2?v=3.19') format('woff2'), url('Inter-Thin.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 100; font-display: swap; - src: url("Inter-ThinItalic.woff2?v=3.19") format("woff2"), - url("Inter-ThinItalic.woff?v=3.19") format("woff"); + src: url('Inter-ThinItalic.woff2?v=3.19') format('woff2'), + url('Inter-ThinItalic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 200; font-display: swap; - src: url("Inter-ExtraLight.woff2?v=3.19") format("woff2"), - url("Inter-ExtraLight.woff?v=3.19") format("woff"); + src: url('Inter-ExtraLight.woff2?v=3.19') format('woff2'), + url('Inter-ExtraLight.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 200; font-display: swap; - src: url("Inter-ExtraLightItalic.woff2?v=3.19") format("woff2"), - url("Inter-ExtraLightItalic.woff?v=3.19") format("woff"); + src: url('Inter-ExtraLightItalic.woff2?v=3.19') format('woff2'), + url('Inter-ExtraLightItalic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 300; font-display: swap; - src: url("Inter-Light.woff2?v=3.19") format("woff2"), - url("Inter-Light.woff?v=3.19") format("woff"); + src: url('Inter-Light.woff2?v=3.19') format('woff2'), + url('Inter-Light.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 300; font-display: swap; - src: url("Inter-LightItalic.woff2?v=3.19") format("woff2"), - url("Inter-LightItalic.woff?v=3.19") format("woff"); + src: url('Inter-LightItalic.woff2?v=3.19') format('woff2'), + url('Inter-LightItalic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 400; font-display: swap; - src: url("Inter-Regular.woff2?v=3.19") format("woff2"), - url("Inter-Regular.woff?v=3.19") format("woff"); + src: url('Inter-Regular.woff2?v=3.19') format('woff2'), + url('Inter-Regular.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 400; font-display: swap; - src: url("Inter-Italic.woff2?v=3.19") format("woff2"), - url("Inter-Italic.woff?v=3.19") format("woff"); + src: url('Inter-Italic.woff2?v=3.19') format('woff2'), + url('Inter-Italic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 500; font-display: swap; - src: url("Inter-Medium.woff2?v=3.19") format("woff2"), - url("Inter-Medium.woff?v=3.19") format("woff"); + src: url('Inter-Medium.woff2?v=3.19') format('woff2'), + url('Inter-Medium.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 500; font-display: swap; - src: url("Inter-MediumItalic.woff2?v=3.19") format("woff2"), - url("Inter-MediumItalic.woff?v=3.19") format("woff"); + src: url('Inter-MediumItalic.woff2?v=3.19') format('woff2'), + url('Inter-MediumItalic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 600; font-display: swap; - src: url("Inter-SemiBold.woff2?v=3.19") format("woff2"), - url("Inter-SemiBold.woff?v=3.19") format("woff"); + src: url('Inter-SemiBold.woff2?v=3.19') format('woff2'), + url('Inter-SemiBold.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 600; font-display: swap; - src: url("Inter-SemiBoldItalic.woff2?v=3.19") format("woff2"), - url("Inter-SemiBoldItalic.woff?v=3.19") format("woff"); + src: url('Inter-SemiBoldItalic.woff2?v=3.19') format('woff2'), + url('Inter-SemiBoldItalic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 700; font-display: swap; - src: url("Inter-Bold.woff2?v=3.19") format("woff2"), - url("Inter-Bold.woff?v=3.19") format("woff"); + src: url('Inter-Bold.woff2?v=3.19') format('woff2'), url('Inter-Bold.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 700; font-display: swap; - src: url("Inter-BoldItalic.woff2?v=3.19") format("woff2"), - url("Inter-BoldItalic.woff?v=3.19") format("woff"); + src: url('Inter-BoldItalic.woff2?v=3.19') format('woff2'), + url('Inter-BoldItalic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 800; font-display: swap; - src: url("Inter-ExtraBold.woff2?v=3.19") format("woff2"), - url("Inter-ExtraBold.woff?v=3.19") format("woff"); + src: url('Inter-ExtraBold.woff2?v=3.19') format('woff2'), + url('Inter-ExtraBold.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 800; font-display: swap; - src: url("Inter-ExtraBoldItalic.woff2?v=3.19") format("woff2"), - url("Inter-ExtraBoldItalic.woff?v=3.19") format("woff"); + src: url('Inter-ExtraBoldItalic.woff2?v=3.19') format('woff2'), + url('Inter-ExtraBoldItalic.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: normal; + font-style: normal; font-weight: 900; font-display: swap; - src: url("Inter-Black.woff2?v=3.19") format("woff2"), - url("Inter-Black.woff?v=3.19") format("woff"); + src: url('Inter-Black.woff2?v=3.19') format('woff2'), + url('Inter-Black.woff?v=3.19') format('woff'); } @font-face { font-family: 'Inter'; - font-style: italic; + font-style: italic; font-weight: 900; font-display: swap; - src: url("Inter-BlackItalic.woff2?v=3.19") format("woff2"), - url("Inter-BlackItalic.woff?v=3.19") format("woff"); + src: url('Inter-BlackItalic.woff2?v=3.19') format('woff2'), + url('Inter-BlackItalic.woff?v=3.19') format('woff'); } /* ------------------------------------------------------- @@ -166,7 +164,7 @@ Usage: font-display: swap; font-style: normal; font-named-instance: 'Regular'; - src: url("Inter-roman.var.woff2?v=3.19") format("woff2"); + src: url('Inter-roman.var.woff2?v=3.19') format('woff2'); } @font-face { font-family: 'Inter var'; @@ -174,10 +172,9 @@ Usage: font-display: swap; font-style: italic; font-named-instance: 'Italic'; - src: url("Inter-italic.var.woff2?v=3.19") format("woff2"); + src: url('Inter-italic.var.woff2?v=3.19') format('woff2'); } - /* -------------------------------------------------------------------------- [EXPERIMENTAL] Multi-axis, single variable font. @@ -196,5 +193,5 @@ explicitly, e.g. font-weight: 100 900; font-display: swap; font-style: oblique 0deg 10deg; - src: url("Inter.var.woff2?v=3.19") format("woff2"); + src: url('Inter.var.woff2?v=3.19') format('woff2'); } diff --git a/web/stories/preview.scss b/web/stories/preview.scss index ba6cbafea..6127d6070 100644 --- a/web/stories/preview.scss +++ b/web/stories/preview.scss @@ -1,4 +1,4 @@ html, body { font-family: var(--font-family); -} \ No newline at end of file +} diff --git a/web/styles/variables.scss b/web/styles/variables.scss index 9da63d404..e5effd246 100644 --- a/web/styles/variables.scss +++ b/web/styles/variables.scss @@ -90,7 +90,7 @@ --popover-base-color: var(--gray); --tooltip-base-color: var(--gray-medium); - --font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', - Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', - 'Noto Color Emoji'; + --font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, + 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', + 'Segoe UI Symbol', 'Noto Color Emoji'; }