From 62e358ff873c5ea7494e9f414da30f6f455a65a1 Mon Sep 17 00:00:00 2001 From: Isaac Maier Date: Wed, 24 Jan 2024 10:26:37 -0500 Subject: [PATCH 1/3] Make it actually smooth --- src/resources/snippets.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/resources/snippets.ts b/src/resources/snippets.ts index 98d4dad5..a94ddab0 100644 --- a/src/resources/snippets.ts +++ b/src/resources/snippets.ts @@ -290,7 +290,7 @@ export default [ { "title": "Smooth Progress/Volume bar", "description": "Makes the Progress/Volume bar glide", - "code": ".x-progressBar-fillColor { transition: 500ms; } .progress-bar__slider { transition: 500ms; }", + "code": ".x-progressBar-fillColor, .progress-bar__slider { transition: 1000ms; transition-timing-function: linear; }", "preview": "resources/assets/snippets/smooth-progress-bar.png", }, { From bb7ce7170ffd69aac3fd3a0d9fed5dce29317569 Mon Sep 17 00:00:00 2001 From: Isaac Maier Date: Wed, 24 Jan 2024 16:59:11 -0500 Subject: [PATCH 2/3] Make it jump faster when you click on it --- src/resources/snippets.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/resources/snippets.ts b/src/resources/snippets.ts index a94ddab0..9a2b9ba0 100644 --- a/src/resources/snippets.ts +++ b/src/resources/snippets.ts @@ -290,7 +290,7 @@ export default [ { "title": "Smooth Progress/Volume bar", "description": "Makes the Progress/Volume bar glide", - "code": ".x-progressBar-fillColor, .progress-bar__slider { transition: 1000ms; transition-timing-function: linear; }", + "code": "@property --progress-bar-transform { inherits: true; initial-value: 0%; syntax: ''; } .progress-bar { transition: --progress-bar-transform 1s linear !important; } .progress-bar:active { transition-duration: 150ms !important; }", "preview": "resources/assets/snippets/smooth-progress-bar.png", }, { From e08584a26f481d1d7c94594bef3717af1b3a88e4 Mon Sep 17 00:00:00 2001 From: Isaac Maier Date: Wed, 24 Jan 2024 17:01:48 -0500 Subject: [PATCH 3/3] Capitalization --- src/resources/snippets.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/resources/snippets.ts b/src/resources/snippets.ts index 9a2b9ba0..0837bdc3 100644 --- a/src/resources/snippets.ts +++ b/src/resources/snippets.ts @@ -288,7 +288,7 @@ export default [ "preview": "resources/assets/snippets/fix-listening-on.png", }, { - "title": "Smooth Progress/Volume bar", + "title": "Smooth Progress/Volume Bar", "description": "Makes the Progress/Volume bar glide", "code": "@property --progress-bar-transform { inherits: true; initial-value: 0%; syntax: ''; } .progress-bar { transition: --progress-bar-transform 1s linear !important; } .progress-bar:active { transition-duration: 150ms !important; }", "preview": "resources/assets/snippets/smooth-progress-bar.png",