From: Sven <sven.hoehn@posteo.de>
Date: Thu, 11 May 2017 06:17:25 +0000 (+0200)
Subject: Bug 11335 modified font smoothing and weight
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=2d8cbd13eb9f160d3a61a70a32b11e88b42af0f6;p=ipfire.org.git

Bug 11335 modified font smoothing and weight
---

diff --git a/static/css/style.css b/static/css/style.css
index 4cd10169..91193d89 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -220,7 +220,7 @@ html {
 body {
   font-family: "Ubuntu", sans-serif;
   font-size: 1rem;
-  font-weight: 300;
+  font-weight: 400;
   line-height: 1.5;
   color: #263238;
   background-color: #eceff1; }
@@ -432,7 +432,7 @@ hr {
 small,
 .small {
   font-size: 0.875rem;
-  font-weight: 300; }
+  font-weight: 400; }
 
 mark,
 .mark {
@@ -1670,7 +1670,7 @@ fieldset[disabled] a.btn {
     border-color: #d9534f; }
 
 .btn-link {
-  font-weight: 300;
+  font-weight: 400;
   color: #b71c1c;
   border-radius: 0; }
   .btn-link, .btn-link:active, .btn-link.active, .btn-link:disabled {
@@ -4846,7 +4846,7 @@ a.bg-inverse:focus, a.bg-inverse:hover {
   text-transform: capitalize !important; }
 
 .font-weight-normal {
-  font-weight: 300; }
+  font-weight: 400; }
 
 .font-weight-bold {
   font-weight: 500; }
@@ -4969,6 +4969,76 @@ a.text-gray-dark:focus, a.text-gray-dark:hover {
   .hidden-print {
     display: none !important; } }
 
+body {
+  font-smoothing: antialiased; }
+
+h1 {
+  line-height: 3rem; }
+
+h2 {
+  line-height: 2.75rem; }
+
+h3 {
+  line-height: 2rem; }
+  @media (max-width: 767px) {
+    h3 {
+      font-size: 1em; } }
+
+h4 {
+  font-weight: 500;
+  line-height: 1.75rem; }
+  @media (max-width: 767px) {
+    h4 {
+      font-size: 1em; } }
+
+h5 {
+  line-height: 1.5rem; }
+
+p {
+  line-height: 1.5rem; }
+  @media (max-width: 767px) {
+    p {
+      font-size: .85em; } }
+  p.lead {
+    line-height: 2rem; }
+    @media (max-width: 991px) {
+      p.lead {
+        font-size: 1.5rem;
+        line-height: 2rem; } }
+    @media (max-width: 767px) {
+      p.lead {
+        font-size: 1rem;
+        line-height: 1.5rem; } }
+
+.display-2 {
+  margin-bottom: 4rem; }
+  @media (max-width: 991px) {
+    .display-2 {
+      font-size: 2.5rem;
+      line-height: 3.5rem;
+      margin-bottom: 3rem; } }
+  @media (max-width: 767px) {
+    .display-2 {
+      font-size: 2rem;
+      line-height: 2.75rem; } }
+
+@media (max-width: 575px) {
+  .display-4 {
+    font-size: .875rem;
+    line-height: 1.25rem; } }
+
+small {
+  line-height: 1rem; }
+  @media (max-width: 767px) {
+    small {
+      font-size: .75em; } }
+
+.truncate {
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis; }
+
 #mask {
   width: 100vw;
   height: 100vh;
@@ -5260,73 +5330,6 @@ button:focus {
 .amber-800 {
   color: #ff8f00; }
 
-h1 {
-  line-height: 3rem; }
-
-h2 {
-  line-height: 2.75rem; }
-
-h3 {
-  line-height: 2rem; }
-  @media (max-width: 767px) {
-    h3 {
-      font-size: 1em; } }
-
-h4 {
-  font-weight: 500;
-  line-height: 1.75rem; }
-  @media (max-width: 767px) {
-    h4 {
-      font-size: 1em; } }
-
-h5 {
-  line-height: 1.5rem; }
-
-p {
-  line-height: 1.5rem; }
-  @media (max-width: 767px) {
-    p {
-      font-size: .85em; } }
-  p.lead {
-    line-height: 2rem; }
-    @media (max-width: 991px) {
-      p.lead {
-        font-size: 1.5rem;
-        line-height: 2rem; } }
-    @media (max-width: 767px) {
-      p.lead {
-        font-size: 1rem;
-        line-height: 1.5rem; } }
-
-.display-2 {
-  margin-bottom: 4rem; }
-  @media (max-width: 991px) {
-    .display-2 {
-      font-size: 2.5rem;
-      line-height: 3.5rem;
-      margin-bottom: 3rem; } }
-  @media (max-width: 767px) {
-    .display-2 {
-      font-size: 2rem;
-      line-height: 2.75rem; } }
-
-@media (max-width: 575px) {
-  .display-4 {
-    font-size: .875rem;
-    line-height: 1.25rem; } }
-
-small {
-  line-height: 1rem; }
-  @media (max-width: 767px) {
-    small {
-      font-size: .75em; } }
-
-.truncate {
-  width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis; }
-
 img.img-fluid {
   width: 100%;
   max-width: 100%;
diff --git a/static/scss/bootstrap-4.0.0-alpha.6/scss/_custom.scss b/static/scss/bootstrap-4.0.0-alpha.6/scss/_custom.scss
index 52396978..6d50852b 100755
--- a/static/scss/bootstrap-4.0.0-alpha.6/scss/_custom.scss
+++ b/static/scss/bootstrap-4.0.0-alpha.6/scss/_custom.scss
@@ -101,7 +101,7 @@ $font-family-base:       $font-family-sans-serif;
 
 $font-size-lg:   1.25rem;
 
-$font-weight-normal: 300;
+$font-weight-normal: 400;
 $font-weight-bold: 500;
 
 $font-weight-base: $font-weight-normal;
diff --git a/static/scss/style.scss b/static/scss/style.scss
index 27ab0e99..18621ad4 100644
--- a/static/scss/style.scss
+++ b/static/scss/style.scss
@@ -54,7 +54,8 @@
 @import "bootstrap-4.0.0-alpha.6/scss/utilities";
 
 // Custom stuff
-@import '_custom_nav';
+@import '_fonts';
+@import '_nav';
 @import '_buttons';
 
 
@@ -63,86 +64,6 @@
 	color: $amber-800;
 }
 
-// Fonts
-h1 {
-	line-height: 3rem;
-}
-
-h2 {
-	line-height: 2.75rem;
-}
-
-h3 {
-	line-height: 2rem;
-	@include media-breakpoint-down(sm) {
-		font-size: 1em;
-	}
-}
-
-h4 {
-	font-weight: 500;
-	line-height: 1.75rem;
-	@include media-breakpoint-down(sm) {
-		font-size: 1em;
-	}
-}
-
-h5 {
-	line-height: 1.5rem;
-}
-
-p {
-	line-height: 1.5rem;
-	@include media-breakpoint-down(sm) {
-		font-size: .85em;
-	}
-	&.lead {
-		line-height: 2rem;
-		@include media-breakpoint-down(md) {
-			font-size: 1.5rem;
-			line-height: 2rem;
-		}
-		@include media-breakpoint-down(sm) {
-			font-size: 1rem;
-			line-height: 1.5rem;
-		}
-	}
-}
-
-.display-2 {
-	margin-bottom: 4rem;
-	@include media-breakpoint-down(md) {
-		font-size: 2.5rem;
-		line-height: 3.5rem;
-		margin-bottom: 3rem;
-	}
-	@include media-breakpoint-down(sm) {
-		font-size: 2rem;
-		line-height: 2.75rem;
-	}
-}
-
-.display-4 {
-	@include media-breakpoint-down(xs) {
-		font-size: .875rem;
-		line-height: 1.25rem;
-	}
-}
-
-small {
-	line-height: 1rem;
-	@include media-breakpoint-down(sm) {
-		font-size: .75em;
-	}
-}
-
-.truncate {
-  width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
 // Images
 img {
 	&.img-fluid {