fix: use borders instead of box-shadow. closes #53

oae · Sep 11, 2022 · 7997bb8 · 7997bb8
1 parent 93641cd
commit 7997bb8
Show file tree

Hide file tree

Showing 13 changed files with 87 additions and 80 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -23,5 +23,25 @@
         "cmd": "#yarn run build:ts && yarn run shell:restart"
       }
     ]
-  }
+  },
+  "workbench.colorCustomizations": {
+    "activityBar.activeBackground": "#832460",
+    "activityBar.background": "#832460",
+    "activityBar.foreground": "#e7e7e7",
+    "activityBar.inactiveForeground": "#e7e7e799",
+    "activityBarBadge.background": "#121907",
+    "activityBarBadge.foreground": "#e7e7e7",
+    "commandCenter.border": "#e7e7e799",
+    "sash.hoverBorder": "#832460",
+    "statusBar.background": "#5b1943",
+    "statusBar.foreground": "#e7e7e7",
+    "statusBarItem.hoverBackground": "#832460",
+    "statusBarItem.remoteBackground": "#5b1943",
+    "statusBarItem.remoteForeground": "#e7e7e7",
+    "titleBar.activeBackground": "#5b1943",
+    "titleBar.activeForeground": "#e7e7e7",
+    "titleBar.inactiveBackground": "#5b194399",
+    "titleBar.inactiveForeground": "#e7e7e799"
+  },
+  "peacock.color": "#5b1943"
 }
diff --git a/resources/po/ar.po b/resources/po/ar.po
@@ -13,7 +13,7 @@ msgid "Clear"
 msgstr "امحُ"
 
 #: src/components/indicator/clearHistoryDialog.ts:33
-#: src/components/indicator/settingsMenu.ts:68
+#: src/components/indicator/settingsMenu.ts:67
 #: src/prefs/dangerZone/clearHistory.ts:11
 msgid "Clear History"
 msgstr "امحُ السجل التاريخي"
@@ -23,15 +23,15 @@ msgstr "امحُ السجل التاريخي"
 msgid "Are you sure you want to clear history?"
 msgstr "أمتأكد من رغبتك بمحوِ السجل التاريخي؟"
 
-#: src/components/indicator/settingsMenu.ts:44
+#: src/components/indicator/settingsMenu.ts:43
 msgid "Toggle Pano"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:52
+#: src/components/indicator/settingsMenu.ts:51
 msgid "Incognito Mode"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:75
+#: src/components/indicator/settingsMenu.ts:74
 msgid "Settings"
 msgstr ""
 

diff --git a/resources/po/en.po b/resources/po/en.po
@@ -13,7 +13,7 @@ msgid "Clear"
 msgstr "Clear"
 
 #: src/components/indicator/clearHistoryDialog.ts:33
-#: src/components/indicator/settingsMenu.ts:68
+#: src/components/indicator/settingsMenu.ts:67
 #: src/prefs/dangerZone/clearHistory.ts:11
 msgid "Clear History"
 msgstr "Clear History"
@@ -23,15 +23,15 @@ msgstr "Clear History"
 msgid "Are you sure you want to clear history?"
 msgstr "Are you sure you want to clear history?"
 
-#: src/components/indicator/settingsMenu.ts:44
+#: src/components/indicator/settingsMenu.ts:43
 msgid "Toggle Pano"
 msgstr "Toggle Pano"
 
-#: src/components/indicator/settingsMenu.ts:52
+#: src/components/indicator/settingsMenu.ts:51
 msgid "Incognito Mode"
 msgstr "Incognito Mode"
 
-#: src/components/indicator/settingsMenu.ts:75
+#: src/components/indicator/settingsMenu.ts:74
 msgid "Settings"
 msgstr "Settings"
 

diff --git a/resources/po/fr.po b/resources/po/fr.po
@@ -13,7 +13,7 @@ msgid "Clear"
 msgstr "Vider"
 
 #: src/components/indicator/clearHistoryDialog.ts:33
-#: src/components/indicator/settingsMenu.ts:68
+#: src/components/indicator/settingsMenu.ts:67
 #: src/prefs/dangerZone/clearHistory.ts:11
 msgid "Clear History"
 msgstr "Vider l'historique"
@@ -23,15 +23,15 @@ msgstr "Vider l'historique"
 msgid "Are you sure you want to clear history?"
 msgstr "Êtes-vous sûr de vouloir vider l'historique ?"
 
-#: src/components/indicator/settingsMenu.ts:44
+#: src/components/indicator/settingsMenu.ts:43
 msgid "Toggle Pano"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:52
+#: src/components/indicator/settingsMenu.ts:51
 msgid "Incognito Mode"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:75
+#: src/components/indicator/settingsMenu.ts:74
 msgid "Settings"
 msgstr ""
 

diff --git a/resources/po/hr.po b/resources/po/hr.po
@@ -13,7 +13,7 @@ msgid "Clear"
 msgstr "Ukloni"
 
 #: src/components/indicator/clearHistoryDialog.ts:33
-#: src/components/indicator/settingsMenu.ts:68
+#: src/components/indicator/settingsMenu.ts:67
 #: src/prefs/dangerZone/clearHistory.ts:11
 msgid "Clear History"
 msgstr "Ukloni povijest"
@@ -23,15 +23,15 @@ msgstr "Ukloni povijest"
 msgid "Are you sure you want to clear history?"
 msgstr "Sigurno želite ukloniti povijest?"
 
-#: src/components/indicator/settingsMenu.ts:44
+#: src/components/indicator/settingsMenu.ts:43
 msgid "Toggle Pano"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:52
+#: src/components/indicator/settingsMenu.ts:51
 msgid "Incognito Mode"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:75
+#: src/components/indicator/settingsMenu.ts:74
 msgid "Settings"
 msgstr ""
 

diff --git a/resources/po/oc.po b/resources/po/oc.po
@@ -13,7 +13,7 @@ msgid "Clear"
 msgstr "Escafar"
 
 #: src/components/indicator/clearHistoryDialog.ts:33
-#: src/components/indicator/settingsMenu.ts:68
+#: src/components/indicator/settingsMenu.ts:67
 #: src/prefs/dangerZone/clearHistory.ts:11
 msgid "Clear History"
 msgstr "Escafar l’istoric"
@@ -23,15 +23,15 @@ msgstr "Escafar l’istoric"
 msgid "Are you sure you want to clear history?"
 msgstr "Volètz vertadièrament escafar l’istoric ?"
 
-#: src/components/indicator/settingsMenu.ts:44
+#: src/components/indicator/settingsMenu.ts:43
 msgid "Toggle Pano"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:52
+#: src/components/indicator/settingsMenu.ts:51
 msgid "Incognito Mode"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:75
+#: src/components/indicator/settingsMenu.ts:74
 msgid "Settings"
 msgstr ""
 

diff --git a/resources/po/pano@elhan.io.pot b/resources/po/pano@elhan.io.pot
@@ -37,7 +37,7 @@ msgid "Clear"
 msgstr ""
 
 #: src/components/indicator/clearHistoryDialog.ts:33
-#: src/components/indicator/settingsMenu.ts:68
+#: src/components/indicator/settingsMenu.ts:67
 #: src/prefs/dangerZone/clearHistory.ts:11
 msgid "Clear History"
 msgstr ""
@@ -78,7 +78,7 @@ msgstr ""
 msgid "History Length"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:52
+#: src/components/indicator/settingsMenu.ts:51
 msgid "Incognito Mode"
 msgstr ""
 
@@ -116,7 +116,7 @@ msgstr ""
 msgid "Select a shortcut"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:75
+#: src/components/indicator/settingsMenu.ts:74
 msgid "Settings"
 msgstr ""
 
@@ -128,7 +128,7 @@ msgstr ""
 msgid "Shows an indicator on top panel"
 msgstr ""
 
-#: src/components/indicator/settingsMenu.ts:44
+#: src/components/indicator/settingsMenu.ts:43
 msgid "Toggle Pano"
 msgstr ""
 

diff --git a/resources/po/tr.po b/resources/po/tr.po
@@ -13,7 +13,7 @@ msgid "Clear"
 msgstr "Temizle"
 
 #: src/components/indicator/clearHistoryDialog.ts:33
-#: src/components/indicator/settingsMenu.ts:68
+#: src/components/indicator/settingsMenu.ts:67
 #: src/prefs/dangerZone/clearHistory.ts:11
 msgid "Clear History"
 msgstr "Geçmişi Temizle"
@@ -23,15 +23,15 @@ msgstr "Geçmişi Temizle"
 msgid "Are you sure you want to clear history?"
 msgstr "Geçmişi temizlemek istediğine emin misiniz?"
 
-#: src/components/indicator/settingsMenu.ts:44
+#: src/components/indicator/settingsMenu.ts:43
 msgid "Toggle Pano"
 msgstr "Pano'yu Aç"
 
-#: src/components/indicator/settingsMenu.ts:52
+#: src/components/indicator/settingsMenu.ts:51
 msgid "Incognito Mode"
 msgstr "Gizli Mod"
 
-#: src/components/indicator/settingsMenu.ts:75
+#: src/components/indicator/settingsMenu.ts:74
 msgid "Settings"
 msgstr "Ayarlar"
 

diff --git a/src/components/colorPanoItem.ts b/src/components/colorPanoItem.ts
@@ -17,7 +17,8 @@ export class ColorPanoItem extends PanoItem {
       y_expand: true,
       y_align: ActorAlign.FILL,
       x_align: ActorAlign.FILL,
-      style: `border-radius: 0px 0px 10px 10px; background-color: ${this.dbItem.content};`,
+      style_class: 'color-container',
+      style: `background-color: ${this.dbItem.content};`,
     });
 
     colorContainer.add_child(
@@ -27,7 +28,7 @@ export class ColorPanoItem extends PanoItem {
         x_expand: true,
         y_expand: true,
         text: this.dbItem.content,
-        style: 'font-size: 16px; border-radius: 999px; background-color: black; color: white; padding: 10px',
+        style_class: 'color-label',
       }),
     );
 

diff --git a/src/components/indicator/settingsMenu.ts b/src/components/indicator/settingsMenu.ts
@@ -35,8 +35,7 @@ export class SettingsMenu extends PopupMenuButton {
       gicon: icon_new_for_string(
         `${getCurrentExtension().path}/icons/indicator${isInIncognito ? '-incognito' : ''}.svg`,
       ),
-      style: 'padding: 0px; margin: 0px;',
-      style_class: 'system-status-icon',
+      style_class: 'system-status-icon indicator-icon',
     });
 
     this.add_child(icon);

diff --git a/src/components/linkPanoItem.ts b/src/components/linkPanoItem.ts
@@ -69,7 +69,8 @@ export class LinkPanoItem extends PanoItem {
       y_expand: true,
       y_align: ActorAlign.FILL,
       x_align: ActorAlign.FILL,
-      style: `background-image: url(${imageFilePath}); background-size: cover; border-radius: 1px 1px 0px 0px;`,
+      style_class: 'image-container',
+      style: `background-image: url(${imageFilePath});`,
     });
 
     metaContainer.add_child(titleLabel);

diff --git a/src/components/panoItem.ts b/src/components/panoItem.ts
@@ -1,6 +1,4 @@
 import {
-  ActorAlign,
-  AnimationMode,
   ButtonEvent,
   EVENT_PROPAGATE,
   EVENT_STOP,
@@ -42,7 +40,6 @@ export class PanoItem extends BoxLayout {
   };
 
   private header: PanoItemHeader;
-  private indicatorBox: BoxLayout;
   private timeoutId: number | undefined;
   protected body: BoxLayout;
   public dbItem: DBItem;
@@ -58,16 +55,6 @@ export class PanoItem extends BoxLayout {
       track_hover: true,
     });
 
-    this.indicatorBox = new BoxLayout({
-      visible: true,
-      x_align: ActorAlign.CENTER,
-      y_align: ActorAlign.END,
-      height: 0,
-      width: 0,
-      translation_y: 5,
-      style: 'background: #1e66f5; border-radius: 999px; box-shadow: 0px 0px 2px 1px #1e66f5;',
-    });
-
     this.dbItem = dbItem;
 
     this.connect('key-focus-in', () => this.setSelected(true));
@@ -117,37 +104,14 @@ export class PanoItem extends BoxLayout {
 
     this.add_child(this.header);
     this.add_child(this.body);
-    this.add_child(this.indicatorBox);
   }
 
   private setSelected(selected: boolean) {
     if (selected) {
       this.add_style_pseudo_class('selected');
-      this.indicatorBox.ease({
-        height: 5,
-        width: 290,
-        duration: 150,
-        mode: AnimationMode.EASE_OUT_QUAD,
-      });
-      this.ease({
-        translation_y: -5,
-        duration: 150,
-        mode: AnimationMode.EASE_OUT_QUAD,
-      });
       this.grab_key_focus();
     } else {
       this.remove_style_pseudo_class('selected');
-      this.indicatorBox.ease({
-        height: 0,
-        width: 0,
-        duration: 150,
-        mode: AnimationMode.EASE_OUT_QUAD,
-      });
-      this.ease({
-        translation_y: 0,
-        duration: 150,
-        mode: AnimationMode.EASE_OUT_QUAD,
-      });
     }
   }
   override vfunc_key_press_event(event: KeyEvent): boolean {
@@ -176,7 +140,6 @@ export class PanoItem extends BoxLayout {
       Source.remove(this.timeoutId);
     }
     this.header.destroy();
-    this.indicatorBox.destroy();
     super.destroy();
   }
 }