fix: 修正8位颜色值的兼容性问题

src/common/reset.scss

@@ -3,78 +3,21 @@ body {
   font-family: sans-serif;
 }
 
-html,
-body,
-div,
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p,
-dl,
-dt,
-dd,
-ol,
-ul,
-li,
-fieldset,
-form,
-label,
-input,
-legend,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td,
-textarea,
-article,
-aside,
-audio,
-canvas,
-figure,
-footer,
-header,
-mark,
-menu,
-nav,
-section,
-time,
-video {
+html, body, div, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, ul, li, fieldset, form, label, input, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea, article, aside, audio, canvas, figure, footer, header, mark, menu, nav, section, time, video {
   margin: 0;
   padding: 0;
 }
 
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
+h1, h2, h3, h4, h5, h6 {
   font-size: 100%;
   font-weight: normal;
 }
 
-article,
-aside,
-dialog,
-figure,
-footer,
-header,
-hgroup,
-nav,
-section,
-blockquote {
+article, aside, dialog, figure, footer, header, hgroup, nav, section, blockquote {
   display: block;
 }
 
-ul,
-ol {
+ul, ol {
   list-style: none;
 }
 
@@ -83,15 +26,11 @@ img {
   vertical-align: top;
 }
 
-blockquote,
-q {
+blockquote, q {
   quotes: none;
 }
 
-blockquote:before,
-blockquote:after,
-q:before,
-q:after {
+blockquote:before, blockquote:after, q:before, q:after {
   content: none;
 }
 
@@ -100,9 +39,7 @@ table {
   border-spacing: 0;
 }
 
-strong,
-em,
-i {
+strong, em, i {
   font-style: normal;
   font-weight: normal;
 }
@@ -134,4 +71,4 @@ a {
 
 a:hover {
   text-decoration: underline;
-}
+}

src/common/tab-common.scss

@@ -19,13 +19,12 @@
   margin-bottom: 16px;
 }
 
-$submit-button-color: $theme-blue;
 
 .my-button {
   display: block;
   width: 120px;
   height: 40px;
-  background: $submit-button-color;
+  background: $theme-blue;
   color: white;
   border-radius: 8px;
   border: none;
@@ -34,11 +33,11 @@ $submit-button-color: $theme-blue;
   font-weight: 500;
 
   &:hover {
-    background: darken($submit-button-color, 5);
+    background: darken($theme-blue, 5);
   }
 
   &:active {
-    background: darken($submit-button-color, 10);
+    background: darken($theme-blue, 10);
   }
 }
 

src/views/reader/components/components/DiscussButtonSmall.vue

@@ -33,14 +33,13 @@ button {
 
   border-radius: 100px;
   backdrop-filter: saturate(180%) blur(20px);
-  background-color: #aaaaaa22;
-  transition: 0.2s background-color;
+  background-color: rgba(170, 170, 170, 0.13);
+  transition: 0.2s;
 
-  font-family: 'iconfont';
+  font-family: 'iconfont', sans-serif;
   font-size: 16px;
   font-weight: bold;
 
-  transition: 0.1s color;
   color: #777;
 
   & > div {

src/views/reader/components/components/MarkerButton.vue

@@ -33,14 +33,13 @@ button {
 
   border-radius: 100px;
   backdrop-filter: saturate(180%) blur(20px);
-  background-color: #aaaaaa22;
-  transition: 0.2s background-color;
+  background-color: rgba(170, 170, 170, 0.13);
+  transition: 0.2s;
 
-  font-family: 'iconfont';
+  font-family: 'iconfont', sans-serif;
   font-size: 16px;
   font-weight: bold;
 
-  transition: 0.1s color;
   color: #777;
 
   & > div {

src/views/reader/components/components/ReadModeButtonGroup.vue

@@ -70,11 +70,11 @@ button {
   width: 300px;
   border-radius: 100px;
   backdrop-filter: saturate(180%) blur(20px);
-  background-color: #aaaaaa22;
+  background-color: rgba(170, 170, 170, 0.13);
   transition: 0.2s background-color;
 
   &:hover {
-    background-color: #aaaaaa33;
+    background-color: rgba(170, 170, 170, 0.2);
   }
 
   &::before {
@@ -88,7 +88,7 @@ button {
     position: absolute;
     opacity: 0.8;
     background: #ffffff;
-    box-shadow: 0 1px 1px #00000022;
+    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.13);
     transition: 0.2s cubic-bezier(0, 0.5, 0.5, 1.25);
   }
 }

src/views/reader/components/components/ScalePad.vue

@@ -24,7 +24,7 @@ export default {}
 
   border-radius: 100px;
   backdrop-filter: saturate(180%) blur(20px);
-  background-color: #aaaaaa22;
+  background-color: rgba(170, 170, 170, 0.13);
   font-family: 'iconfont', sans-serif;
   font-size: 16px;
   font-weight: bold;