From ab1bcfe3918751cad0d49ec4c6a150f8e17b78b9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ciar=C3=A1n=20Walsh?= <github@ciaranwal.sh>
Date: Fri, 18 Apr 2025 08:42:59 +0100
Subject: [PATCH] Implement client-side theming for OutputPanel scroll-down
 button. (#35913)

* Implement client-side theming for OutputPanel scroll-down button.

* Use OutputPanel constant for button class name

* Remove unused string

* Enable scroll button for ChatBox

* Update RobustToolbox

* Update to merged RT version
---
 Content.Client/Stylesheets/StyleNano.cs       |  16 ++++
 .../Systems/Chat/Widgets/ChatBox.xaml         |   2 +-
 .../Nano/rounded_button_half_bordered.svg     |  75 ++++++++++++++++++
 ...rounded_button_half_bordered.svg.96dpi.png | Bin 0 -> 292 bytes
 4 files changed, 92 insertions(+), 1 deletion(-)
 create mode 100644 Resources/Textures/Interface/Nano/rounded_button_half_bordered.svg
 create mode 100644 Resources/Textures/Interface/Nano/rounded_button_half_bordered.svg.96dpi.png

diff --git a/Content.Client/Stylesheets/StyleNano.cs b/Content.Client/Stylesheets/StyleNano.cs
index 55e7ec0949..40d256813e 100644
--- a/Content.Client/Stylesheets/StyleNano.cs
+++ b/Content.Client/Stylesheets/StyleNano.cs
@@ -344,6 +344,16 @@ namespace Content.Client.Stylesheets
             chatFilterButton.SetPatchMargin(StyleBox.Margin.All, 5);
             chatFilterButton.SetPadding(StyleBox.Margin.All, 2);
 
+            var outputPanelScrollDownButtonTex = resCache.GetTexture("/Textures/Interface/Nano/rounded_button_half_bordered.svg.96dpi.png");
+            var outputPanelScrollDownButton = new StyleBoxTexture
+            {
+                Texture = outputPanelScrollDownButtonTex,
+            };
+            outputPanelScrollDownButton.SetPatchMargin(StyleBox.Margin.All, 5);
+            outputPanelScrollDownButton.SetPadding(StyleBox.Margin.All, 2);
+            outputPanelScrollDownButton.SetPadding(StyleBox.Margin.Top, 0);
+            outputPanelScrollDownButton.SetPadding(StyleBox.Margin.Bottom, 0);
+
             var smallButtonTex = resCache.GetTexture("/Textures/Interface/Nano/button_small.svg.96dpi.png");
             var smallButtonBase = new StyleBoxTexture
             {
@@ -1307,6 +1317,7 @@ namespace Content.Client.Stylesheets
                 {
                     new StyleProperty(Button.StylePropertyStyleBox, chatChannelButton),
                 }),
+
                 // chat filter button
                 new StyleRule(new SelectorElement(typeof(ContainerButton), new[] {StyleClassChatFilterOptionButton}, null, null), new[]
                 {
@@ -1329,6 +1340,11 @@ namespace Content.Client.Stylesheets
                     new StyleProperty(Control.StylePropertyModulateSelf, ButtonColorDisabled),
                 }),
 
+                // output panel scroll button
+                Element<Button>()
+                    .Class(OutputPanel.StyleClassOutputPanelScrollDownButton)
+                    .Prop(Button.StylePropertyStyleBox, outputPanelScrollDownButton),
+
                 // OptionButton
                 new StyleRule(new SelectorElement(typeof(OptionButton), null, null, null), new[]
                 {
diff --git a/Content.Client/UserInterface/Systems/Chat/Widgets/ChatBox.xaml b/Content.Client/UserInterface/Systems/Chat/Widgets/ChatBox.xaml
index 36cdce8598..31cf35bfbd 100644
--- a/Content.Client/UserInterface/Systems/Chat/Widgets/ChatBox.xaml
+++ b/Content.Client/UserInterface/Systems/Chat/Widgets/ChatBox.xaml
@@ -10,7 +10,7 @@
     <PanelContainer Name="ChatWindowPanel" Access="Public" HorizontalExpand="True" VerticalExpand="True"
                     StyleClasses="StyleNano.StyleClassChatPanel">
         <BoxContainer Orientation="Vertical" SeparationOverride="4" HorizontalExpand="True" VerticalExpand="True">
-            <OutputPanel Name="Contents" HorizontalExpand="True" VerticalExpand="True" Margin="8 8 8 4" />
+            <OutputPanel Name="Contents" HorizontalExpand="True" VerticalExpand="True" Margin="8 8 8 4" ShowScrollDownButton="True" />
             <controls:ChatInputBox HorizontalExpand="True" Name="ChatInput" Access="Public" Margin="2"/>
         </BoxContainer>
     </PanelContainer>
diff --git a/Resources/Textures/Interface/Nano/rounded_button_half_bordered.svg b/Resources/Textures/Interface/Nano/rounded_button_half_bordered.svg
new file mode 100644
index 0000000000..a583f3db89
--- /dev/null
+++ b/Resources/Textures/Interface/Nano/rounded_button_half_bordered.svg
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="32"
+   height="32"
+   viewBox="0 0 32 32"
+   fill="none"
+   version="1.1"
+   id="svg4"
+   sodipodi:docname="rounded_button_half_bordered.svg"
+   inkscape:version="1.0.1 (3bc2e813f5, 2020-09-07)"
+   inkscape:export-filename="C:\ss14\space-station-14\Resources\Textures\Interface\Nano\rounded_button_half_bordered.svg.96dpi.png"
+   inkscape:export-xdpi="96"
+   inkscape:export-ydpi="96">
+   <metadata
+      id="metadata10">
+      <rdf:RDF>
+         <cc:Work
+            rdf:about="">
+            <dc:format>image/svg+xml</dc:format>
+            <dc:type
+               rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+            <dc:title />
+         </cc:Work>
+      </rdf:RDF>
+   </metadata>
+   <defs
+      id="defs8">
+      <clipPath id="round-corner">
+         <rect x="0" y="0" width="32" height="32" rx="5" ry="5" />
+      </clipPath>
+   </defs>
+   <sodipodi:namedview
+      pagecolor="#ffffff"
+      bordercolor="#666666"
+      borderopacity="1"
+      objecttolerance="10"
+      gridtolerance="10"
+      guidetolerance="10"
+      inkscape:pageopacity="0"
+      inkscape:pageshadow="2"
+      inkscape:window-width="2560"
+      inkscape:window-height="1377"
+      id="namedview6"
+      showgrid="false"
+      fit-margin-top="0"
+      fit-margin-left="0"
+      fit-margin-right="0"
+      fit-margin-bottom="0"
+      inkscape:zoom="11.136932"
+      inkscape:cx="15.825633"
+      inkscape:cy="16.930202"
+      inkscape:window-x="1912"
+      inkscape:window-y="-8"
+      inkscape:window-maximized="1"
+      inkscape:current-layer="svg4"
+      inkscape:document-rotation="0"
+      inkscape:pagecheckerboard="true" />
+   <rect
+      x="0"
+      y="0"
+      width="32"
+      height="50"
+      rx="5"
+      fill="#ffffff"
+      id="rect2"
+      style="stroke:#cfcfcf;stroke-opacity:1;fill:#ffffff;fill-opacity:1"
+   />
+</svg>
\ No newline at end of file
diff --git a/Resources/Textures/Interface/Nano/rounded_button_half_bordered.svg.96dpi.png b/Resources/Textures/Interface/Nano/rounded_button_half_bordered.svg.96dpi.png
new file mode 100644
index 0000000000000000000000000000000000000000..1d8b1d08abc2dd20444562d11e19c92fa3516b16
GIT binary patch
literal 292
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE1|*BCs=fdz&H|6fVg?4j!ywFfJby(BP*AeO
zHKHUqKdq!Zu_%?Hyu4g5GcUV1Ik6yBFTW^#_B$IXprVbQE{-7)t#2=F<UM2{(3<!>
z$4_P7j%6ioCs;Hi8wF=JFiI#)vvJgVp)08(eAGliF(YG=$#?w^`zEhDVafeGX89B=
zrKF`>^%xVB(=ui)bMN^$FR1IWh1{)ew&Jz-%Y#k@Up5Jiy<Yt0pNNydVS_tG=YAim
zuHSm?-88BHPB9FE;=BJCC-*qGFezz?$Je{ML{A7h_o?9jk||CR*?(l2B@QsK88k5R
gBrt%PYxpXdraUxo?vu2S0y>_-)78&qol`;+0JVc@p8x;=

literal 0
HcmV?d00001