feat: replace close button with SVG icon and update styling for consi…

…stency
franciscodelahoz · Nov 4, 2024 · e3a55b0 · e3a55b0
1 parent 51191dd
commit e3a55b0
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 2 deletions.
diff --git a/src/html/index.html b/src/html/index.html
@@ -48,7 +48,7 @@
       </section>
     </main>
     <aside id="configuration-sidebar">
-      <button id="close-configurations-button" class="icon-button" aria-label="Close configurations">&#x2715;</button>
+      <button id="close-configurations-button" class="icon-button" aria-label="Close configurations"><%= require('../resources/close-button.svg') %></button>
       <div class="configuration-content">
         <section class="configuration-group">
           <h2 class="configuration-title">General Settings</h2>

diff --git a/src/resources/close-button.svg b/src/resources/close-button.svg
diff --git a/src/styles/style.css b/src/styles/style.css
@@ -90,6 +90,8 @@ body {
   user-select: none;
   cursor: pointer;
   flex-grow: 10;
+  font-family: Verdana;
+  font-size: 0.83rem;
 }
 
 .default-button {
@@ -103,6 +105,7 @@ body {
   background-color: #222222;
   color: #34ff66;
   font-family: Verdana;
+  font-size: 0.83rem;
 }
 
 .default-button:hover {
@@ -143,8 +146,10 @@ body {
   padding-top: 3px;
   padding-bottom: 3px;
   padding-left: .5rem;
-  padding-right: 1.5rem;
+  padding-right: 2rem;
   text-overflow: ellipsis;
+  font-family: Verdana;
+  font-size: 0.76rem;
 }
 
 .default-select:focus {