From 6e6b2ea87b4e7f3f8d9e578a40895becb36580d9 Mon Sep 17 00:00:00 2001
From: Eliseu Amaro <mail@eliseuama.ro>
Date: Sun, 22 Aug 2021 16:26:19 +0100
Subject: [PATCH] [CSS][Icons] Icons width and height wasn't consistent,
 problem lied within the SVGs themselves.

---
 public/assets/css/base.css         | 36 ++++------------
 public/assets/css/left/left.css    |  6 +++
 public/assets/css/reset.css        |  5 +--
 public/assets/icons/logo.svg.twig  | 58 ++++++++++++++++++++++++--
 public/assets/icons/menu.svg.twig  | 58 ++++++++++++++++++++++++--
 public/assets/icons/notes.svg.twig | 67 ++++++++++++++++++++++++++++--
 6 files changed, 188 insertions(+), 42 deletions(-)

diff --git a/public/assets/css/base.css b/public/assets/css/base.css
index e5c25ddd44..449e091e4a 100644
--- a/public/assets/css/base.css
+++ b/public/assets/css/base.css
@@ -45,7 +45,6 @@
     z-index: 1;
 
     height: 3rem;
-    font-size: var(--main-size);
     display: flex;
     position: fixed;
     top: 0;
@@ -71,20 +70,18 @@
     margin-right: auto;
 }
 
+#instance h1 {
+    margin-left: 4px;
+}
+
 #instance:focus svg,
 #instance:hover svg {
     fill: var(--bg1);
     transition: var(--cubic-transition);
 }
 
-.icon-logo {
-    margin-right: var(--small-size);
-    fill: var(--white);
-}
-
 .panel aside {
     font-size: var(--medium-size);
-    display: block;
     position: absolute;
     top: 100%;
 
@@ -93,22 +90,15 @@
     padding: var(--unit-size);
 }
 
-.panel aside .footer {
-    bottom: var(--unit-size);
-    left: var(--unit-size);
-    font-size: var(--small-size);
-}
-#header:above-level.panel[open] ~ * {
-    display: none;
-}
-
 .icon {
     fill: var(--white);
+    width: 1em;
+    height: 1em;
 }
 
 /* CURRENT PAGE LINK */
 .active {
-    border-radius: var(--unit-size);
+    border-radius: 4px;
     background: var(--white);
     color: var(--bg1) !important;
     transition: var(--cubic-transition);
@@ -284,16 +274,6 @@
         max-width: 100%;
     }
 
-    /* we need to control panel's view at this size */
-    .icon-left,
-    .icon-right {
-        display: flex;
-        align-self: center;
-        align-items: center;
-        width: 1em;
-        height: 1em;
-    }
-
     /* by default they are hidden */
     .panel aside {
         display: none;
@@ -306,7 +286,6 @@
     .panel[open] {
         display: flex;
         flex-direction: column;
-        font-size: var(--main-size);
     }
     .panel[open] aside {
         padding: var(--unit-size);
@@ -320,7 +299,6 @@
         background-repeat: no-repeat;
         background-size: 100% 100%;
         min-height: 100%;
-
     }
 
     .panel[open] aside .footer {
diff --git a/public/assets/css/left/left.css b/public/assets/css/left/left.css
index af0ed5cfd2..12d3f75f38 100644
--- a/public/assets/css/left/left.css
+++ b/public/assets/css/left/left.css
@@ -95,4 +95,10 @@
     display: flex;
     flex-direction: column;
 }
+.sec-nav {
+    padding-left: var(--unit-size);
+}
 
+.footer * {
+    font-size: var(--small-size);
+}
diff --git a/public/assets/css/reset.css b/public/assets/css/reset.css
index 8abe9820d8..b70698e13b 100644
--- a/public/assets/css/reset.css
+++ b/public/assets/css/reset.css
@@ -150,7 +150,7 @@ li {
 a {
     text-decoration: none;
     color: var(--white);
-    border-radius: var(--unit-size);
+    border-radius: 4px;
 
     padding-left: var(--unit-size);
     padding-right: var(--unit-size);
@@ -180,10 +180,9 @@ figcaption a:link {
 
 summary:hover > svg,
 summary:focus > svg {
-    border-radius: var(--unit-size);
+    border-radius: 4px;
     background-color: var(--white);
     fill: var(--bg1);
-    border: 2px solid var(--white);
     transition: var(--cubic-transition);
 }
 
diff --git a/public/assets/icons/logo.svg.twig b/public/assets/icons/logo.svg.twig
index 13105dd328..98efb7dadb 100644
--- a/public/assets/icons/logo.svg.twig
+++ b/public/assets/icons/logo.svg.twig
@@ -1,6 +1,58 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" class="{{ iconClass|default('') }}">
-<title>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   class="{{ iconClass|default('') }}"
+   viewBox="0 0 16 16"
+   width="16"
+   height="16"
+   version="1.1"
+   id="svg6"
+   sodipodi:docname="logo.svg"
+   inkscape:version="1.1 (c4e8f9ed74, 2021-05-24)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs10" />
+  <sodipodi:namedview
+     id="namedview8"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     showgrid="false"
+     width="16px"
+     inkscape:zoom="7.2107905"
+     inkscape:cx="-29.955107"
+     inkscape:cy="30.232469"
+     inkscape:window-width="1920"
+     inkscape:window-height="1016"
+     inkscape:window-x="0"
+     inkscape:window-y="36"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg6" />
+  <title
+     id="title2">
     {{ config('site', 'name') }}
 </title>
-<path d="M14.225 29.263c1.48-.748 2.909-2.155 3.451-3.398.827-1.893 1.068-1.818-5.781-1.818-6.744 0-7.349-.115-8.593-1.628-.61-.742-.633-1.086-.633-9.456 0-8.422.02-8.713.651-9.562 1.2-1.613 1.699-1.679 12.7-1.679 11.005 0 11.456.062 12.71 1.748.566.761.6 1.3.6 9.493 0 8.37-.023 8.715-.633 9.456-.909 1.105-2.149 1.628-3.864 1.628-1.331 0-1.517.078-1.681.703-.249.95-1.56 2.395-2.912 3.212-1.363.823-4.873 1.889-6.166 1.871l-.953-.013zm5.475-8.691c1.193-.547 2.345-2.309 2.627-4.017.135-.818.175-1.554.09-1.636-.308-.294-5.508-.153-5.508.15 0 .165-.186 1.211.05 1.752.31.711 1.031.333 1.608.408.496.065.767.336.352.875-.364.472-.79.578-2.292.57-1.599-.009-2.145-.173-2.784-.735-.708-.623-.728-1.11-.826-3.188-.133-2.808.201-3.318 2.359-3.602 1.79-.236 3.638.109 4.14 1.164.299.628.194.74 1.31.74 1.54 0 1.643-.426 1.047-1.992-.385-1.013-.726-.77-.284-1.661.764-1.541.606-2.617-.564-3.839-1.151-1.202-1.664-1.118-1.102.18.202.466.322 1.221.268 1.676-.077.645-.273.848-.882.916-.436.049-.956-.112-1.173-.362-.449-.518-1.263-.587-1.724-.146-.221.212-.56.198-1.12-.046-.676-.295-.894-.27-1.384.154-.32.277-.9.461-1.289.408-.624-.085-.705-.249-.69-1.4.009-.718.126-1.533.26-1.812.413-.864-.597-.598-1.462.385-.91 1.034-1.07 2.938-.332 3.946.407.556.083.645-.145 1.877-1.099 5.937.04 8.144 3.019 9.304 1.949.759 4.694.73 6.434-.068z"/>
+  <path
+     d="M 6.9900123,15.675447 C 7.83238,15.249709 8.6457213,14.448891 8.9542101,13.741415 9.4249113,12.663981 9.562081,12.706668 5.6638515,12.706668 c -3.8384667,0 -4.1828131,-0.06545 -4.89085768,-0.926605 C 0.42580152,11.35774 0.4127107,11.161947 0.4127107,6.3980138 c 0,-4.79353 0.0113834,-4.9591578 0.37052813,-5.44238122 C 1.4662401,0.03756508 1.7502547,3.4146019e-8 8.0116686,3.4146019e-8 14.275358,3.4146019e-8 14.532053,0.03528851 15.245789,0.99490515 c 0.322149,0.43313655 0.3415,0.73991795 0.3415,5.40310865 0,4.7639332 -0.01309,4.9602962 -0.360283,5.3820492 -0.517374,0.62893 -1.223141,0.926605 -2.199264,0.926605 -0.757562,0 -0.863427,0.0444 -0.956771,0.400125 -0.141723,0.54071 -0.887901,1.363157 -1.657416,1.828167 -0.7757747,0.468424 -2.7735536,1.075157 -3.509487,1.064912 l -0.5424168,-0.0074 z m 3.1161927,-4.946636 c 0.679017,-0.311335 1.334698,-1.314208 1.495203,-2.2863465 0.07684,-0.4655798 0.0996,-0.884487 0.05122,-0.9311588 -0.175303,-0.1673352 -3.1349746,-0.087082 -3.1349746,0.085375 0,0.093913 -0.1058655,0.6892627 0.028462,0.9971814 C 8.7225578,8.9985406 9.1329277,8.7833955 9.4613369,8.8260834 9.7436439,8.8630814 9.8978893,9.017323 9.661685,9.3241046 9.4545112,9.5927521 9.2120461,9.6530834 8.3571558,9.6485301 7.4470538,9.6434077 7.1362884,9.5500641 6.7725902,9.2301921 6.3696195,8.875601 6.3582361,8.5984165 6.3024577,7.4156856 6.2267584,5.8174628 6.4168605,5.5271873 7.6451238,5.3655437 c 1.0188108,-0.1343236 2.070632,0.062039 2.3563542,0.6625112 0.170181,0.3574372 0.110418,0.421184 0.74561,0.421184 0.876518,0 0.935142,-0.2424654 0.595918,-1.133782 C 11.123876,4.7388901 10.92979,4.8771979 11.181362,4.3700694 11.616206,3.4929821 11.526278,2.8805577 10.860352,2.1850348 10.20524,1.5008952 9.9132573,1.5487053 10.23313,2.287485 10.348101,2.552717 10.416401,2.9824386 10.385665,3.24141 10.34184,3.6085231 10.230284,3.7240641 9.8836603,3.7627676 9.6355032,3.7906568 9.3395363,3.6990208 9.2160266,3.5567288 8.9604706,3.2619 8.4971679,3.2226274 8.2347823,3.4736304 8.1089955,3.594294 7.9160479,3.5863256 7.5973144,3.4474486 7.2125569,3.2795442 7.0884782,3.2937734 6.8095861,3.5351005 6.6274525,3.6927599 6.2973352,3.7974867 6.075929,3.7673209 5.7207684,3.7189417 5.6746658,3.6255982 5.6832033,2.9704861 5.6883258,2.5618238 5.7549185,2.0979522 5.8311868,1.9391543 6.0662531,1.4473935 5.4913938,1.5987921 4.9990638,2.1582839 4.4811212,2.7468032 4.3900543,3.8304985 4.8101001,4.4042195 c 0.2316513,0.3164572 0.047241,0.3671131 -0.08253,1.0683277 -0.6255152,3.3791482 0.022767,4.6353018 1.7183172,5.2955358 1.1093075,0.431999 2.6716727,0.415493 3.6620237,-0.0387 z"
+     id="path4"
+     style="stroke-width:0.569167" />
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:title>
+    {{ config('site', 'name') }}
+</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
 </svg>
diff --git a/public/assets/icons/menu.svg.twig b/public/assets/icons/menu.svg.twig
index 38c914d74b..b48b032c8e 100644
--- a/public/assets/icons/menu.svg.twig
+++ b/public/assets/icons/menu.svg.twig
@@ -1,6 +1,58 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <!-- https://github.com/primer/octicons -->
+
 <!-- MIT License -->
-<svg class="{{ iconClass|default('') }}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1em 1em">
-<title>Open left sidepanel.</title>
-<path fill-rule="evenodd" d="M1 2.75A.75.75 0 011.75 2h12.5a.75.75 0 110 1.5H1.75A.75.75 0 011 2.75zm0 5A.75.75 0 011.75 7h12.5a.75.75 0 110 1.5H1.75A.75.75 0 011 7.75zM1.75 12a.75.75 0 100 1.5h12.5a.75.75 0 100-1.5H1.75z"/>
+
+<svg
+   class="{{ iconClass|default('') }}"
+   viewBox="0 0 16 16"
+   width="16"
+   height="16"
+   version="1.1"
+   id="svg6"
+   sodipodi:docname="menu.svg"
+   inkscape:version="1.1 (c4e8f9ed74, 2021-05-24)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs10" />
+  <sodipodi:namedview
+     id="namedview8"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     showgrid="false"
+     inkscape:zoom="12.150261"
+     inkscape:cx="15.637524"
+     inkscape:cy="21.563323"
+     inkscape:window-width="1920"
+     inkscape:window-height="1016"
+     inkscape:window-x="0"
+     inkscape:window-y="36"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg6" />
+  <title
+     id="title2">Open left sidepanel.</title>
+  <path
+     fill-rule="evenodd"
+     d="M 0.9999891,2.9999916 A 0.75000111,0.75000111 0 0 1 1.7499903,2.2499909 H 14.25001 a 0.75000111,0.75000111 0 1 1 0,1.5000021 H 1.7499903 A 0.75000111,0.75000111 0 0 1 0.9999891,2.9999916 Z m 0,5.0000076 A 0.75000111,0.75000111 0 0 1 1.7499903,7.2499981 H 14.25001 a 0.7500013,0.7500013 0 1 1 0,1.5000024 H 1.7499903 A 0.75000111,0.75000111 0 0 1 0.9999891,7.9999992 Z m 0.7500012,4.2500058 a 0.75000231,0.75000231 0 1 0 0,1.500004 H 14.25001 a 0.75000231,0.75000231 0 1 0 0,-1.500004 z"
+     id="path4"
+     style="stroke-width:1" />
+  <metadata
+     id="metadata12">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:title>Open left sidepanel.</dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
 </svg>
diff --git a/public/assets/icons/notes.svg.twig b/public/assets/icons/notes.svg.twig
index 05ff4afad6..62abda80fb 100644
--- a/public/assets/icons/notes.svg.twig
+++ b/public/assets/icons/notes.svg.twig
@@ -1,9 +1,68 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <!-- https://github.com/primer/octicons -->
+
 <!-- MIT License -->
-<svg xmlns="http://www.w3.org/2000/svg" class="{{ iconClass|default('') }}" viewBox="0 0 1em 1em">
-    <title>
+
+<svg
+   class="{{ iconClass|default('') }}"
+   viewBox="0 0 16 16"
+   width="16"
+   height="16"
+   version="1.1"
+   id="svg8"
+   sodipodi:docname="notes.svg"
+   inkscape:version="1.1 (c4e8f9ed74, 2021-05-24)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <defs
+     id="defs12" />
+  <sodipodi:namedview
+     id="namedview10"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     showgrid="false"
+     inkscape:zoom="6.6503072"
+     inkscape:cx="2.2555349"
+     inkscape:cy="27.818264"
+     inkscape:window-width="1920"
+     inkscape:window-height="1016"
+     inkscape:window-x="0"
+     inkscape:window-y="36"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg8" />
+  <title
+     id="title2">
         Create a note
     </title>
-    <path fill-rule="evenodd" d="M1.75 1A1.75 1.75 0 000 2.75v9.5C0 13.216.784 14 1.75 14H3v1.543a1.457 1.457 0 002.487 1.03L8.061 14h6.189A1.75 1.75 0 0016 12.25v-9.5A1.75 1.75 0 0014.25 1H1.75zM1.5 2.75a.25.25 0 01.25-.25h12.5a.25.25 0 01.25.25v9.5a.25.25 0 01-.25.25h-6.5a.75.75 0 00-.53.22L4.5 15.44v-2.19a.75.75 0 00-.75-.75h-2a.25.25 0 01-.25-.25v-9.5z"/>
-    <path d="M22.5 8.75a.25.25 0 00-.25-.25h-3.5a.75.75 0 010-1.5h3.5c.966 0 1.75.784 1.75 1.75v9.5A1.75 1.75 0 0122.25 20H21v1.543a1.457 1.457 0 01-2.487 1.03L15.939 20H10.75A1.75 1.75 0 019 18.25v-1.465a.75.75 0 011.5 0v1.465c0 .138.112.25.25.25h5.5a.75.75 0 01.53.22l2.72 2.72v-2.19a.75.75 0 01.75-.75h2a.25.25 0 00.25-.25v-9.5z"/>
+  <g
+     id="g20"
+     transform="matrix(0.66666667,0,0,0.66666667,-4e-8,1.6962954e-4)">
+    <path
+       fill-rule="evenodd"
+       d="M 1.75,1 A 1.75,1.75 0 0 0 0,2.75 v 9.5 C 0,13.216 0.784,14 1.75,14 H 3 v 1.543 a 1.457,1.457 0 0 0 2.487,1.03 L 8.061,14 H 14.25 A 1.75,1.75 0 0 0 16,12.25 V 2.75 A 1.75,1.75 0 0 0 14.25,1 Z M 1.5,2.75 A 0.25,0.25 0 0 1 1.75,2.5 h 12.5 a 0.25,0.25 0 0 1 0.25,0.25 v 9.5 A 0.25,0.25 0 0 1 14.25,12.5 H 7.75 A 0.75,0.75 0 0 0 7.22,12.72 L 4.5,15.44 V 13.25 A 0.75,0.75 0 0 0 3.75,12.5 h -2 A 0.25,0.25 0 0 1 1.5,12.25 Z"
+       id="path4" />
+    <path
+       d="M 22.5,8.75 A 0.25,0.25 0 0 0 22.25,8.5 h -3.5 a 0.75,0.75 0 0 1 0,-1.5 h 3.5 C 23.216,7 24,7.784 24,8.75 v 9.5 A 1.75,1.75 0 0 1 22.25,20 H 21 v 1.543 a 1.457,1.457 0 0 1 -2.487,1.03 L 15.939,20 H 10.75 A 1.75,1.75 0 0 1 9,18.25 v -1.465 a 0.75,0.75 0 0 1 1.5,0 v 1.465 c 0,0.138 0.112,0.25 0.25,0.25 h 5.5 a 0.75,0.75 0 0 1 0.53,0.22 l 2.72,2.72 v -2.19 a 0.75,0.75 0 0 1 0.75,-0.75 h 2 a 0.25,0.25 0 0 0 0.25,-0.25 z"
+       id="path6" />
+  </g>
+  <metadata
+     id="metadata16">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:title>
+        Create a note
+    </dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
 </svg>