From 9cbc0e8c7fbc190f7d51398d4e1f5b5065f2aa66 Mon Sep 17 00:00:00 2001
From: Front <27463495+Frontesque@users.noreply.github.com>
Date: Wed, 1 Dec 2021 16:46:56 -0500
Subject: :white_circle: Toggle Switches in Advanced
+ Added themed toggle switches in advanced settings
---
Extensions/chrome/popup.css | 57 +++++++++++++++++++++-
Extensions/chrome/popup.html | 14 +++++-
Extensions/firefox/popup.css | 57 +++++++++++++++++++++-
Extensions/firefox/popup.html | 14 +++++-
temp/index.html | 46 ------------------
temp/popup.css | 107 ------------------------------------------
temp/popup.js | 59 -----------------------
7 files changed, 138 insertions(+), 216 deletions(-)
delete mode 100644 temp/index.html
delete mode 100644 temp/popup.css
delete mode 100644 temp/popup.js
diff --git a/Extensions/chrome/popup.css b/Extensions/chrome/popup.css
index 2f54c1d..cfc556b 100644
--- a/Extensions/chrome/popup.css
+++ b/Extensions/chrome/popup.css
@@ -1,8 +1,11 @@
/* Variables */
:root {
+ --primary: #CC2929;
+ --accent: #581111;
+
--background: #111;
- --primary: #ff4444;
--secondary: #272727;
+ --lightGrey: #999;
--white: #fff;
}
@@ -41,4 +44,56 @@ button {
border: 2px solid var(--secondary);
border-radius: 4px;
padding: 0.5em;
+}
+
+/* Switches */
+.switch {
+ position: relative;
+ display: inline-block;
+ width: 30px;
+ height: 17px;
+ margin-bottom: 0.5em;
+}
+
+.switch input {
+ display: none;
+}
+
+.slider {
+ position: absolute;
+ cursor: pointer;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: var(--secondary);
+ transition: .4s;
+ border-radius: 34px;
+}
+
+.slider:before {
+ position: absolute;
+ content: '';
+ height: 13px;
+ width: 13px;
+ left: 2px;
+ bottom: 2px;
+ background: var(--lightGrey);
+ transition: .4s;
+ border-radius: 50%;
+}
+
+input:checked+.slider {
+ background: var(--accent);
+}
+
+input:checked+.slider:before {
+ transform: translateX(13px);
+ background: var(--primary);
+}
+
+.switchLabel {
+ width: 250px !important;
+ transform: translateX(35px);
+ display: inline-block;
}
\ No newline at end of file
diff --git a/Extensions/chrome/popup.html b/Extensions/chrome/popup.html
index 218814e..4cefcd0 100644
--- a/Extensions/chrome/popup.html
+++ b/Extensions/chrome/popup.html
@@ -23,7 +23,19 @@
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo laboriosam, veritatis sint dolores assumenda harum quidem molestiae ad repellendus aliquid?
+
+
+
+
+
diff --git a/Extensions/firefox/popup.css b/Extensions/firefox/popup.css
index a9b86ad..f5df55f 100644
--- a/Extensions/firefox/popup.css
+++ b/Extensions/firefox/popup.css
@@ -1,8 +1,11 @@
/* Variables */
:root {
+ --primary: #CC2929;
+ --accent: #581111;
+
--background: #111;
- --primary: #ff4444;
--secondary: #272727;
+ --lightGrey: #999;
--white: #fff;
}
@@ -42,4 +45,56 @@ button {
border-radius: 4px;
padding: 0.5em;
margin-right: 1em; /* FIREFOX ONLY */
+}
+
+/* Switches */
+.switch {
+ position: relative;
+ display: inline-block;
+ width: 30px;
+ height: 17px;
+ margin-bottom: 0.5em;
+}
+
+.switch input {
+ display: none;
+}
+
+.slider {
+ position: absolute;
+ cursor: pointer;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: var(--secondary);
+ transition: .4s;
+ border-radius: 34px;
+}
+
+.slider:before {
+ position: absolute;
+ content: '';
+ height: 13px;
+ width: 13px;
+ left: 2px;
+ bottom: 2px;
+ background: var(--lightGrey);
+ transition: .4s;
+ border-radius: 50%;
+}
+
+input:checked+.slider {
+ background: var(--accent);
+}
+
+input:checked+.slider:before {
+ transform: translateX(13px);
+ background: var(--primary);
+}
+
+.switchLabel {
+ width: 250px !important;
+ transform: translateX(35px);
+ display: inline-block;
}
\ No newline at end of file
diff --git a/Extensions/firefox/popup.html b/Extensions/firefox/popup.html
index 218814e..2b70f14 100644
--- a/Extensions/firefox/popup.html
+++ b/Extensions/firefox/popup.html
@@ -23,7 +23,19 @@
- Lorem ipsum dolor sit amet consectetur adipisicing elit. Nemo laboriosam, veritatis sint dolores assumenda harum quidem molestiae ad repellendus aliquid?
+
+
+
+
+
diff --git a/temp/index.html b/temp/index.html
deleted file mode 100644
index b64973c..0000000
--- a/temp/index.html
+++ /dev/null
@@ -1,46 +0,0 @@
-
-
-
-
-
- Return Youtube Dislike
-
-
-
-
-
-
-
-
- Return Youtube Dislike
- by Dmitrii Selivanov & Community
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/temp/popup.css b/temp/popup.css
deleted file mode 100644
index 772e891..0000000
--- a/temp/popup.css
+++ /dev/null
@@ -1,107 +0,0 @@
-/* Variables */
-:root {
- --primary: #ff6666;
- --accent: #ffaaaa;
-
- --background: #111;
- --secondary: #272727;
- --lightGrey: #999;
- --white: #fff;
-}
-
-/* Window Styling */
-html,
-body {
- background-color: var(--background);
- color: var(--white);
- width: 300px;
- padding: 0.5em;
- font-family: Arial, Helvetica, sans-serif;
- font-size: 14px;
-}
-
-h1 {
- font-size: 26px;
-}
-
-button {
- color: var(--white);
- background: var(--secondary);
- cursor: pointer;
- padding: 5px 16px;
- border: none;
- border-radius: 4px;
- font-weight: 500;
- box-shadow: 0 2px 4px -1px rgb(0 0 0 / 20%), 0 4px 5px 0 rgb(0 0 0 / 14%), 0 1px 10px 0 rgb(0 0 0 / 12%);
-}
-
-#advancedToggle {
- margin-top: 1em;
- margin-bottom: 2em;
-}
-
-#advancedSettings {
- display: none;
- border: 2px solid var(--secondary);
- border-radius: 4px;
- padding: 0.5em;
- margin-right: 1em; /* FIREFOX ONLY */
-}
-
-#ratio_bar_colour {
- border: none;
- outline: none;
- background: none;
-}
-
-/* Switches */
-.switch {
- position: relative;
- display: inline-block;
- width: 30px;
- height: 17px;
- margin-bottom: 0.5em;
-}
-
-.switch input {
- display: none;
-}
-
-.slider {
- position: absolute;
- cursor: pointer;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background: var(--secondary);
- transition: .4s;
- border-radius: 34px;
-}
-
-.slider:before {
- position: absolute;
- content: '';
- height: 13px;
- width: 13px;
- left: 2px;
- bottom: 2px;
- background: var(--lightGrey);
- transition: .4s;
- border-radius: 50%;
-}
-
-input:checked+.slider {
- background: var(--accent);
-}
-
-input:checked+.slider:before {
- transform: translateX(13px);
- background: var(--primary);
-}
-
-.switchLabel {
- width: 250px !important;
- transform: translateX(35px);
- display: inline-block;
-}
\ No newline at end of file
diff --git a/temp/popup.js b/temp/popup.js
deleted file mode 100644
index 12dd0c3..0000000
--- a/temp/popup.js
+++ /dev/null
@@ -1,59 +0,0 @@
-/* Config */
-const config = {
- advanced: false,
- showAdvancedMessage: "Show Advanced",
- hideAdvancedMessage: "Hide Advanced",
-
- links: {
- website: 'https://returnyoutubedislike.com',
- github: 'https://github.com/Anarios/return-youtube-dislike',
- discord: 'https://discord.gg/mYnESY4Md5'
- },
-};
-
-/* Links */
-document.getElementById('link_website').addEventListener('click', () => {
- chrome.tabs.create({
- url: config.links.website
- });
-});
-
-document.getElementById('link_github').addEventListener('click', () => {
- chrome.tabs.create({
- url: config.links.github
- });
-});
-
-document.getElementById('link_discord').addEventListener('click', () => {
- chrome.tabs.create({
- url: config.links.discord
- });
-});
-
-/* Advanced Toggle */
-const advancedToggle = document.getElementById('advancedToggle');
-advancedToggle.addEventListener('click', () => {
- const adv = document.getElementById('advancedSettings');
- if (config.advanced) {
- adv.style.display = "none";
- advancedToggle.innerHTML = config.showAdvancedMessage;
- config.advanced = false;
- } else {
- adv.style.display = "block";
- advancedToggle.innerHTML = config.hideAdvancedMessage;
- config.advanced = true;
- }
-});
-
-
-
-/* popup-script.js
-document.querySelector('#login')
-.addEventListener('click', function () {
- chrome.runtime.sendMessage({ message: 'get_auth_token' });
-});
-
-document.querySelector("#log_off").addEventListener("click", function () {
- chrome.runtime.sendMessage({ message: "log_off" });
-});
-*/
\ No newline at end of file
--
cgit v1.2.3