Page 1 of 1

night mode theme for website

Posted: Sat Jun 04, 2016 10:20 pm
by joelweight
I use night mode exclusively in the gospel library on my mobile app. Because of that, the yellow underline looks the best for my marking. I have found that when I go to the scriptures on the website I can't even see many of my highlights because of the yellow underline on white background. Is there a "night mode" for the website that I can apply without having to resort to a browser plugin to manually tweak the css?

Re: night mode theme for website

Posted: Mon Jun 06, 2016 1:19 pm
by sbradshaw
No, LDS.org doesn't have a night mode.

Re: night mode theme for website

Posted: Mon Jan 20, 2020 8:59 pm
by tylerslaughter
1) Install the extension: Amino - https://chrome.google.com/webstore/deta ... f?hl=en-US
2) Now navigate to the church website, then open the extension and hit the button that says domain in the extension window
3) Paste this script inside the editor and hit save
now keep in mind that this is a CSS script, meaning that there is no possible way for it to steal your information...
NOTE: This was not made for the main website, but will work very well somewhere like here for an example: https://www.churchofjesuschrist.org/stu ... n?lang=eng

:not(span) {
background: transparent !important;
color: white !important;
}

html:root {
--background-primary: rgb(46, 46, 46);
}

#app, header, nav, body, html, #flexContainer, article, section, section * {
background: var(--background-primary) !important;
}

a, .tree_item, .branch, select, *::after, .iconLink, #PFmainNavLinks, button path {
color: skyblue !important;
text-shadow: 0 0 7.5px lime !important;
fill: skyblue !important;
}
a:visited, .currentselected {
&, * {
color: powderblue !important;
}
}

img, svg, svg * {
background: radial-gradient(rgba(191, 255, 0, .3), transparent 75%) !important;
}

path {
fill: white;
}

nav ul span {
border-radius: 5px;
}

.navArrow {
box-shadow: inset 0 0 10px skyblue;
margin: 2px;
}

a::after {
background: inherit !important;
}

* {
::-webkit-scrollbar {
width: 8px;
}

::-webkit-scrollbar-thumb {
border-radius: 5px 3px 3px 5px !important;
background: gray !important;
&:hover {
background: dimgray !important;
}
}

::-webkit-scrollbar-track {
background: rgba(0,0,0, 0.1) !important;
}
}

Re: night mode theme for website

Posted: Tue Jan 21, 2020 11:04 am
by sbradshaw
Gospel Library does have Night and Sepia themes now (though unfortunately the header remains bright).
https://www.churchofjesuschrist.org/study/lib?lang=eng
The theme can be changed using the gear icon in the top right.

Re: night mode theme for website

Posted: Sat Sep 11, 2021 12:32 pm
by msrobins
When using the Chrome browser, you can get similar results, but for all webpages, by doing the following:

Make sure you are prepared to close all of your current chrome tabs as a relaunch will be required as a last step

Go to: chrome://flags
Search "Force Dark Mode for Web Contents"
Change Default to Enabled
Relaunch

Re: night mode theme for website

Posted: Wed Oct 25, 2023 4:36 am
by jecm1234
below your profile picture clic on the thee dots, then display then choose dark.