From a39f573bf4b06e658a5bc865e1a2e9857ab7a924 Mon Sep 17 00:00:00 2001 From: Graeme Byrne Date: Thu, 14 Nov 2024 10:29:04 +0100 Subject: [PATCH 1/3] remove vertical scroll bar --- .../singletons/TorrustIndexPost.svelte | 19 ++++++++++++++++++- .../singletons/TorrustTrackerPost.svelte | 18 +++++++++++++++++- src/routes/(pages)/about/+page.svelte | 17 ++++++++++------- src/routes/(pages)/community/+page.svelte | 5 ++++- src/routes/(pages)/self-host/+page.svelte | 18 +++++++++++++++++- 5 files changed, 66 insertions(+), 11 deletions(-) diff --git a/src/lib/components/singletons/TorrustIndexPost.svelte b/src/lib/components/singletons/TorrustIndexPost.svelte index 8432226..6745fbc 100644 --- a/src/lib/components/singletons/TorrustIndexPost.svelte +++ b/src/lib/components/singletons/TorrustIndexPost.svelte @@ -257,9 +257,26 @@ cd /tmp \ color: rgba(255, 49, 0, 1); } + ul { + display: flex; + flex-direction: column; + list-style-type: disc; + margin: 0; + padding-left: 1.5rem; + word-break: keep-all; + padding-top: 1rem; + } + + ul li { + margin: 0.25rem 0; + word-break: keep-all; + } + @include for-desktop-up { .content-preview { - overflow-y: auto; + overflow-y: scroll; + scrollbar-width: none; + -ms-overflow-style: none; padding-top: 0rem; } } diff --git a/src/lib/components/singletons/TorrustTrackerPost.svelte b/src/lib/components/singletons/TorrustTrackerPost.svelte index aa1d4dc..7cc6bd3 100644 --- a/src/lib/components/singletons/TorrustTrackerPost.svelte +++ b/src/lib/components/singletons/TorrustTrackerPost.svelte @@ -273,9 +273,25 @@ cd /tmp \ color: rgba(255, 49, 0, 1); } + ul { + display: flex; + flex-direction: column; + list-style-type: disc; + margin: 0; + padding-left: 1.5rem; + padding-top: 1rem; + } + + ul li { + margin: 0.25rem 0; + word-break: keep-all; + } + @include for-desktop-up { .content-preview { - overflow-y: auto; + overflow-y: scroll; + scrollbar-width: none; + -ms-overflow-style: none; padding-top: 0rem; } } diff --git a/src/routes/(pages)/about/+page.svelte b/src/routes/(pages)/about/+page.svelte index 9bad7f7..67e9423 100644 --- a/src/routes/(pages)/about/+page.svelte +++ b/src/routes/(pages)/about/+page.svelte @@ -337,13 +337,6 @@ padding-top: 2rem; } - @include for-desktop-up { - .content-preview { - overflow-y: auto; - padding-top: 0rem; - } - } - #toc-builder-preview > h2 { font-size: 1.8rem; font-weight: bold; @@ -378,6 +371,7 @@ margin: 0; padding-left: 1.5rem; word-break: keep-all; + padding-top: 1rem; } ul li { @@ -399,4 +393,13 @@ img { border-radius: 24px; } + + @include for-desktop-up { + .content-preview { + overflow-y: scroll; + scrollbar-width: none; + -ms-overflow-style: none; + padding-top: 0rem; + } + } diff --git a/src/routes/(pages)/community/+page.svelte b/src/routes/(pages)/community/+page.svelte index 8a4c3ba..216a623 100644 --- a/src/routes/(pages)/community/+page.svelte +++ b/src/routes/(pages)/community/+page.svelte @@ -242,6 +242,7 @@ list-style-type: disc; margin: 0; padding-left: 1.5rem; + padding-top: 1rem; } ul li { @@ -258,7 +259,9 @@ @include for-desktop-up { .content-preview { - overflow-y: auto; + overflow-y: scroll; + scrollbar-width: none; + -ms-overflow-style: none; padding-top: 0rem; } } diff --git a/src/routes/(pages)/self-host/+page.svelte b/src/routes/(pages)/self-host/+page.svelte index fe6bdd6..df00ea9 100644 --- a/src/routes/(pages)/self-host/+page.svelte +++ b/src/routes/(pages)/self-host/+page.svelte @@ -128,9 +128,25 @@ color: rgba(255, 49, 0, 1); } + ul { + display: flex; + flex-direction: column; + list-style-type: disc; + margin: 0; + padding-left: 1.5rem; + padding-top: 1rem; + } + + ul li { + margin: 0.25rem 0; + word-break: keep-all; + } + @include for-desktop-up { .content-preview { - overflow-y: auto; + overflow-y: scroll; + scrollbar-width: none; + -ms-overflow-style: none; padding-top: 0rem; } } From 59a10b81a9e72a1d7554141eb92930b89044aca8 Mon Sep 17 00:00:00 2001 From: Graeme Byrne Date: Mon, 18 Nov 2024 20:36:09 +0100 Subject: [PATCH 2/3] remove PagesWrapper 100vh, make Toc sticky on desktop up --- src/lib/components/atoms/PagesWrapper.svelte | 1 - src/lib/components/atoms/Toc.svelte | 15 ++++++++++++++- src/lib/components/atoms/Tree.svelte | 14 +++----------- src/routes/(pages)/about/+page.svelte | 17 +++++++---------- 4 files changed, 24 insertions(+), 23 deletions(-) diff --git a/src/lib/components/atoms/PagesWrapper.svelte b/src/lib/components/atoms/PagesWrapper.svelte index ca4cf3c..8815a84 100644 --- a/src/lib/components/atoms/PagesWrapper.svelte +++ b/src/lib/components/atoms/PagesWrapper.svelte @@ -36,7 +36,6 @@ @include for-desktop-up { .layout { - height: 100vh; flex-direction: row; gap: 4rem; } diff --git a/src/lib/components/atoms/Toc.svelte b/src/lib/components/atoms/Toc.svelte index 4b14422..304a39d 100644 --- a/src/lib/components/atoms/Toc.svelte +++ b/src/lib/components/atoms/Toc.svelte @@ -50,10 +50,23 @@ }); -
+
+ + diff --git a/src/lib/components/atoms/Tree.svelte b/src/lib/components/atoms/Tree.svelte index d0bd8c1..b8ae2c0 100644 --- a/src/lib/components/atoms/Tree.svelte +++ b/src/lib/components/atoms/Tree.svelte @@ -15,13 +15,11 @@ href="#{heading.id}" use:melt={$item(heading.id)} class="inline-flex items-center justify-center gap-1 text-white no-underline transition-colors - hover:text-[rgba(255,_49,_0,_1)] data-[active]:text-[rgba(255,_49,_0,_1)]" + hover:text-[rgba(255,_49,_0,_1)] data-[active]:text-[rgba(255,_49,_0,_1)] break-keep" > - + however you want. --> {@html heading.node.innerHTML} @@ -32,9 +30,3 @@ {/each} {/if} - - diff --git a/src/routes/(pages)/about/+page.svelte b/src/routes/(pages)/about/+page.svelte index 67e9423..9bad7f7 100644 --- a/src/routes/(pages)/about/+page.svelte +++ b/src/routes/(pages)/about/+page.svelte @@ -337,6 +337,13 @@ padding-top: 2rem; } + @include for-desktop-up { + .content-preview { + overflow-y: auto; + padding-top: 0rem; + } + } + #toc-builder-preview > h2 { font-size: 1.8rem; font-weight: bold; @@ -371,7 +378,6 @@ margin: 0; padding-left: 1.5rem; word-break: keep-all; - padding-top: 1rem; } ul li { @@ -393,13 +399,4 @@ img { border-radius: 24px; } - - @include for-desktop-up { - .content-preview { - overflow-y: scroll; - scrollbar-width: none; - -ms-overflow-style: none; - padding-top: 0rem; - } - } From 5078729deb6a1f69f70624dfd90f49582d8a039d Mon Sep 17 00:00:00 2001 From: TGlide <26071571+TGlide@users.noreply.github.com> Date: Thu, 21 Nov 2024 00:10:25 +0100 Subject: [PATCH 3/3] Applied changes from TGlide's PR consistently across the website --- package-lock.json | 70 +- package.json | 1 + src/lib/components/atoms/PagesWrapper.svelte | 1 + src/lib/components/atoms/Toc.svelte | 47 +- .../singletons/TorrustIndexPost.svelte | 403 ++++++----- .../singletons/TorrustTrackerPost.svelte | 425 +++++------ src/lib/scss/global.scss | 1 - src/routes/(pages)/about/+page.svelte | 671 +++++++++--------- src/routes/(pages)/community/+page.svelte | 390 +++++----- src/routes/(pages)/self-host/+page.svelte | 205 +++--- src/routes/+layout.svelte | 23 +- 11 files changed, 1133 insertions(+), 1104 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7fa908f..ed2aa2c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@fontsource-variable/roboto-mono": "^5.0.19", "@fontsource-variable/roboto-slab": "^5.0.20", + "@sveltejs/vite-plugin-svelte": "^3.1.2", "@tailwindcss/typography": "^0.5.15", "autoprefixer": "^10.4.20", "feather-icons": "^4.29.2", @@ -181,7 +182,6 @@ "cpu": [ "ppc64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -198,7 +198,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -215,7 +214,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -232,7 +230,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -249,7 +246,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -266,7 +262,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -283,7 +278,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -300,7 +294,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -317,7 +310,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -334,7 +326,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -351,7 +342,6 @@ "cpu": [ "ia32" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -368,7 +358,6 @@ "cpu": [ "loong64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -385,7 +374,6 @@ "cpu": [ "mips64el" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -402,7 +390,6 @@ "cpu": [ "ppc64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -419,7 +406,6 @@ "cpu": [ "riscv64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -436,7 +422,6 @@ "cpu": [ "s390x" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -453,7 +438,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -470,7 +454,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -487,7 +470,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -504,7 +486,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -521,7 +502,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -538,7 +518,6 @@ "cpu": [ "ia32" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -555,7 +534,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1171,7 +1149,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1185,7 +1162,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1199,7 +1175,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1213,7 +1188,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1227,7 +1201,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1241,7 +1214,6 @@ "cpu": [ "arm" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1255,7 +1227,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1269,7 +1240,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1283,7 +1253,6 @@ "cpu": [ "ppc64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1297,7 +1266,6 @@ "cpu": [ "riscv64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1311,7 +1279,6 @@ "cpu": [ "s390x" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1325,7 +1292,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1339,7 +1305,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1353,7 +1318,6 @@ "cpu": [ "arm64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1367,7 +1331,6 @@ "cpu": [ "ia32" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1381,7 +1344,6 @@ "cpu": [ "x64" ], - "dev": true, "license": "MIT", "optional": true, "os": [ @@ -1438,12 +1400,10 @@ } }, "node_modules/@sveltejs/vite-plugin-svelte": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-3.1.1.tgz", - "integrity": "sha512-rimpFEAboBBHIlzISibg94iP09k/KYdHgVhJlcsTfn7KMBhc70jFX/GRWkRdFCc2fdnk+4+Bdfej23cMDnJS6A==", - "dev": true, + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte/-/vite-plugin-svelte-3.1.2.tgz", + "integrity": "sha512-Txsm1tJvtiYeLUVRNqxZGKR/mI+CzuIQuc2gn+YCs9rMTowpNZ2Nqt53JdL8KF9bLhAf2ruR/dr9eZCwdTriRA==", "license": "MIT", - "peer": true, "dependencies": { "@sveltejs/vite-plugin-svelte-inspector": "^2.1.0", "debug": "^4.3.4", @@ -1465,9 +1425,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/@sveltejs/vite-plugin-svelte-inspector/-/vite-plugin-svelte-inspector-2.1.0.tgz", "integrity": "sha512-9QX28IymvBlSCqsCll5t0kQVxipsfhFFL+L2t3nTWfXnddYwxBuAEtTtlaVQpRz9c37BhJjltSeY4AJSC03SSg==", - "dev": true, "license": "MIT", - "peer": true, "dependencies": { "debug": "^4.3.4" }, @@ -1597,7 +1555,7 @@ "version": "20.12.13", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.13.tgz", "integrity": "sha512-gBGeanV41c1L171rR7wjbMiEpEI/l5XFQdLLfhr/REwpgDy/4U8y89+i8kRiLzDyZdOkXh+cRaTetUnCYutoXA==", - "dev": true, + "devOptional": true, "license": "MIT", "dependencies": { "undici-types": "~5.26.4" @@ -2714,7 +2672,6 @@ "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==", - "dev": true, "license": "MIT", "dependencies": { "ms": "2.1.2" @@ -2772,9 +2729,7 @@ "version": "4.3.1", "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.3.1.tgz", "integrity": "sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==", - "dev": true, "license": "MIT", - "peer": true, "engines": { "node": ">=0.10.0" } @@ -2989,7 +2944,6 @@ "version": "0.21.5", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz", "integrity": "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==", - "dev": true, "hasInstallScript": true, "license": "MIT", "bin": { @@ -4214,7 +4168,7 @@ "version": "4.3.6", "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.6.tgz", "integrity": "sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ==", - "dev": true, + "devOptional": true, "license": "MIT" }, "node_modules/import-fresh": { @@ -4563,7 +4517,6 @@ "version": "4.1.5", "resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz", "integrity": "sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==", - "dev": true, "license": "MIT", "engines": { "node": ">=6" @@ -4953,7 +4906,6 @@ "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", - "dev": true, "license": "MIT" }, "node_modules/mz": { @@ -6014,7 +5966,6 @@ "version": "4.22.4", "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.22.4.tgz", "integrity": "sha512-vD8HJ5raRcWOyymsR6Z3o6+RzfEPCnVLMFJ6vRslO1jt4LO6dUo5Qnpg7y4RkZFM2DMe3WUirkI5c16onjrc6A==", - "dev": true, "license": "MIT", "dependencies": { "@types/estree": "1.0.5" @@ -6141,7 +6092,7 @@ "version": "1.77.3", "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.3.tgz", "integrity": "sha512-WJHo+jmFp0dwRuymPmIovuxHaBntcCyja5hCB0yYY9wWrViEp4kF5Cdai98P72v6FzroPuABqu+ddLMbQWmwzA==", - "dev": true, + "devOptional": true, "license": "MIT", "dependencies": { "chokidar": ">=3.0.0 <4.0.0", @@ -6800,9 +6751,7 @@ "version": "0.16.0", "resolved": "https://registry.npmjs.org/svelte-hmr/-/svelte-hmr-0.16.0.tgz", "integrity": "sha512-Gyc7cOS3VJzLlfj7wKS0ZnzDVdv3Pn2IuVeJPk9m2skfhcu5bq3wtIZyQGggr7/Iim5rH5cncyQft/kRLupcnA==", - "dev": true, "license": "ISC", - "peer": true, "engines": { "node": "^12.20 || ^14.13.1 || >= 16" }, @@ -7286,7 +7235,7 @@ "version": "5.26.5", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==", - "dev": true, + "devOptional": true, "license": "MIT" }, "node_modules/unified": { @@ -7581,7 +7530,6 @@ "version": "5.4.8", "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.8.tgz", "integrity": "sha512-FqrItQ4DT1NC4zCUqMB4c4AZORMKIa0m8/URVCZ77OZ/QSNeJ54bU1vrFADbDsuwfIPcgknRkmqakQcgnL4GiQ==", - "dev": true, "license": "MIT", "dependencies": { "esbuild": "^0.21.3", @@ -7665,9 +7613,7 @@ "version": "0.2.5", "resolved": "https://registry.npmjs.org/vitefu/-/vitefu-0.2.5.tgz", "integrity": "sha512-SgHtMLoqaeeGnd2evZ849ZbACbnwQCIwRH57t18FxcXoZop0uQu0uzlIhJBlF/eWVzuce0sHeqPcDo+evVcg8Q==", - "dev": true, "license": "MIT", - "peer": true, "peerDependencies": { "vite": "^3.0.0 || ^4.0.0 || ^5.0.0" }, diff --git a/package.json b/package.json index 8ad6e18..a219e13 100644 --- a/package.json +++ b/package.json @@ -54,6 +54,7 @@ "dependencies": { "@fontsource-variable/roboto-mono": "^5.0.19", "@fontsource-variable/roboto-slab": "^5.0.20", + "@sveltejs/vite-plugin-svelte": "^3.1.2", "@tailwindcss/typography": "^0.5.15", "autoprefixer": "^10.4.20", "feather-icons": "^4.29.2", diff --git a/src/lib/components/atoms/PagesWrapper.svelte b/src/lib/components/atoms/PagesWrapper.svelte index 8815a84..09c6760 100644 --- a/src/lib/components/atoms/PagesWrapper.svelte +++ b/src/lib/components/atoms/PagesWrapper.svelte @@ -36,6 +36,7 @@ @include for-desktop-up { .layout { + height: 100%; flex-direction: row; gap: 4rem; } diff --git a/src/lib/components/atoms/Toc.svelte b/src/lib/components/atoms/Toc.svelte index 304a39d..61ba355 100644 --- a/src/lib/components/atoms/Toc.svelte +++ b/src/lib/components/atoms/Toc.svelte @@ -1,56 +1,41 @@ -
+