rowan/multi-account-containers
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added dark mode support on the settings page

Browse source 
Updated p, label color for light mode, removed commented code
This commit is contained in:
Maxx Crawford 2020-05-26 22:31:13 -05:00
parent 765a0eb727
commit b47844b43a
3 changed files with 41 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/css/options.css Normal file
View file

@ -0,0 +1,28 @@
body {
background: #fff;
color: #202023;
}
h3 {
margin-block-start: 2.5rem;
}
h3:first-of-type {
margin-block-start: 1rem;
}
p,
label {
color: rgb(74, 74, 79);
}
@media (prefers-color-scheme: dark) {
body {
background: #202023;
color: #fff;
}
p,
label {
color: rgb(177, 177, 179);
}
}

3
src/manifest.json
View file

@ -143,6 +143,7 @@
"/img/container-site-d-24.png"
],
"options_ui": {
"page": "options.html"
"page": "options.html",
"browser_style": true
}
}

13
src/options.html
View file

@ -3,20 +3,25 @@
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/options.css">
</head>
<body>
<form>
<h3>Optional Permissions:</h3>
<label>
<input type="checkbox" id="bookmarksPermissions">
Enable Bookmark Menus
</label>
<p>This setting allows you to open a bookmark or folder of bookmarks in a container.</p>
<p><em>This setting allows you to open a bookmark or folder of bookmarks in a container.</em></p>
<h3>Firefox Accounts Sync:</h3>
<label>
<input type="checkbox" id="syncCheck">
Enable Sync
</label>
<p>This setting allows you to sync your containers and site assignments across devices.</p>
<p><em>This setting allows you to sync your containers and site assignments across devices.</em></p>
<h3>Keyboard Shortcuts:</h3>
<p><em>Edit which container is opened when using the numbered shortcuts.</em></p>
<p><label>
Container to open with Keyboard Shortcut 1
<select id="open_container_0">
@ -67,7 +72,9 @@
<select id="open_container_9">
</select>
</label></p>
<button>Reset Onboarding Panels </button>
<h3>Onboarding:</h3>
<button>Reset Onboarding Panels</button>
<p><em>Toggle this to see the onboarding panels again.</em></p>
</form>
<script src="js/options.js"></script>
</body>