diff options
author | Bennett <hello@vantezzen.io> | 2020-04-05 09:33:23 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2020-04-05 08:33:23 +0100 |
commit | 5e53776f9b4f932b2eedebcd3b23ec95a66bf110 (patch) | |
tree | 421b301b3378a93926940dc798fcf88a323a1b55 /src/features/appearance/index.js | |
parent | #490 Add option to start Ferdi minimized (#534) (diff) | |
download | ferdium-app-5e53776f9b4f932b2eedebcd3b23ec95a66bf110.tar.gz ferdium-app-5e53776f9b4f932b2eedebcd3b23ec95a66bf110.tar.zst ferdium-app-5e53776f9b4f932b2eedebcd3b23ec95a66bf110.zip |
* #304 Add option to show draggable window area
* Address merge conflicts
* Re-apply npm run manage-translations
Co-authored-by: Amine Mouafik <amine@mouafik.fr>
Diffstat (limited to 'src/features/appearance/index.js')
-rw-r--r-- | src/features/appearance/index.js | 29 |
1 files changed, 29 insertions, 0 deletions
diff --git a/src/features/appearance/index.js b/src/features/appearance/index.js index 6dcdfc986..a14d1461e 100644 --- a/src/features/appearance/index.js +++ b/src/features/appearance/index.js | |||
@@ -63,6 +63,22 @@ function generateServiceRibbonWidthStyle(widthStr, iconSizeStr) { | |||
63 | `; | 63 | `; |
64 | } | 64 | } |
65 | 65 | ||
66 | function generateShowDragAreaStyle(accentColor) { | ||
67 | return ` | ||
68 | .sidebar { | ||
69 | padding-top: 0px !important; | ||
70 | } | ||
71 | .window-draggable { | ||
72 | position: initial; | ||
73 | background-color: ${accentColor}; | ||
74 | } | ||
75 | #root { | ||
76 | /** Remove 22px from app height, otherwise the page will be to high */ | ||
77 | height: calc(100% - 22px); | ||
78 | } | ||
79 | `; | ||
80 | } | ||
81 | |||
66 | function generateStyle(settings) { | 82 | function generateStyle(settings) { |
67 | let style = ''; | 83 | let style = ''; |
68 | 84 | ||
@@ -70,6 +86,7 @@ function generateStyle(settings) { | |||
70 | accentColor, | 86 | accentColor, |
71 | serviceRibbonWidth, | 87 | serviceRibbonWidth, |
72 | iconSize, | 88 | iconSize, |
89 | showDragArea, | ||
73 | } = settings; | 90 | } = settings; |
74 | 91 | ||
75 | if (accentColor !== DEFAULT_APP_SETTINGS.accentColor) { | 92 | if (accentColor !== DEFAULT_APP_SETTINGS.accentColor) { |
@@ -79,6 +96,9 @@ function generateStyle(settings) { | |||
79 | || iconSize !== DEFAULT_APP_SETTINGS.iconSize) { | 96 | || iconSize !== DEFAULT_APP_SETTINGS.iconSize) { |
80 | style += generateServiceRibbonWidthStyle(serviceRibbonWidth, iconSize); | 97 | style += generateServiceRibbonWidthStyle(serviceRibbonWidth, iconSize); |
81 | } | 98 | } |
99 | if (showDragArea) { | ||
100 | style += generateShowDragAreaStyle(accentColor); | ||
101 | } | ||
82 | 102 | ||
83 | return style; | 103 | return style; |
84 | } | 104 | } |
@@ -121,4 +141,13 @@ export default function initAppearance(stores) { | |||
121 | updateStyle(settings.all.app); | 141 | updateStyle(settings.all.app); |
122 | }, | 142 | }, |
123 | ); | 143 | ); |
144 | // Update draggable area | ||
145 | reaction( | ||
146 | () => ( | ||
147 | settings.all.app.showDragArea | ||
148 | ), | ||
149 | () => { | ||
150 | updateStyle(settings.all.app); | ||
151 | }, | ||
152 | ); | ||
124 | } | 153 | } |