Merge pull request #41 from AlexandrTarabanko/Fonts

Local Fonts
AlexandrTarabanko · May 18, 2023 · f8bd73f · f8bd73f
2 parents 6fc5223 + d58d250
commit f8bd73f
Show file tree

Hide file tree

Showing 12 changed files with 45 additions and 20 deletions.
diff --git a/src/fonts/dm-sans-v11-latin-500.woff b/src/fonts/dm-sans-v11-latin-500.woff
diff --git a/src/fonts/dm-sans-v11-latin-500.woff2 b/src/fonts/dm-sans-v11-latin-500.woff2
diff --git a/src/fonts/dm-sans-v11-latin-700.woff b/src/fonts/dm-sans-v11-latin-700.woff
diff --git a/src/fonts/dm-sans-v11-latin-700.woff2 b/src/fonts/dm-sans-v11-latin-700.woff2
diff --git a/src/fonts/dm-sans-v11-latin-italic.woff b/src/fonts/dm-sans-v11-latin-italic.woff
diff --git a/src/fonts/dm-sans-v11-latin-italic.woff2 b/src/fonts/dm-sans-v11-latin-italic.woff2
diff --git a/src/fonts/dm-sans-v11-latin-regular.woff b/src/fonts/dm-sans-v11-latin-regular.woff
diff --git a/src/fonts/dm-sans-v11-latin-regular.woff2 b/src/fonts/dm-sans-v11-latin-regular.woff2
diff --git a/src/index.html b/src/index.html
@@ -10,12 +10,6 @@
     />
     <title>Bookshelf</title>
     <link rel="stylesheet" href="./sass/index.scss" />
-    <link rel="preconnect" href="https://fonts.googleapis.com" />
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link
-      href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,700;1,400&display=swap"
-      rel="stylesheet"
-    />
   </head>
 
   <body class="light">

diff --git a/src/sass/base/_fonts.scss b/src/sass/base/_fonts.scss
@@ -0,0 +1,36 @@
+/* dm-sans-regular - latin */
+@font-face {
+	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+	font-family: "DM Sans";
+	font-style: normal;
+	font-weight: 400;
+	src: url("../fonts/dm-sans-v11-latin-regular.woff2") format("woff2"),
+		/* Chrome 36+, Opera 23+, Firefox 39+ */ url("../fonts/dm-sans-v11-latin-regular.woff") format("woff"); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+/* dm-sans-italic - latin */
+@font-face {
+	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+	font-family: "DM Sans";
+	font-style: italic;
+	font-weight: 400;
+	src: url("../fonts/dm-sans-v11-latin-italic.woff2") format("woff2"),
+		/* Chrome 36+, Opera 23+, Firefox 39+ */ url("../fonts/dm-sans-v11-latin-italic.woff") format("woff"); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+/* dm-sans-500 - latin */
+@font-face {
+	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+	font-family: "DM Sans";
+	font-style: normal;
+	font-weight: 500;
+	src: url("../fonts/dm-sans-v11-latin-500.woff2") format("woff2"),
+		/* Chrome 36+, Opera 23+, Firefox 39+ */ url("../fonts/dm-sans-v11-latin-500.woff") format("woff"); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+/* dm-sans-700 - latin */
+@font-face {
+	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
+	font-family: "DM Sans";
+	font-style: normal;
+	font-weight: 700;
+	src: url("../fonts/dm-sans-v11-latin-700.woff2") format("woff2"),
+		/* Chrome 36+, Opera 23+, Firefox 39+ */ url("../fonts/dm-sans-v11-latin-700.woff") format("woff"); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
diff --git a/src/sass/index.scss b/src/sass/index.scss
@@ -5,6 +5,7 @@
 @import "./utilities/placeholders";
 
 // Base styles
+@import "./base/fonts";
 @import "./base/resets";
 @import "./base/pagination.scss";
 
@@ -13,10 +14,10 @@
 @import "./components/slider";
 
 // Multipage styles
-@import './layouts/header';
-@import './layouts/dark-theme';
-@import './layouts/mobile-menu';
-@import './layouts/anchor-btn';
+@import "./layouts/header";
+@import "./layouts/dark-theme";
+@import "./layouts/mobile-menu";
+@import "./layouts/anchor-btn";
 
 // Index-Page styles
 @import "./layouts/category-set";
@@ -26,7 +27,7 @@
 @import "./layouts/_shop-list.scss";
 
 // Modal styles
-@import './layouts/modal/modals';
-@import './layouts/modal/register-modal';
-@import './layouts/modal/login-modal';
-@import './layouts/modal/about-book-modal';
+@import "./layouts/modal/modals";
+@import "./layouts/modal/register-modal";
+@import "./layouts/modal/login-modal";
+@import "./layouts/modal/about-book-modal";
diff --git a/src/shop-list.html b/src/shop-list.html
@@ -10,12 +10,6 @@
     />
     <title>Bookshelf</title>
     <link rel="stylesheet" href="./sass/index.scss" />
-    <link rel="preconnect" href="https://fonts.googleapis.com" />
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link
-      href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,700;1,400&display=swap"
-      rel="stylesheet"
-    />
   </head>
   <body class="light">
     <include src="./partials/components/favicon.html"></include>