From 7c13d1d14c4d52d520646e9f6698fa19be5cdc28 Mon Sep 17 00:00:00 2001 From: Alicia Sykes Date: Tue, 15 Jun 2021 13:07:02 +0100 Subject: [PATCH 01/10] Adds content to the About page --- src/views/About.vue | 139 +++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 136 insertions(+), 3 deletions(-) diff --git a/src/views/About.vue b/src/views/About.vue index 3fa28070..83585d71 100644 --- a/src/views/About.vue +++ b/src/views/About.vue @@ -1,5 +1,138 @@ + + + + From 9af4af75ec0fb190e3538b15dd8406f2099ebb6d Mon Sep 17 00:00:00 2001 From: Alicia Sykes Date: Tue, 15 Jun 2021 13:08:46 +0100 Subject: [PATCH 02/10] Specifies text highlight color, and adds variable --- docs/theming.md | 2 ++ src/styles/color-palette.scss | 6 +++++- src/styles/global-styles.scss | 1 + src/styles/style-helpers.scss | 13 +++++++++++++ 4 files changed, 21 insertions(+), 1 deletion(-) diff --git a/docs/theming.md b/docs/theming.md index aebce0c2..02ea6a86 100644 --- a/docs/theming.md +++ b/docs/theming.md @@ -108,6 +108,8 @@ You can target specific elements on the UI with these variables. All are optiona - `--config-settings-background` - The text color for text within the settings container. Defaults to `--background-darker` - `--scroll-bar-color` - Color of the scroll bar thumb. Defaults to `--primary` - `--scroll-bar-background` Color of the scroll bar blank space. Defaults to `--background-darker` +- `--highlight-background` Fill color for text highlighting. Defaults to `--primary` +- `--highlight-color` Text color for selected/ highlighted text. Defaults to `--background` - `--toast-background` - Background color for the toast info popup. Defaults to `--primary` - `--toast-color` - Text, icon and border color in the toast info popup. Defaults to `--background` - `--welcome-popup-background` - Background for the info pop-up shown on first load. Defaults to `--background-darker` diff --git a/src/styles/color-palette.scss b/src/styles/color-palette.scss index 04b32864..3dee2b69 100644 --- a/src/styles/color-palette.scss +++ b/src/styles/color-palette.scss @@ -77,10 +77,14 @@ --toast-color: var(--background); --scroll-bar-color: var(--primary); --scroll-bar-background: var(--background-darker); + --highlight-color: var(--background); + --highlight-background: var(--primary); --loading-screen-color: var(--primary); --loading-screen-background: var(--background); --login-form-color: var(--primary); --login-form-background: var(--background); --login-form-background-secondary: var(--background-darker); - + --about-page-color: var(--white); + --about-page-background: #0b1021; + --about-page-accent: var(--primary); } diff --git a/src/styles/global-styles.scss b/src/styles/global-styles.scss index d82ee309..2a83e105 100644 --- a/src/styles/global-styles.scss +++ b/src/styles/global-styles.scss @@ -7,6 +7,7 @@ html { transition: all 1s; margin-top: -3px; @extend .scroll-bar; + @extend .highlight; box-sizing: border-box; input[type=button], button, a { cursor: pointer; diff --git a/src/styles/style-helpers.scss b/src/styles/style-helpers.scss index 491c7c09..2aafd339 100644 --- a/src/styles/style-helpers.scss +++ b/src/styles/style-helpers.scss @@ -15,6 +15,19 @@ } } +/* Custom highlight color */ +.highlight { + ::selection { + background-color: var(--highlight-background); + color: var(--highlight-color); + } + ::-moz-selection, ::-o-selection, ::-ms-selection, ::-webkit-selection { + background-color: var(--highlight-background); + color: var(--highlight-color); + } +} + + /* Single-style helpers */ .bold { font-weight: bold; } .light { font-weight: lighter; } From f3bee653a09c39554c05a528414c73858af01393 Mon Sep 17 00:00:00 2001 From: Alicia Sykes Date: Tue, 15 Jun 2021 14:21:37 +0100 Subject: [PATCH 03/10] Small docs updates --- README.md | 7 +++++++ docs/configuring.md | 8 +++++--- docs/contributing.md | 3 ++- docs/readme.md | 1 + docs/theming.md | 2 ++ 5 files changed, 17 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 7f760ea3..a6746eee 100644 --- a/README.md +++ b/README.md @@ -299,6 +299,13 @@ TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWAREOR THE OR OTHER DEALINGS IN THE SOFTWARE. ``` +#### Author 🦄 +

Alicia Sykes

+Developed by [Alicia Sykes](https://aliciasykes.com) ([@Lissy93](https://github.com/lissy93)) in 2021. + +- **PGP Key**: [`0688 F8D3 4587 D954 E9E5 1FB8 FEDB 68F5 5C02 83A7`](https://keybase.io/aliciasykes/pgp_keys.asc?fingerprint=0688f8d34587d954e9e51fb8fedb68f55c0283a7) +- **BTC Address**: `3853bSxupMjvxEYfwGDGAaLZhTKxB2vEVC` + **[⬆️ Back to Top](#dashy)** --- diff --git a/docs/configuring.md b/docs/configuring.md index acae2cae..938f52c0 100644 --- a/docs/configuring.md +++ b/docs/configuring.md @@ -50,6 +50,8 @@ All fields are optional, unless otherwise stated. **`backgroundImg`** | `string` | _Optional_ | Path to an optional full-screen app background image. This can be either remote (http) or local (/). Note that this will slow down initial load **`enableFontAwesome`** | `boolean` | _Optional_ | Where `true` is enabled, if left blank font-awesome will be enabled only if required by 1 or more icons **`fontAwesomeKey`** | `string` | _Optional_ | If you have a font-awesome key, then you can use it here and make use of premium icons. It is a 10-digit alpha-numeric string from you're FA kit URL (e.g. `13014ae648`) +**`layout`** | `string` | _Optional_ | App layout, either `horizontal`, `vertical`, `auto` or `sidebar`. Defaults to `auto`. This specifies the layout and direction of how sections are positioned on the home screen. This can also be modified from the UI. +**`iconSize`** | `string` | _Optional_ | The size of link items / icons. Can be either `small`, `medium,` or `large`. Defaults to `medium`. This can also be set directly from the UI. **`theme`** | `string` | _Optional_ | The default theme for first load (you can change this later from the UI) **`cssThemes`** | `string[]` | _Optional_ | An array of custom theme names which can be used in the theme switcher dropdown **`externalStyleSheet`** | `string` or `string[]` | _Optional_ | Either a URL to an external stylesheet or an array or URLs, which can be applied as themes within the UI @@ -104,9 +106,9 @@ All fields are optional, unless otherwise stated. **`itemSize`** | `string` | _Optional_ | Specify the size for items within this group, either `small`, `medium` or `large`. Note that this will overide any settings specified through the UI **`rows`** | `number` | _Optional_ | Height of the section, specified as the number of rows it should span vertically, e.g. `2`. Defaults to `1`. Max is `5`. **`cols`** | `number` | _Optional_ | Width of the section, specified as the number of columns the section should span horizontally, e.g. `2`. Defaults to `1`. Max is `5`. -**`layout`** | `string` | _Optional_ | Specify which CSS layout will be used to responsivley place items. Can be either `auto` (which uses flex layout), or `grid`. If `grid` is selected, then `itemCountX` and `itemCountY` may also be set. Defaults to `auto` -**`itemCountX`** | `number` | _Optional_ | The number of items to display per row / horizontally. If not set, it will be calculated automatically based on available space. Can only be set if `layout` is set to `grid`. Must be a whole number between `1` and `12` -**`itemCountY`** | `number` | _Optional_ | The number of items to display per column / vertically. If not set, it will be calculated automatically based on available space. If `itemCountX` is set, then `itemCountY` can be calculated automatically. Can only be set if `layout` is set to `grid`. Must be a whole number between `1` and `12` +**`sectionLayout`** | `string` | _Optional_ | Specify which CSS layout will be used to responsivley place items. Can be either `auto` (which uses flex layout), or `grid`. If `grid` is selected, then `itemCountX` and `itemCountY` may also be set. Defaults to `auto` +**`itemCountX`** | `number` | _Optional_ | The number of items to display per row / horizontally. If not set, it will be calculated automatically based on available space. Can only be set if `sectionLayout` is set to `grid`. Must be a whole number between `1` and `12` +**`itemCountY`** | `number` | _Optional_ | The number of items to display per column / vertically. If not set, it will be calculated automatically based on available space. If `itemCountX` is set, then `itemCountY` can be calculated automatically. Can only be set if `sectionLayout` is set to `grid`. Must be a whole number between `1` and `12` **[⬆️ Back to Top](#configuring)** diff --git a/docs/contributing.md b/docs/contributing.md index 7d225eb7..d5dbf358 100644 --- a/docs/contributing.md +++ b/docs/contributing.md @@ -128,7 +128,8 @@ Click one of the links below, to open an issue: ### Contributors -![Auto-generated contributors](https://raw.githubusercontent.com/Lissy93/dashy/03fbaf35ff4653d16a622cfce00a1347c13d0192/docs/assets/CONTRIBUTORS.svg) +![Auto-generated contributors](https://raw.githubusercontent.com/Lissy93/dashy/master/docs/assets/CONTRIBUTORS.svg) + ### Star-Gazers Over Time diff --git a/docs/readme.md b/docs/readme.md index 97d43511..3eed3712 100644 --- a/docs/readme.md +++ b/docs/readme.md @@ -7,5 +7,6 @@ - [User Guide](/docs/user-guide.md) - [Troubleshooting](/docs/troubleshooting.md) - [Backup & Restore](/docs/backup-restore.md) +- [Status Indicators](/docs/status-indicators.md) - [Theming](/docs/theming.md) - [Authentication](/docs/authentication.md) diff --git a/docs/theming.md b/docs/theming.md index 02ea6a86..5a90180a 100644 --- a/docs/theming.md +++ b/docs/theming.md @@ -114,6 +114,8 @@ You can target specific elements on the UI with these variables. All are optiona - `--toast-color` - Text, icon and border color in the toast info popup. Defaults to `--background` - `--welcome-popup-background` - Background for the info pop-up shown on first load. Defaults to `--background-darker` - `--welcome-popup-text-color` - Text color for the welcome pop-up. Defaults to `--primary` +- `--side-bar-background` - Background color of the sidebar used in the workspace view. Defaults to `--background-darker` +- `--side-bar-color` - Color of icons and text within the sidebar. Defaults to `--primary` #### Non-Color Variables - `--outline-color` - Used to outline focused or selected elements From 491c07ed67135edf7f5bfd715a86c50566e6b6ef Mon Sep 17 00:00:00 2001 From: Alicia Sykes Date: Tue, 15 Jun 2021 14:22:22 +0100 Subject: [PATCH 04/10] Working on adding a workspace/ sidebar view --- src/components/LinkItems/ItemGroup.vue | 2 +- src/components/PageStrcture/Footer.vue | 3 ++ src/components/Workspace/SideBar.vue | 43 ++++++++++++++++++++++ src/components/Workspace/SideBarItem.vue | 47 ++++++++++++++++++++++++ src/components/Workspace/WebContent.vue | 30 +++++++++++++++ src/router.js | 19 +++++++--- src/styles/color-palette.scss | 2 + src/utils/ConfigAccumalator.js | 12 ++++-- src/utils/ConfigSchema.json | 21 ++++++++++- src/utils/defaults.js | 3 ++ src/views/Home.vue | 4 +- src/views/Workspace.vue | 31 ++++++++++++++++ 12 files changed, 203 insertions(+), 14 deletions(-) create mode 100644 src/components/Workspace/SideBar.vue create mode 100644 src/components/Workspace/SideBarItem.vue create mode 100644 src/components/Workspace/WebContent.vue create mode 100644 src/views/Workspace.vue diff --git a/src/components/LinkItems/ItemGroup.vue b/src/components/LinkItems/ItemGroup.vue index a375d7d6..e94a2794 100644 --- a/src/components/LinkItems/ItemGroup.vue +++ b/src/components/LinkItems/ItemGroup.vue @@ -70,7 +70,7 @@ export default { return this.displayData.itemSize || this.itemSize; }, isGridLayout() { - return this.displayData.layout === 'grid' + return this.displayData.sectionLayout === 'grid' || !!(this.displayData.itemCountX || this.displayData.itemCountY); }, gridStyle() { diff --git a/src/components/PageStrcture/Footer.vue b/src/components/PageStrcture/Footer.vue index 3debd4f6..2f97d23e 100644 --- a/src/components/PageStrcture/Footer.vue +++ b/src/components/PageStrcture/Footer.vue @@ -29,6 +29,9 @@ export default { diff --git a/src/components/Workspace/SideBarItem.vue b/src/components/Workspace/SideBarItem.vue new file mode 100644 index 00000000..cb0c33fb --- /dev/null +++ b/src/components/Workspace/SideBarItem.vue @@ -0,0 +1,47 @@ + + + + + diff --git a/src/components/Workspace/WebContent.vue b/src/components/Workspace/WebContent.vue new file mode 100644 index 00000000..4831142b --- /dev/null +++ b/src/components/Workspace/WebContent.vue @@ -0,0 +1,30 @@ +