首頁 探索 說明
登入
hugh
/
jsoncrack.com
1
0
複刻 0
檔案 問題管理 0 合併請求 0 Wiki
瀏覽代碼

fix theme scroll background

AykutSarac 3 年之前
父節點
3c93371503
當前提交
9e33ff60c8
共有 6 個文件被更改，包括 31 次插入 和 16 次删除
分割檢視 顯示文件統計
  1. 1 1
      src/components/Button/index.tsx
  2. 0 11
      src/constants/globalStyle.ts
  3. 4 2
      src/constants/theme.ts
  4. 15 2
      src/pages/editor/index.tsx
  5. 10 0
      src/pages/index.tsx
  6. 1 0
      src/typings/styled.d.ts

+ 1 - 1
src/components/Button/index.tsx
查看文件 

@@ -2,7 +2,7 @@ import React from "react";
 
 import styled, { DefaultTheme } from "styled-components";

 

 enum ButtonType {

-  PRIMARY = "SILVER_DARK",

+  PRIMARY = "PRIMARY",

   SECONDARY = "BLURPLE",

   DANGER = "DANGER",

   SUCCESS = "SEAGREEN",

+ 0 - 11
src/constants/globalStyle.ts
查看文件 

@@ -12,17 +12,6 @@ const GlobalStyle = createGlobalStyle`
 
     font-size: 16px;
 
   }
 
 
-
 
-  ::-webkit-scrollbar {
 
-    width: 8px;
 
-    background: ${({ theme }) => theme.BLACK_SECONDARY};
 
-  }
 
-
 
-  ::-webkit-scrollbar-thumb {
 
-    border-radius: 5px;
 
-    background-color: ${({ theme }) => theme.SILVER_DARK};
 
-  }
 
-
 
   a {
 
     text-decoration: none;
 
     color: unset;

+ 4 - 2
src/constants/theme.ts
查看文件 

@@ -16,6 +16,7 @@ export const darkTheme: DefaultTheme = {
 
   ORANGE: "#FAA81A",
 
   SILVER: "#B9BBBE",
 
   SILVER_DARK: "#4D4D4D",
 
+  PRIMARY: "#4D4D4D",
 
 
   INTERACTIVE_NORMAL: "#b9bbbe",
 
   INTERACTIVE_HOVER: "#dcddde",
 
@@ -37,7 +38,7 @@ export const lightTheme: DefaultTheme = {
 
   BLACK_DARK: "#2C2F33",
 
   BLACK_LIGHT: "#2F3136",
 
   BLACK_PRIMARY: "#36393f",
 
-  BLACK_SECONDARY: "#23272A",
 
+  BLACK_SECONDARY: "#F2F2F2",
 
   CRIMSON: "#DC143C",
 
   DARK_SALMON: "#E9967A",
 
   DANGER: "#db662e",
 
@@ -45,7 +46,8 @@ export const lightTheme: DefaultTheme = {
 
   SEAGREEN: "#3BA55D",
 
   ORANGE: "#FAA81A",
 
   SILVER: "#B9BBBE",
 
-  SILVER_DARK: "#4D4D4D",
 
+  SILVER_DARK: "#CCCCCC",
 
+  PRIMARY: "#4D4D4D",
 
 
   INTERACTIVE_NORMAL: "#4f5660",
 
   INTERACTIVE_HOVER: "#2e3338",

+ 15 - 2
src/pages/editor/index.tsx
查看文件 

@@ -1,10 +1,23 @@
 
 import React from "react";

 import Head from "next/head";

 import { Editor } from "src/containers/Editor";

+import styled from "styled-components";

+

+const StyledEditorWrapper = styled.div`

+  *::-webkit-scrollbar {

+    width: 8px;

+    background: ${({ theme }) => theme.BLACK_SECONDARY};

+  }

+

+  *::-webkit-scrollbar-thumb {

+    border-radius: 5px;

+    background-color: ${({ theme }) => theme.SILVER_DARK};

+  }

+`;

 

 const EditorPage: React.FC = () => {

   return (

-    <>

+    <StyledEditorWrapper>

       <Head>

         <title>Editor | JSON Visio</title>

         <meta

@@ -13,7 +26,7 @@ const EditorPage: React.FC = () => {
 
         />

       </Head>

       <Editor />

-    </>

+    </StyledEditorWrapper>

   );

 };

+ 10 - 0
src/pages/index.tsx
查看文件 

@@ -12,6 +12,16 @@ import { useRouter } from "next/router";
 
 

 const StyledHome = styled.div`

   padding: 24px;

+

+  ::-webkit-scrollbar {

+    width: 8px;

+    background: #23272a !important;

+  }

+

+  ::-webkit-scrollbar-thumb {

+    border-radius: 5px;

+    background-color: #4d4d4d !important;

+  }

 `;

 

 const StyledContent = styled.div`

+ 1 - 0
src/typings/styled.d.ts
查看文件 

@@ -24,6 +24,7 @@ declare module "styled-components" {
 
     ORANGE: string;
 
     SILVER: string;
 
     SILVER_DARK: string;
 
+    PRIMARY: string;
 
 
     INTERACTIVE_NORMAL: string;
 
     INTERACTIVE_HOVER: string;