feat: 新增主题

awehook · Mar 18, 2020 · 0afbe52 · 0afbe52
1 parent 8afd87a
commit 0afbe52
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 9 deletions.
diff --git a/src/blink-mind b/src/blink-mind
diff --git a/src/renderer/components/theme/create-from-theme.jsx b/src/renderer/components/theme/create-from-theme.jsx
@@ -1,7 +1,8 @@
 import React from 'react';
 import { useState } from 'react';
 import defaultThemeImg from '../../images/theme-default.jpg';
-import theme1Img from '../../images/theme-1.jpg';
+import themeDark1Img from '../../images/theme-dark1.jpg';
+// import theme1Img from '../../images/theme-1.jpg';
 import theme2Img from '../../images/theme-2.jpg';
 import theme3Img from '../../images/theme-3.jpg';
 import theme4Img from '../../images/theme-4.jpg';
@@ -19,10 +20,11 @@ export function CreateFromTheme(props) {
   const [selectedThemeKey, setSelectedThemeKey] = useState('default');
   const themes = [
     ['default', defaultThemeImg],
-    ['theme1', theme1Img],
+    // ['theme1', theme1Img],
     ['theme2', theme2Img],
     ['theme3', theme3Img],
     ['theme4', theme4Img],
+    ['dark-theme1', themeDark1Img],
     ['random-color-round', themeRandomColorRoundImg]
   ];
   const onClickThemeItem = themeKey => () => {
@@ -36,8 +38,8 @@ export function CreateFromTheme(props) {
     openFile();
   };
   return (
-    <div className='bm-column bm-card'>
-      <div className='theme-container'>
+    <div className="bm-column bm-card">
+      <div className="theme-container">
         {themes.map(themeConfig => {
           const themeKey = themeConfig[0];
           const theme = controller.run('getTheme', {
@@ -46,6 +48,7 @@ export function CreateFromTheme(props) {
           });
           const background = theme.background;
           const themeItemProps = {
+            key: themeKey,
             onClick: onClickThemeItem(themeKey),
             isSelected: selectedThemeKey === themeKey,
             themeImg: themeConfig[1],
@@ -57,7 +60,7 @@ export function CreateFromTheme(props) {
           return <ThemeItem {...themeItemProps} />;
         })}
       </div>
-      <div className='btn-container'>
+      <div className="btn-container">
         <Button onClick={onClickOpenFile}>{t(I18nTextKey.OPEN_FILE)}</Button>
         <Button onClick={onClickNewFile}>{t(I18nTextKey.NEW_FILE)}</Button>
       </div>

diff --git a/src/renderer/images/theme-dark1.jpg b/src/renderer/images/theme-dark1.jpg
diff --git a/src/renderer/images/theme-default.jpg b/src/renderer/images/theme-default.jpg
diff --git a/src/renderer/plugins/toolbar/toolbar-item-theme.jsx b/src/renderer/plugins/toolbar/toolbar-item-theme.jsx
@@ -1,5 +1,6 @@
 import defaultThemeImg from '../../images/theme-default.jpg';
-import theme1Img from '../../images/theme-1.jpg';
+import themeDark1Img from '../../images/theme-dark1.jpg';
+// import theme1Img from '../../images/theme-1.jpg';
 import theme2Img from '../../images/theme-2.jpg';
 import theme3Img from '../../images/theme-3.jpg';
 import theme4Img from '../../images/theme-4.jpg';
@@ -30,18 +31,19 @@ export function ToolbarItemTheme(props) {
   };
   const themes = [
     ['default', defaultThemeImg],
-    ['theme1', theme1Img],
+    // ['theme1', theme1Img],
     ['theme2', theme2Img],
     ['theme3', theme3Img],
     ['theme4', theme4Img],
+    ['dark-theme1', themeDark1Img],
     ['random-color-round', themeRandomColorRoundImg]
   ];
 
   return (
     <ToolbarItem
       key="theme-selector"
       iconName={IconName.THEME}
-      iconCxName='theme'
+      iconCxName="theme"
       {...props}
     >
       <Popover enforceFocus={false}>