devol
/
libredirect
mirror of https://codeberg.org/LibRedirect/libredirect.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fixing colors and some bugs #27

This commit is contained in:
ManeraKai 2022-02-08 20:30:50 +03:00
parent 343ab3bbc0
commit b715e43553
No known key found for this signature in database
GPG Key ID: 5ABC31FFD562E337
15 changed files with 83 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/pages/options/general/general.html
View File

@ -4,8 +4,9 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options</title>
<title>LibRedirect options</title>
</head>
<body class="option">
@ -39,9 +40,9 @@
</a>
</div>
<script type="module" src="../init.js"></script>
<script type="module" src="./general.js"></script>
<!-- <script src="../../assets/javascripts/localise.js"></script> -->
<script type="module" src="../init.js"></script>
<script type="module" src="./general.js"></script>
<!-- <script src="../../assets/javascripts/localise.js"></script> -->
</body>
</html>

13
src/pages/options/general/general.js
View File

@ -49,19 +49,6 @@ browser.storage.sync.get(
themeElement.addEventListener("change", (event) => {
const value = event.target.options[theme.selectedIndex].value;
switch (value) {
case "dark-theme":
document.body.classList.add("dark-theme");
document.body.classList.remove("light-theme");
break;
case "light-theme":
document.body.classList.add("light-theme");
document.body.classList.remove("dark-theme");
break;
default:
document.body.classList.remove("light-theme");
document.body.classList.remove("dark-theme");
}
browser.storage.sync.set({ theme: value });
});

33
src/pages/options/init.js
View File

@ -1,3 +1,30 @@
browser.storage.sync.get("theme", (result) => {
if (result.theme) document.body.classList.add(result.theme);
})
function changeTheme() {
browser.storage.sync.get("theme", (result) => {
console.log("Chaning Theme")
switch (result.theme) {
case "dark-theme":
document.body.classList.add("dark-theme");
document.body.classList.remove("light-theme");
break;
case "light-theme":
document.body.classList.add("light-theme");
document.body.classList.remove("dark-theme");
break;
default:
if (matchMedia("(prefers-color-scheme: light)").matches) {
document.body.classList.add("light-theme");
document.body.classList.remove("dark-theme");
} else {
document.body.classList.add("dark-theme");
document.body.classList.remove("light-theme");
}
}
})
}
changeTheme()
browser.storage.onChanged.addListener(changeTheme)
window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", changeTheme)

1
src/pages/options/instagram/instagram.html
View File

@ -5,6 +5,7 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
</head>

3
src/pages/options/maps/maps.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

3
src/pages/options/medium/medium.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

3
src/pages/options/reddit/reddit.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

3
src/pages/options/search/search.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

3
src/pages/options/translate/translate.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

3
src/pages/options/twitter/twitter.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

3
src/pages/options/wikipedia/wikipedia.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

3
src/pages/options/youtube/youtube.html
View File

@ -5,8 +5,9 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="../../../assets/images/libredirect.svg" />
<link href="../../stylesheets/styles.css" rel="stylesheet" />
<title>LibRedirect Options: Twitter</title>
<title>LibRedirect options: Twitter</title>
</head>
<body class="option">

1
src/pages/popup/popup.html
View File

@ -84,6 +84,7 @@
</div>
<script type="module" src="../options/init.js"></script>
<script type="module" src="./popup.js"></script>
<script src="../../assets/javascripts/localise.js"></script>
</body>

1
src/pages/popup/popup.js
View File

@ -25,7 +25,6 @@ let disableMediumElement = document.querySelector("#disable-scribe");
window.browser = window.browser || window.chrome;
async function wholeInit() {
console.log("staring async func")
await youtubeHelper.init();
await twitterHelper.init();
await instagramHelper.init();

75
src/pages/stylesheets/styles.css
View File

@ -10,11 +10,6 @@ body {
--light-grey: #c3c3c3;
}
body.light-theme {
--text: #000;
--bg-main: #e3e7ea;
--bg-secondary: #fff;
}
body {
margin: auto;
@ -130,29 +125,6 @@ hr {
border: none;
}
.light-theme.popup,
.light-theme .popup {
background-color: var(--bg-secondary);
}
body.light-theme {
--text: #000;
--bg-main: #e3e7ea;
--bg-secondary: #fff;
}
body.light-theme textarea {
color: black;
border: 1px solid #767676;
}
body.light-theme textarea:focus {
outline: none;
}
body.light-theme a {
color: black;
}
div.some-block {
padding: 0 15px;
@ -301,22 +273,35 @@ button.add {
cursor: pointer;
}
.light-theme.popup,
.light-theme .popup {
background-color: var(--bg-secondary);
}
body.light-theme {
--text: black;
--bg-main: white;
--bg-secondary: #fff;
--active: #fb9817;
}
body.light-theme select {
border: 1px solid black;
}
body.light-theme textarea {
color: black;
border: 1px solid #767676;
}
body.light-theme textarea:focus {
outline: none;
}
body.light-theme a {
color: black;
}
@media (prefers-color-scheme: light) {
body {
--text: #000;
--text-secondary: #fff;
--bg-main: #e3e7ea;
--bg-secondary: #fff;
}
body.dark-theme {
--text: #fff;
--text-secondary: #000;
--bg-main: #3c4043;
--bg-secondary: #292a2d;
}
.popup {
background-color: var(--bg-secondary);
}
}