From 84efef710ee9dcc0225f0831182d03d4bc0cafd5 Mon Sep 17 00:00:00 2001 From: Fabio Manganiello Date: Tue, 10 Oct 2023 00:39:27 +0200 Subject: [PATCH] Added `Tabs` and `Tab` UI elements. --- .../webapp/src/components/elements/Tab.vue | 56 +++++++++++++++++++ .../webapp/src/components/elements/Tabs.vue | 23 ++++++++ .../http/webapp/src/style/themes/light.scss | 5 ++ 3 files changed, 84 insertions(+) create mode 100644 platypush/backend/http/webapp/src/components/elements/Tab.vue create mode 100644 platypush/backend/http/webapp/src/components/elements/Tabs.vue diff --git a/platypush/backend/http/webapp/src/components/elements/Tab.vue b/platypush/backend/http/webapp/src/components/elements/Tab.vue new file mode 100644 index 0000000000..bd33aab575 --- /dev/null +++ b/platypush/backend/http/webapp/src/components/elements/Tab.vue @@ -0,0 +1,56 @@ + + + + + diff --git a/platypush/backend/http/webapp/src/components/elements/Tabs.vue b/platypush/backend/http/webapp/src/components/elements/Tabs.vue new file mode 100644 index 0000000000..404d2123a6 --- /dev/null +++ b/platypush/backend/http/webapp/src/components/elements/Tabs.vue @@ -0,0 +1,23 @@ + + + + + diff --git a/platypush/backend/http/webapp/src/style/themes/light.scss b/platypush/backend/http/webapp/src/style/themes/light.scss index 3810ab2572..98afc5c546 100644 --- a/platypush/backend/http/webapp/src/style/themes/light.scss +++ b/platypush/backend/http/webapp/src/style/themes/light.scss @@ -12,6 +12,7 @@ $default-fg: black !default; $default-fg-2: #23513a !default; $default-fg-3: #195331b3 !default; $header-bg: linear-gradient(0deg, #c0e8e4, #e4f8f4) !default; +$header-bg-2: linear-gradient(90deg, #f3f3f3, white) !default; $no-items-color: #555555; //// Notifications @@ -47,6 +48,10 @@ $default-border: 1px solid $border-color-1 !default; $default-border-2: 1px solid $border-color-2 !default; $default-border-3: 1px solid $border-color-3 !default; +//// Tabs +$tabs-bg: #f6f6f6 !default; +$tab-bg: linear-gradient(0deg, #ececec, #f6f6f6) !default; + //// Shadows $default-shadow-color: #c0c0c0 !default; $border-shadow-top: 0 -2.5px 4px 0 $default-shadow-color;