Remove sass styles

README.md

@@ -34,7 +34,7 @@
 [![Mac Download](https://img.shields.io/badge/Mac-download-brightgreen)](https://api.levminer.com/api/v1/authme/release/mac)
 [![Updated](https://img.shields.io/github/last-commit/levminer/authme/main?color=yellowgreen&label=Updated)](https://github.com/Levminer/authme/releases)
 
--   Also available on: [Microsoft Store](https://link.levminer.com/authme-ms-store), [winget](https://winstall.app/apps/Levminer.Authme)
+-   Also available on: [Microsoft Store](https://link.levminer.com/authme-ms-store), [winget](https://winget.run/pkg/Levminer/Authme)
 
 ## Latest Alpha
 

package.json

@@ -6,17 +6,13 @@
 	"author": "Levminer",
 	"license": "GPL-3.0",
 	"scripts": {
-		"dev": "npm run start",
 		"start": "node scripts/alpha-build.js && electron .",
 		"release": "node scripts/release-build.js && electron .",
-		"build": "npm run build:release",
-		"build:release": "node scripts/release-build.js && electron-builder --publish=never --x64",
+		"build": "node scripts/release-build.js && electron-builder --publish=never --x64",
 		"build:beta": "node scripts/beta-build.js && electron-builder --publish=never --x64",
 		"build:alpha": "node scripts/alpha-build.js && electron-builder --publish=never --x64",
 		"build:test": "node scripts/alpha-build.js && electron-builder --publish=never --x64 --dir -c scripts/test-build.json",
-		"watch:styles": "concurrently 'npm:watch:tw' 'npm:watch:gb'",
-		"watch:gb": "sass styles/global.scss styles/global.css --no-source-map --style compressed --watch",
-		"watch:tw": "tailwindcss build -i styles/tailwind.scss -o styles/tailwind.css -c .tailwindrc.js --no-autoprefixer --minify --watch",
+		"watch": "tailwindcss build -i styles/index.css -o styles/tailwind.css -c .tailwindrc.js --no-autoprefixer --minify --watch",
 		"test": "npx playwright test",
 		"lint": "eslint --fix .",
 		"eslint": "eslint ."
@@ -92,14 +88,14 @@
 		"electron-debug": "^3.2.0",
 		"electron-updater": "^5.0.1",
 		"protons": "^2.0.3",
-		"qrcode-decoder": "^0.2.2",
+		"qrcode-decoder": "^0.3.1",
 		"qrcode-generator": "^1.4.4"
 	},
 	"devDependencies": {
 		"@playwright/test": "^1.22.2",
 		"@tailwindcss/forms": "^0.5.2",
 		"concurrently": "^7.2.1",
-		"electron": "^19.0.0",
+		"electron": "^19.0.1",
 		"electron-builder": "^23.0.9",
 		"eslint": "^8.16.0",
 		"eslint-config-prettier": "^8.5.0",
@@ -109,7 +105,6 @@
 		"eslint-plugin-promise": "^6.0.0",
 		"prettier": "^2.6.2",
 		"prettier-plugin-tailwindcss": "^0.1.11",
-		"sass": "^1.52.1",
 		"tailwindcss": "^3.0.24"
 	},
 	"engines": {

styles/global.css

@@ -1 +1,4 @@
-*,::before,::after{font-family:system-ui,Arial,Helvetica,sans-serif;margin:0;padding:0;outline:none;border-width:0;border-style:solid;border-color:theme("borderColor.default", currentColor);user-select:none}body{color:#fff;box-sizing:border-box;display:flex;flex-direction:column;min-height:100vh;background:#0a0a0a}::selection{color:#fff;background:gray}::-webkit-scrollbar-track{background-color:#000}::-webkit-scrollbar{width:12px;background-color:#f5f5f5}::-webkit-scrollbar-thumb{background-color:#282828}::-webkit-scrollbar-thumb:hover{background-color:#323232}::-webkit-scrollbar-corner{background-color:#000}hr{margin-top:30px;color:#fff;border-width:1px}h1{font-size:64px;font-weight:bold;margin:2rem}h2{font-size:48px;font-weight:bold;margin:2rem}h3{font-size:32px;font-weight:bold;margin:2rem}h4{font-size:24px;margin:2rem;font-weight:normal}h5{font-size:18px;margin:2rem;font-weight:normal}a{font-weight:500}@keyframes fadeEffect{from{opacity:0}to{opacity:1}}@media(prefers-reduced-motion){@keyframes fadeEffect{from{opacity:1}to{opacity:1}}}.animation{animation:fadeEffect .5s}details[open] summary~*{animation:fadeEffect .5s ease-in-out}.custom-titlebar{color:#fff !important;font-weight:500 !important}.custom-titlebar-controls{display:none !important}.custom-titlebar-submenu{background-color:#191919 !important;text-transform:capitalize !important;border-top-right-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px}.custom-titlebar-separator{margin:8px 0px !important;background-color:#282828 !important;opacity:1 !important}.link:link{color:#fff;font-size:24px;font-weight:bold;transition:.2s ease-in;text-decoration:underline !important}.link:hover{color:gray;text-decoration:underline !important}.link:visited{color:#fff;text-decoration:none !important}.toggle:checked~.toggle-bg{background-color:#000 !important;transition:.2s ease-in}.input:hover~#show_pass_0{transition:.2s ease-in;stroke:#fff}.input:hover~#show_pass_01{transition:.2s ease-in;stroke:#fff}.input:hover~#show_pass_1{transition:.2s ease-in;stroke:#fff}.input:hover~#show_pass_11{transition:.2s ease-in;stroke:#fff}.input::placeholder{color:gray;font-weight:normal}.buttoni>svg{position:relative;top:4px}.buttonc>svg{position:relative;top:4px}.buttonm>svg{position:relative;top:4px}.buttonmselected{background-color:#1e1e1e !important;border-color:#1e1e1e !important}.dialog{text-align:center;background-color:#191919 !important;color:#fff;padding:3rem;border-radius:15px;margin:auto}.dialog>*{margin:0 0 .5rem 0}.dialog::backdrop{background:rgba(0,0,0,.9)}dialog[open]{animation:fadeEffect .5s}.tooltipContainer:hover .tooltip{animation:fadeEffect .5s;visibility:visible;z-index:50}.tooltipContainer>svg{animation:fadeEffect .5s;position:relative;top:1rem}.progress{position:relative;width:81%;height:15px;background:#1e1e1e;border-radius:30px;overflow:hidden}.progressFill{width:0%;height:100%;background:#fff;transition:all .2s}
+@import "./partials/layout.css";
+@import "./partials/components.css";
+@import "./partials/titlebar.css";
+@import "./partials/animation.css";

styles/tailwind.scss → styles/index.css

@@ -38,6 +38,10 @@
 	.tooltip {
 		@apply invisible absolute -mt-6 rounded-xl bg-white p-2 text-black;
 	}
+
+	.dialog {
+		@apply m-auto rounded-2xl bg-gray-700 p-12 text-center text-white;
+	}
 }
 
 @layer base {

styles/partials/components/components.scss → styles/partials/components.css

@@ -70,20 +70,6 @@
 	border-color: rgb(30, 30, 30) !important;
 }
 
-/* dialog */
-.dialog {
-	text-align: center;
-	background-color: #191919 !important;
-	color: white;
-	padding: 3rem;
-	border-radius: 15px;
-	margin: auto;
-
-	& > * {
-		margin: 0 0 0.5rem 0;
-	}
-}
-
 .dialog::backdrop {
 	background: rgb(0 0 0 / 0.9);
 }