From 5cd4ec510d49207edcfa33ee3891c134af26efc4 Mon Sep 17 00:00:00 2001
From: Jakub Steiner <jimmac@gmail.com>
Date: Thu, 11 Apr 2019 14:50:56 +0200
Subject: [PATCH] Adwaita: generic type styles

- try to define a basic typographic structure

See https://gitlab.gnome.org/GNOME/gtk/issues/1808
---
 gtk/theme/Adwaita/_common.scss           | 25 ++++++++++++++++++++++++
 gtk/theme/Adwaita/gtk-contained-dark.css | 11 +++++++++++
 gtk/theme/Adwaita/gtk-contained.css      | 11 +++++++++++
 3 files changed, 47 insertions(+)

diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index e8f2409442..4f0977e259 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -260,6 +260,31 @@ spinner {
   }
 }
 
+/**********************
+ * General Typography *
+ **********************/
+
+.type-large-title {
+   font-weight: 300;
+   font-size: 24pt;
+   letter-spacing: 0.2rem;
+}
+.type-title {
+   font-weight: 600;
+   font-size: 16pt;
+}
+.type-heading {
+   font-weight: 500;
+   font-size: 11pt;
+}
+.type-body {
+   font-weight: 400;
+   font-size: 11pt;
+}
+.type-caption {
+   font-weight: 400;
+   font-size: 9pt;
+}
 
 /****************
  * Text Entries *
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 8dbbcb081a..d1cd399c48 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -93,6 +93,17 @@ spinner:checked { opacity: 1; animation: spin 1s linear infinite; }
 
 spinner:checked:disabled { opacity: 0.5; }
 
+/********************** General Typography * */
+.type-large-title { font-weight: 300; font-size: 24pt; letter-spacing: 0.2rem; }
+
+.type-title { font-weight: 600; font-size: 16pt; }
+
+.type-heading { font-weight: 500; font-size: 11pt; }
+
+.type-body { font-weight: 400; font-size: 11pt; }
+
+.type-caption { font-weight: 400; font-size: 9pt; }
+
 /**************** Text Entries * */
 spinbutton:not(.vertical), spinbutton.vertical text, entry { min-height: 32px; padding-left: 8px; padding-right: 8px; border: 1px solid; border-radius: 5px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: white; border-color: #1b1b1b; background-color: #2d2d2d; box-shadow: inset 0 0 0 1px rgba(21, 83, 158, 0); }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 1626af8d75..f3f09d395e 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -93,6 +93,17 @@ spinner:checked { opacity: 1; animation: spin 1s linear infinite; }
 
 spinner:checked:disabled { opacity: 0.5; }
 
+/********************** General Typography * */
+.type-large-title { font-weight: 300; font-size: 24pt; letter-spacing: 0.2rem; }
+
+.type-title { font-weight: 600; font-size: 16pt; }
+
+.type-heading { font-weight: 500; font-size: 11pt; }
+
+.type-body { font-weight: 400; font-size: 11pt; }
+
+.type-caption { font-weight: 400; font-size: 9pt; }
+
 /**************** Text Entries * */
 spinbutton:not(.vertical), spinbutton.vertical text, entry { min-height: 32px; padding-left: 8px; padding-right: 8px; border: 1px solid; border-radius: 5px; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: black; border-color: #cdc7c2; background-color: #ffffff; box-shadow: inset 0 0 0 1px rgba(53, 132, 228, 0); }