feat: new toggle ui

ineo6 · Dec 16, 2021 · bf8131b · bf8131b
1 parent d69f474
commit bf8131b
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 46 deletions.
diff --git a/src/common/adapters/adapter.less b/src/common/adapters/adapter.less
@@ -68,12 +68,12 @@
     line-height: 1;
     position: absolute;
 
-    left: -35px;
+    left: -30px;
     right: unset;
 
     text-align: center;
     top: 33%;
-    width: 35px;
+    width: 30px;
     z-index: @index-base;
     transition: right 0.25s ease-in 0.2s, opacity 0.35s ease-in 0.2s;
     cursor: pointer;

diff --git a/src/common/adapters/style/toggle.less b/src/common/adapters/style/toggle.less
@@ -1,19 +1,18 @@
 .toggle() {
   .gitmaster-toggle {
     background-color: #f2f5f7;
-    border-radius: 0 4px 4px 0;
+    border-radius: 0 6px 6px 0;
     border: 1px solid #e0e4e7;
     border-left: none;
     box-shadow: 2px 0 5px 0 rgba(118, 118, 118, 0.11);
     opacity: 1;
-    height: 74px;
     line-height: 1;
     padding: 16px 4px;
     position: absolute;
-    right: -35px;
+    right: -30px;
     text-align: center;
     top: 33%;
-    width: 35px;
+    width: 30px;
     z-index: @index-base;
     transition: right 0.25s ease-in 0.2s, opacity 0.35s ease-in 0.2s;
     cursor: pointer;
@@ -29,14 +28,19 @@
       height: 25px;
     }
 
-    > span {
-      color: @dark;
+    &-brand {
+      color: #6a6a6a;
       display: inline-block;
-      font-size: 12px;
-      left: -1px;
-      line-height: 14px;
+      pointer-events: none;
+      font-size: 14px;
       position: relative;
       top: 0;
+      transform: rotate(-180deg);
+      writing-mode: tb-rl;
+
+      > span {
+        color: rgb(255, 92, 0) !important;
+      }
     }
 
     .popup {

diff --git a/src/common/template/template.html b/src/common/template/template.html
@@ -1,40 +1,9 @@
 <div>
   <nav class="gitmaster-sidebar">
     <div class="gitmaster-toggle">
-      <svg
-        t="1583847324655"
-        class="toggle-icon"
-        viewBox="0 0 1024 1024"
-        version="1.1"
-        xmlns="http://www.w3.org/2000/svg"
-        p-id="1528"
-        width="25"
-        height="25"
-      >
-        <path
-          d="M835.52 424.78l-130.42 61.04 12.56-83.66-59.32-8.92-18.5 123.12-85.18 39.86v-190.18l168.84-84.6 110.7 58.6 28.08-53.04-73.7-39.02 42.18-142.48-57.52-17.04-35.1 118.52-74.62 37.4-7.72-67.78-59.6 6.76 10.18 89.66-51.72 25.92V123.16L613.2 32.6 562.8 0.02l-39.46 61.06-28.68 44.38v19.12l-79.76-22.02-44.2-86.26-53.4 27.36 56.22 109.74 121.14 33.42v228.7l-67.94-54.66 16.78-90.28-59-10.96-10.86 58.52-124.84-100.42-37.6 46.74 45.66 36.76-43.24 14.74-44.62-14.06-18 57.24 63.38 19.94 97.82-33.34 182.46 146.794v138.086l-201.2-157.76-100.74 36.18 20.28 56.46 69.54-24.96 95.98 75.26-72.8 20.16 16 57.82 115.48-31.98 57.46 45.06v131.58h60V622.46l163.72-76.62 90.42 53.14 30.4-51.72-54.9-32.26 76.66-35.88z"
-          fill="#725D57"
-          p-id="1529"
-        ></path>
-        <path
-          d="M860.96 479.12l-76.66 35.88 54.9 32.26-30.4 51.72-90.42-53.14-163.72 76.62v215.98h-31.32V61.08L562.8 0.02l50.4 32.58-58.54 90.56v175.78l51.72-25.92-10.18-89.66 59.6-6.76 7.72 67.78 74.62-37.4 35.1-118.52 57.52 17.04-42.18 142.48 73.7 39.02-28.08 53.04-110.7-58.6-168.84 84.6v190.18l85.18-39.86 18.5-123.12 59.32 8.92-12.56 83.66 130.42-61.04z"
-          fill="#53433F"
-          p-id="1530"
-        ></path>
-        <path
-          d="M862.76 794.718c-14.64 0-28.96 1.928-42.812 5.75-29.978-41.882-78.06-66.992-130.892-66.992-54.124 0-103.652 26.668-133.452 70.748-87.894 1.186-159.032 73.054-159.032 161.224 0 11.694 1.298 23.476 3.858 35.024l5.21 23.508h605.016l6.446-21.318A161.282 161.282 0 0 0 1024 955.958c0-88.908-72.332-161.24-161.24-161.24z"
-          fill="#e16531"
-          p-id="1531"
-        ></path>
-        <path
-          d="M466.188 794.718c-14.64 0-28.958 1.928-42.812 5.75-29.978-41.882-78.062-66.992-130.894-66.992-54.12 0-103.648 26.67-133.452 70.748C71.136 805.41 0 877.278 0 965.448a161.98 161.98 0 0 0 3.858 35.024l5.21 23.508h605.016l6.446-21.318a161.282 161.282 0 0 0 6.898-46.704c0-88.908-72.332-161.24-161.24-161.24z"
-          fill="#f3ca7e"
-          p-id="1532"
-        ></path>
-        <path d="M238.666 872.23h60v60.5h-60z" fill="#725D57" p-id="1533"></path>
-        <path d="M680.286 853.288h60v60.5h-60z" fill="#53433F" p-id="1534"></path>
-      </svg>
-      <span>Gm</span>
+      <div class="gitmaster-toggle-brand">
+        <span>G</span>it <span>M</span>aster
+      </div>
       <div class="popup">
         <div class="arrow"></div>
         <div class="content" data-i18n="welcome_tip"></div>