From 93688dc2b4b01907f1dabccf290c138b1810d15f Mon Sep 17 00:00:00 2001 From: Airradda <3744856+Airradda@users.noreply.github.com> Date: Sun, 21 Jun 2020 04:16:03 -0500 Subject: [PATCH 01/64] Enable "autoHideMenuBar" on electron window --- src/main/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/main/index.js b/src/main/index.js index aae38455..c74537f5 100644 --- a/src/main/index.js +++ b/src/main/index.js @@ -63,6 +63,7 @@ function createWindow () { backgroundColor: '#fff', width: 960, height: 540, + autoHideMenuBar: true, // useContentSize: true, webPreferences: { nodeIntegration: true, From 42ec307b7b4be2f9d42ada69e615c9564296a55a Mon Sep 17 00:00:00 2001 From: Airradda <3744856+Airradda@users.noreply.github.com> Date: Sun, 21 Jun 2020 22:47:43 -0500 Subject: [PATCH 02/64] Added scrollbar coloring for each base theme --- src/renderer/themes.css | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/renderer/themes.css b/src/renderer/themes.css index 8f39540b..19289496 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -10,6 +10,8 @@ --link-visited-color: var(--accent-color-visited); --card-bg-color: #FFFFFF; --secondary-card-bg-color: #eeeeee; + --scrollbar-color: #9E9E9E; + --scrollbar-color-hover: #BDBDBD; --side-nav-color: #FFFFFF; --side-nav-hover-color: #e0e0e0; --side-nav-active-color: #757575; @@ -32,6 +34,8 @@ --link-visited-color: var(--accent-color-visited); --card-bg-color: #303030; --secondary-card-bg-color: rgba(0, 0, 0, 0.75); + --scrollbar-color: #616161; + --scrollbar-color-hover: #757575; --side-nav-color: #262626; --side-nav-hover-color: #212121; --side-nav-active-color: #303030; @@ -53,6 +57,8 @@ --link-visited-color: var(--accent-color-visited); --card-bg-color: #000000; --secondary-card-bg-color: rgba(0, 0, 0, 0.75); + --scrollbar-color: #212121; + --scrollbar-color-hover: #424242; --side-nav-color: #000000; --side-nav-hover-color: #212121; --side-nav-active-color: #303030; @@ -453,9 +459,9 @@ a:visited { } ::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); - background: var(--primary-color); + background: var(--scrollbar-color); border-radius: 10px; } ::-webkit-scrollbar-thumb:hover { - background: var(--primary-color-active); + background: var(--scrollbar-color-hover); } From c025b6529189d7d60bb914d1146a03286d3010ac Mon Sep 17 00:00:00 2001 From: Airradda <3744856+Airradda@users.noreply.github.com> Date: Sun, 21 Jun 2020 23:02:44 -0500 Subject: [PATCH 03/64] Removed weird artifacting --- src/renderer/themes.css | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/renderer/themes.css b/src/renderer/themes.css index af0214f4..11db13d6 100644 --- a/src/renderer/themes.css +++ b/src/renderer/themes.css @@ -448,23 +448,25 @@ body { color: var(--primary-text-color); background-color: var(--bg-color); } + a:link { color: var(--link-color); } + a:visited { color: var(--link-visited-color); } -<<<<<<< HEAD + ::-webkit-scrollbar { width: 10px; } + ::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); background: var(--scrollbar-color); border-radius: 10px; } + ::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-color-hover); } -======= ->>>>>>> 9b9313d348ab019cb17ffb3478fe3c4c7b0292e5 From 7afbe836d3f44099e1927b031ae3ec92ed60622c Mon Sep 17 00:00:00 2001 From: Cadence Ember Date: Wed, 24 Jun 2020 03:47:19 +1200 Subject: [PATCH 04/64] Rewrite list items :) --- .vscode/tasks.json | 7 + .../components/ft-auto-grid/ft-auto-grid.js | 11 + .../components/ft-auto-grid/ft-auto-grid.sass | 10 + .../components/ft-auto-grid/ft-auto-grid.vue | 14 + .../ft-element-list/ft-element-list.js | 4 +- .../ft-element-list/ft-element-list.vue | 64 ++--- .../ft-icon-button/ft-icon-button.js | 8 + .../ft-icon-button/ft-icon-button.sass | 3 +- .../ft-icon-button/ft-icon-button.vue | 4 + .../ft-list-playlist/ft-list-playlist.css | 106 -------- .../ft-list-playlist/ft-list-playlist.js | 12 +- .../ft-list-playlist/ft-list-playlist.sass | 1 + .../ft-list-playlist/ft-list-playlist.vue | 49 ++-- .../ft-list-video/ft-list-video.css | 247 ------------------ .../components/ft-list-video/ft-list-video.js | 33 +-- .../ft-list-video/ft-list-video.sass | 1 + .../ft-list-video/ft-list-video.vue | 129 +++++---- .../watch-playlist/watch-playlist.vue | 2 + .../watch-video-playlist.css | 24 +- .../watch-video-playlist.vue | 26 +- .../watch-video-recommendations.css | 9 +- .../watch-video-recommendations.vue | 4 +- src/renderer/sass-partials/_ft-list-item.sass | 151 +++++++++++ src/renderer/views/Playlist/Playlist.css | 3 + src/renderer/views/Playlist/Playlist.vue | 18 +- src/renderer/views/Watch/Watch.sass | 4 +- 26 files changed, 376 insertions(+), 568 deletions(-) create mode 100644 src/renderer/components/ft-auto-grid/ft-auto-grid.js create mode 100644 src/renderer/components/ft-auto-grid/ft-auto-grid.sass create mode 100644 src/renderer/components/ft-auto-grid/ft-auto-grid.vue delete mode 100644 src/renderer/components/ft-list-playlist/ft-list-playlist.css create mode 100644 src/renderer/components/ft-list-playlist/ft-list-playlist.sass delete mode 100644 src/renderer/components/ft-list-video/ft-list-video.css create mode 100644 src/renderer/components/ft-list-video/ft-list-video.sass create mode 100644 src/renderer/sass-partials/_ft-list-item.sass diff --git a/.vscode/tasks.json b/.vscode/tasks.json index 1db3b6de..3e3b502c 100644 --- a/.vscode/tasks.json +++ b/.vscode/tasks.json @@ -7,6 +7,13 @@ "type": "npm", "script": "dev", "problemMatcher": [] + }, + { + "type": "npm", + "script": "dev-runner", + "problemMatcher": [], + "label": "npm: dev-runner", + "detail": "node _scripts/dev-runner.js" } ] } \ No newline at end of file diff --git a/src/renderer/components/ft-auto-grid/ft-auto-grid.js b/src/renderer/components/ft-auto-grid/ft-auto-grid.js new file mode 100644 index 00000000..2befee45 --- /dev/null +++ b/src/renderer/components/ft-auto-grid/ft-auto-grid.js @@ -0,0 +1,11 @@ +import Vue from 'vue' + +export default Vue.extend({ + name: 'FtAutoGrid', + props: { + grid: { + type: Boolean, + required: true + } + } +}) diff --git a/src/renderer/components/ft-auto-grid/ft-auto-grid.sass b/src/renderer/components/ft-auto-grid/ft-auto-grid.sass new file mode 100644 index 00000000..eb71df3e --- /dev/null +++ b/src/renderer/components/ft-auto-grid/ft-auto-grid.sass @@ -0,0 +1,10 @@ +.ft-auto-grid + &.grid + display: grid + grid-template-columns: repeat(auto-fill, 240px) + justify-content: space-evenly + grid-gap: 5px + + &.list + display: grid + grid-gap: 16px diff --git a/src/renderer/components/ft-auto-grid/ft-auto-grid.vue b/src/renderer/components/ft-auto-grid/ft-auto-grid.vue new file mode 100644 index 00000000..14e20186 --- /dev/null +++ b/src/renderer/components/ft-auto-grid/ft-auto-grid.vue @@ -0,0 +1,14 @@ + + +