mastermindzh/tidal-hifi
1
0
Fork 0
mirror of https://github.com/Mastermindzh/tidal-hifi.git synced 2024-11-22 13:32:42 +01:00
Code Issues Projects Releases Wiki Activity

added styling on theme selector

Browse Source
This commit is contained in:
Rick van Lieshout 2023-05-09 23:28:45 +02:00
parent 77a853e980
commit 4350ab9bd9
4 changed files with 32 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@ -8,7 +8,8 @@
"compile": "tsc && npm run sass-and-copy", "compile": "tsc && npm run sass-and-copy",
"watch": "tsc-watch --onSuccess \"npm run sass-and-copy\"", "watch": "tsc-watch --onSuccess \"npm run sass-and-copy\"",
"copy-files": "copyfiles -u 1 --exclude './src/**/*.ts' --exclude './src/**/*.scss' \"./src/**/*\" ts-dist", "copy-files": "copyfiles -u 1 --exclude './src/**/*.ts' --exclude './src/**/*.scss' \"./src/**/*\" ts-dist",
"sass-and-copy": "npm run sass && npm run copy-files", "copy-themes-dev": "copyfiles -u 1 \"./themes/*\" node_modules/electron/dist/resources",
"sass-and-copy": "npm run sass && npm run copy-files && npm run copy-themes-dev",
"build": "npm run builder -- -c ./build/electron-builder.yml", "build": "npm run builder -- -c ./build/electron-builder.yml",
"build-deb": "npm run builder -- -c ./build/electron-builder.deb.yml", "build-deb": "npm run builder -- -c ./build/electron-builder.deb.yml",
"build-unpacked": "npm run builder -- -c ./build/electron-builder.unpacked.yml", "build-unpacked": "npm run builder -- -c ./build/electron-builder.unpacked.yml",

8
src/pages/settings/preload.ts
View File

@ -27,9 +27,13 @@ let adBlock: HTMLInputElement,
function getThemeFiles() { function getThemeFiles() {
const selectElement = document.getElementById("themesList") as HTMLSelectElement; const selectElement = document.getElementById("themesList") as HTMLSelectElement;
const fileNames = fs.readdirSync(process.resourcesPath).filter((file) => file.endsWith(".css")); const fileNames = fs
.readdirSync(process.resourcesPath)
.filter((file) => file.endsWith(".css"))
.sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()));
const options = fileNames.map((name) => { const options = fileNames.map((name) => {
return new Option(name, name); return new Option(name.replace(".css", ""), name);
}); });
// empty old options // empty old options

2
src/pages/settings/settings.html
View File

@ -291,7 +291,7 @@
<p> <p>
Select a theme below or "Tidal - Default" to return to the original Tidal look. Select a theme below or "Tidal - Default" to return to the original Tidal look.
</p> </p>
<select id="themesList" name="themesList"> <select class="select-input" id="themesList" name="themesList">
</select> </select>
</div> </div>

25
src/pages/settings/settings.scss
View File

@ -230,8 +230,6 @@ html {
border-color: $tidal-blue; border-color: $tidal-blue;
color: $white; color: $white;
} }
// --- Switch slider component ---
} }
} }
} }
@ -415,3 +413,26 @@ html {
outline: none; outline: none;
} }
} }
.select-input {
display: block;
width: 100%;
margin-bottom: 10px;
padding: 5px 0;
transition: 0.2s;
border: 0;
border-bottom: solid 1px $grey-333;
outline: none;
background: transparent;
color: $tidal-grey;
font-size: 14px;
&:focus {
border-color: $tidal-blue;
color: $white;
}
option {
background-color: $tidal-grey-darkest;
}
}