Introduce `--fonts-main` CSS variable for easier customization of main fonts (#41321, #41569).

Patch by Takashi Kato (user:tohosaku).


git-svn-id: https://svn.redmine.org/redmine/trunk@23159 e93f8b46-1217-0410-a6f0-8f06a7374b81

4 files changed, 22 insertions, 10 deletions

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 9bff4f48f..e8242c6ca 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -22,11 +22,15 @@
   font-display: swap;
 }
 
+:root {
+  --fonts-main: "Noto Sans", sans-serif;
+}
+
 html, body { min-height: 100vh; }
 html {overflow-y:scroll;}
-body { font-family: "Noto Sans", sans-serif; font-size: 0.875rem; color:#333; margin: 0; padding: 0; min-width: 900px; }
+body { font-family: var(--fonts-main); font-size: 0.875rem; color:#333; margin: 0; padding: 0; min-width: 900px; }
 
-h1, h2, h3, h4, h5, h6 {font-family: "Noto Sans", sans-serif;padding: 2px 10px 1px 0px;margin: 0 0 10px 0;}
+h1, h2, h3, h4, h5, h6 {font-family: var(--fonts-main);padding: 2px 10px 1px 0px;margin: 0 0 10px 0;}
 #content h1, h2, h3, h4, h5, h6 {color: #555;}
 h2 {font-size: 1.25rem;}
 h3 {font-size: 1.0625rem;}
@@ -595,7 +599,7 @@ blockquote blockquote { margin-left: 0;}
 abbr, span.field-description[title] { border-bottom: 1px dotted #aaa; cursor: help; }
 textarea.wiki-edit {width:99%; resize:vertical; box-sizing: border-box;}
 body.textarea-monospace textarea.wiki-edit {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace; font-size: 0.75rem;}
-body.textarea-proportional textarea.wiki-edit {font-family: "Noto Sans", sans-serif; font-size:  0.75rem;}
+body.textarea-proportional textarea.wiki-edit {font-family: var(--fonts-main); font-size:  0.75rem;}
 li p {margin-top: 0;}
 div.issue {
   background: #ffffdd;
@@ -820,7 +824,7 @@ ul.projects div.description ul li {list-style-type:initial;}
 }
 #projects-index ul.projects li.child {margin-top: 1em;}
 #projects-index ul.projects div.root a.project {
-  font-family: "Noto Sans", sans-serif;
+  font-family: var(--fonts-main);
   font-weight: bold;
   font-size: 1rem;
   margin: 0 0 10px 0;
diff --git a/app/assets/stylesheets/responsive.css b/app/assets/stylesheets/responsive.css
index df3f8e51e..ea30ab86c 100644
--- a/app/assets/stylesheets/responsive.css
+++ b/app/assets/stylesheets/responsive.css
@@ -155,7 +155,7 @@
   }
   #project-jump .drdn-trigger:before {
     /* set a font-size in order to achive same result in different themes */
-    font-family: "Noto Sans", sans-serif;
+    font-family: var(--fonts-main);
     font-size: 1.5em;
 
     position: absolute;
@@ -253,7 +253,7 @@
   }
 
   .mobile-toggle-button:after {
-    font-family: "Noto Sans", sans-serif;
+    font-family: var(--fonts-main);
     display: block;
     margin-top: -3px;
     content: '\2261';
@@ -261,7 +261,7 @@
 
   /* search magnifier icon */
   .search-magnifier {
-    font-family: "Noto Sans", sans-serif;
+    font-family: var(--fonts-main);
     color: #bbb;
 
     cursor: pointer;
diff --git a/app/assets/stylesheets/wiki_syntax.css b/app/assets/stylesheets/wiki_syntax.css
index 27ee3d198..868dbe4cc 100644
--- a/app/assets/stylesheets/wiki_syntax.css
+++ b/app/assets/stylesheets/wiki_syntax.css
@@ -16,8 +16,12 @@
     font-display: swap;
 }
 
-h1 { font-family: "Noto Sans", sans-serif; font-size: 0.875rem; text-align: center; color: #444; }
-body { font-family: "Noto Sans", sans-serif; font-size: 0.75rem; color: #444; }
+:root {
+  --fonts-main: "Noto Sans", sans-serif;
+}
+
+h1 { font-family: var(--fonts-main); font-size: 0.875rem; text-align: center; color: #444; }
+body { font-family: var(--fonts-main); font-size: 0.75rem; color: #444; }
 pre, code {font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace; }
 table th { padding-top: 1em; }
 table th {
diff --git a/app/assets/stylesheets/wiki_syntax_detailed.css b/app/assets/stylesheets/wiki_syntax_detailed.css
index e88c61755..7d7c30f53 100644
--- a/app/assets/stylesheets/wiki_syntax_detailed.css
+++ b/app/assets/stylesheets/wiki_syntax_detailed.css
@@ -16,7 +16,11 @@
     font-display: swap;
 }
 
-body { font-family: "Noto Sans", sans-serif; font-size: 0.875rem; color:#333; line-height: 1.6;}
+:root {
+  --fonts-main: "Noto Sans", sans-serif;
+}
+
+body { font-family: var(--fonts-main); font-size: 0.875rem; color:#333; line-height: 1.6;}
 pre, code { font-family: Consolas, Menlo, "Liberation Mono", Courier, monospace; }
 pre {
     margin: 1em 1em 1em 1.6em;