From 9e3e8d62ff269853b799d7e6f8ea205bbfc89b02 Mon Sep 17 00:00:00 2001 From: William Kelso Date: Tue, 13 May 2025 14:49:27 -0400 Subject: [PATCH 1/5] add terminal cssclass --- demo/Views/CSSView.vala | 5 +++-- lib/Constants.vala | 10 ++++++++++ lib/Styles/Granite/_classes.scss | 18 ++++++++++++++++++ 3 files changed, 31 insertions(+), 2 deletions(-) diff --git a/demo/Views/CSSView.vala b/demo/Views/CSSView.vala index 6e70df169..8b5321417 100644 --- a/demo/Views/CSSView.vala +++ b/demo/Views/CSSView.vala @@ -84,7 +84,8 @@ public class CSSView : DemoPage { card_box.append (card); card_box.append (card_checkered); - var terminal_label = new Granite.HeaderLabel ("\"terminal\" style class"); + var terminal_label = new Granite.HeaderLabel + ("\"Granite.CssClass.TERMINAL\""); var terminal = new Gtk.Label ("[ 73%] Linking C executable granite-demo\n[100%] Built target granite-demo") { selectable = true, @@ -97,7 +98,7 @@ public class CSSView : DemoPage { min_content_height = 70, child = terminal }; - terminal_scroll.add_css_class (Granite.STYLE_CLASS_TERMINAL); + terminal_scroll.add_css_class (Granite.CssClass.TERMINAL); var accent_color_label = new Granite.HeaderLabel ("Colored labels and icons"); diff --git a/lib/Constants.vala b/lib/Constants.vala index f7438e168..18f1e5760 100644 --- a/lib/Constants.vala +++ b/lib/Constants.vala @@ -131,6 +131,7 @@ namespace Granite { * When used with {@link Gtk.Label} this style includes internal padding. When used with {@link Gtk.TextView} * interal padding will need to be set with {@link Gtk.Container.border_width} */ + [Version (deprecated = true, deprecated_since = "7.7.0", replacement = "Granite.CssClass.TERMINAL")] public const string STYLE_CLASS_TERMINAL = "terminal"; /** * Style class for title label text in a {@link Granite.MessageDialog} @@ -290,6 +291,15 @@ namespace Granite { * Style class for non-terminal text that uses a monospace font. */ public const string MONOSPACE = "monospace"; + + /** + * Style class for {@link Gtk.Label} or {@link Gtk.TextView} to emulate the appearance of Terminal. This includes + * text color, background color, selection highlighting, and selecting the system monospace font. + * + * When used with {@link Gtk.Label} this style includes internal padding. When used with {@link Gtk.TextView} + * interal padding will need to be set with {@link Gtk.Container.border_width} + */ + public const string TERMINAL = "terminal"; } /** diff --git a/lib/Styles/Granite/_classes.scss b/lib/Styles/Granite/_classes.scss index eaf129810..05436f6ff 100644 --- a/lib/Styles/Granite/_classes.scss +++ b/lib/Styles/Granite/_classes.scss @@ -48,3 +48,21 @@ paper { font-family: monospace; } +.terminal { + font-family: monospace; + + background-color: $fg-color; + color: bg-color(0); + + padding: rem(12px) rem(18px); + + & selection { + background-color: bg-color(0); + color: $fg-color; + + &:backdrop { + // Cancelling values set in non-terminal selection + background-color: inherit; + } + } +} From e88620fa6fe892dc219d48d4d9d6ec109d7ba76b Mon Sep 17 00:00:00 2001 From: William Kelso Date: Wed, 25 Mar 2026 14:32:43 -0400 Subject: [PATCH 2/5] remove string constant --- lib/Constants.vala | 10 +--------- lib/Widgets/MessageDialog.vala | 4 +++- 2 files changed, 4 insertions(+), 10 deletions(-) diff --git a/lib/Constants.vala b/lib/Constants.vala index b2f8f0b9a..8257bcc68 100644 --- a/lib/Constants.vala +++ b/lib/Constants.vala @@ -131,7 +131,7 @@ namespace Granite { * When used with {@link Gtk.Label} this style includes internal padding. When used with {@link Gtk.TextView} * interal padding will need to be set with {@link Gtk.Container.border_width} */ - [Version (deprecated = true, deprecated_since = "7.7.0", replacement = "Granite.CssClass.TERMINAL")] + [Version (deprecated = true, deprecated_since = "9.0.0", replacement = "Granite.CssClass.TERMINAL")] public const string STYLE_CLASS_TERMINAL = "terminal"; /** * Style class for title label text in a {@link Granite.MessageDialog} @@ -299,14 +299,6 @@ namespace Granite { [Version (since = "7.7.0")] public const string MONOSPACE = "monospace"; - /** - * Style class for {@link Gtk.Label} or {@link Gtk.TextView} to emulate the appearance of Terminal. This includes - * text color, background color, selection highlighting, and selecting the system monospace font. - * - * When used with {@link Gtk.Label} this style includes internal padding. When used with {@link Gtk.TextView} - * interal padding will need to be set with {@link Gtk.Container.border_width} - */ - public const string TERMINAL = "terminal"; } /** diff --git a/lib/Widgets/MessageDialog.vala b/lib/Widgets/MessageDialog.vala index f0fdbaa08..17047512f 100644 --- a/lib/Widgets/MessageDialog.vala +++ b/lib/Widgets/MessageDialog.vala @@ -320,7 +320,9 @@ public class Granite.MessageDialog : Granite.Dialog { min_content_height = 70, child = details_view }; - scroll_box.add_css_class (Granite.STYLE_CLASS_TERMINAL); + // This is an undocumented style in the Granite stylesheet, not + // intended to be used outside of a few system contexts + scroll_box.add_css_class ("terminal"); expander = new Gtk.Expander (_("Details")) { child = scroll_box From d41a150e2deff821afb3307dccbfe287e8f965e6 Mon Sep 17 00:00:00 2001 From: William Kelso Date: Wed, 25 Mar 2026 14:33:31 -0400 Subject: [PATCH 3/5] clean errant newline --- lib/Constants.vala | 1 - 1 file changed, 1 deletion(-) diff --git a/lib/Constants.vala b/lib/Constants.vala index 8257bcc68..b153a70ee 100644 --- a/lib/Constants.vala +++ b/lib/Constants.vala @@ -298,7 +298,6 @@ namespace Granite { */ [Version (since = "7.7.0")] public const string MONOSPACE = "monospace"; - } /** From 028d6c811b492bbca894390bd5d2d62c2d3c629e Mon Sep 17 00:00:00 2001 From: William Kelso Date: Wed, 25 Mar 2026 14:34:45 -0400 Subject: [PATCH 4/5] terminal style class has no publicly documented replacement --- lib/Constants.vala | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/Constants.vala b/lib/Constants.vala index b153a70ee..273d5b007 100644 --- a/lib/Constants.vala +++ b/lib/Constants.vala @@ -131,7 +131,7 @@ namespace Granite { * When used with {@link Gtk.Label} this style includes internal padding. When used with {@link Gtk.TextView} * interal padding will need to be set with {@link Gtk.Container.border_width} */ - [Version (deprecated = true, deprecated_since = "9.0.0", replacement = "Granite.CssClass.TERMINAL")] + [Version (deprecated = true, deprecated_since = "9.0.0")] public const string STYLE_CLASS_TERMINAL = "terminal"; /** * Style class for title label text in a {@link Granite.MessageDialog} From 52473ce059229e0a562d15872b2b38255537db25 Mon Sep 17 00:00:00 2001 From: William Kelso Date: Wed, 25 Mar 2026 14:39:35 -0400 Subject: [PATCH 5/5] Remove terminal view from demo --- demo/Views/CSSView.vala | 18 ------------------ 1 file changed, 18 deletions(-) diff --git a/demo/Views/CSSView.vala b/demo/Views/CSSView.vala index 8b5321417..6ee453a60 100644 --- a/demo/Views/CSSView.vala +++ b/demo/Views/CSSView.vala @@ -84,22 +84,6 @@ public class CSSView : DemoPage { card_box.append (card); card_box.append (card_checkered); - var terminal_label = new Granite.HeaderLabel - ("\"Granite.CssClass.TERMINAL\""); - - var terminal = new Gtk.Label ("[ 73%] Linking C executable granite-demo\n[100%] Built target granite-demo") { - selectable = true, - wrap = true, - xalign = 0, - yalign = 0 - }; - - var terminal_scroll = new Gtk.ScrolledWindow () { - min_content_height = 70, - child = terminal - }; - terminal_scroll.add_css_class (Granite.CssClass.TERMINAL); - var accent_color_label = new Granite.HeaderLabel ("Colored labels and icons"); var accent_color_box = new Gtk.Box (HORIZONTAL, 6); @@ -140,8 +124,6 @@ public class CSSView : DemoPage { }; box.append (card_header); box.append (card_box); - box.append (terminal_label); - box.append (terminal_scroll); box.append (accent_color_label); box.append (accent_color_box); box.append (success_color_box);