Stylish Theme for Logos Forums
I'm not a designer!!! This is just something I've wanted to toy with for a while. It's a less white theme that's hopefully easier on my eyes. The colors aren't quite right[1] and it could obviously be improved by a pro, but maybe others will find it helpful. I've just finished tinkering with it and haven't spent a great deal of time using it yet so changes/fixes are likely to come. Feedback / Suggestions welcome.
Install the Stylish plugin for your browser (Chrome, Firefox, Safari), then go to the following link and install the theme: https://userstyles.org/styles/158383/logos-community-forums
1. The colors I've changed are all variations (darkened, lightened, desaturated variations) on three colors: a) the color of the header on logos.com which is a reddish tinted grey; b) logos blue; c) the compliment of logos blue - orange.
Comments
-
I'll give it a shot. Thanks for sharing.
0 -
Thank for sharing.[Y]
0 -
I like it. Thanks for sharing.
Philippians 2:3Do nothing from selfish ambition or conceit, but in humility count others more significant than yourselves.
0 -
Thanks for giving it a try.
A few improvements since I posted:
- When you hover over a person's avatar, it pops out a 2x popout. See pic below. The animation isn't quite right. If you approach the avatar to hover from the left side it dances around a bit. And the drop shadow effect causes a little oddness for avatar pics that are smaller than the 2x size.
- Animated the Post, More, Compose, etc butttons.
- Restyled the More drop down menu.
- A bit of restyling in the compose window.
- Flipped back to the more conservative shades of blue on the topic/thread lists. I'm still torn between that and shades of orange.
- Experimented with Font stacks and settled on the Wordpress font stack. Experimented with sizes a little, but found the forum defaults to be about right in most places.
To update to the latest version: Click the Stylish icon on your browser toolbar, then the kabob menu at the upper right of the popup menu, and select 'Manage All Styles'. From there, click on 'Check for Update'. If there is an update it will change to a button labeled 'Update Now'. If there isn't an update it will show a message that 'Style is up to date'. Update often.
TODO:
- Restyle the profile and search results pages. And the Insert media dialog, etc.
- Tons of pixel nudging, resizing, and hover color fixes, etc.
- Cleanup and organize the CSS which clearly got away from me. (It would be awesome if SASS were supported.)
- Decide on blockquote style.
Avatar Popout:
0 -
I like it, Randy, thanks a lot! For a page that I stare at so often, it's nice to see some TLC.
Logos 10 | Dell Inspiron 7373 | Windows 11 Pro 64, i7, 16GB, SSD | iPhone 13 Pro Max
0 -
I think it is finished. I've adjusted the theme on all forum pages: home, thread view, post view, reply, quick reply, insert media, html view, profile view, edit profile, etc. Tons of tweaks all over to improve consistency. And the source files have been SASSified for easier modification and posted on github. Please let me know if I've missed anything or you have any other feedback.
If you are already using the theme just update. If you are not, why not? [:D]
0 -
I tried to install. You said it worked with Safari but when I go to the 2nd link and click Install with Stylish it takes me to a Chrome Web App page, which of course doesn't work with Safari.
Dr. Kevin Purcell, Director of Missions
Brushy Mountain Baptist Association0 -
Nice. Thanks. [:)]
0 -
It's a peach! Thanks, Randy
Meanwhile, Jesus kept on growing wiser and more mature, and in favor with God and his fellow man.
International Standard Version. (2011). (Lk 2:52). Yorba Linda, CA: ISV Foundation.
MacBook Pro MacOS Sequoia 15.2 1TB SSD
0 -
Randy, I just installed it on Firefox and it works like a dream. Thanks so much!
Now I just have to get used to the new look. [:)]
Using adventure and community to challenge young people to continually say "yes" to God
0 -
Kevin A. Purcell said:
I tried to install. You said it worked with Safari but when I go to the 2nd link and click Install with Stylish it takes me to a Chrome Web App page, which of course doesn't work with Safari.
Unfortunately, I don't have a Mac to test Safari. It sounds like you did get the extension installed? If the extension UI is the same:
- On the UserStyles page, below the install button is a button, "Show CSS code". Select and copy the code.
- In Safari, open the extension, click the kebab menu in the upper right, and select Create New Style.
- Ignore the right side. On the left, enter a Name for the style, and below that click on Import and paste in the code.
- Finally, click the Save button.
Sorry, I don't have a mac to test on, but that should be close to the correct instructions.
0 -
I have just aded the two with a Mac, worked well
0 -
Minor Update since last post:
- Updated header: rebranded, styled navigation links, added icons from Google's 'Material Icons' font.
- Switched from remote loading SVG icons on Profile page to using the 'Material Icons' font.
- Fixed ugly blank box on Favorites page.
- Added shadows and animations in a few more places.
There is still a good bit that I haven't been able to change the way I'd like because I can't find selectors to differentiate and target individual elements in some cases. IE. Changing a certain element causes changes throughout all the forum pages containing that element which looks a bit odd in some cases but still acceptable, I think. This is still a learning experience for me; first real use of CSS.
Update your theme at: https://userstyles.org/styles/158383/white-off-for-logos-community-forums
0 -
I appreciate your effort on this! I originally brushed it off as something I wouldn't even notice, but it's a great enhancement to my experience reading the forums. Thank you!
Lew
0 -
Thanks, Randy - very nice
[:D]Pastor Glenn Crouch
St Paul's Lutheran Church
Kalgoorlie-Boulder, Western Australia0 -
Perfect. Nice!
Thanks for sharing
Luuk
0 -
Randy, I've been enjoying your enhancements for several days now. I really appreciate your work. Thanks very much, Dale.[:D][Y]
0 -
If I wanted to install this- do I use the first link that started this post, or the most recent one?
Thanks!
0 -
Michael S. said:
If I wanted to install this- do I use the first link that started this post, or the most recent one?
The links in the top post point to the always current version. I do continue to make periodic updates as I notice styling problems, work to unify the design or learn new techniques, and you can always revisit that link to update to the most current.
BTW, For those interested in similarly themeing your browser:
- Dark Horizon is a great one for Chrome I recently stumbled on.
- Firefox has a nice Dark theme already built in (under Addons | Theme), but I also like Firefox Carbon.
These are native browser themes, not UserStyles. I like these because the greys look classy while keeping your attention on the content rather than the UI. I think they work well with the themeing of forums.
0 -
All very nice! Is there a plugin/extension for Edge?
0 -
Rick Ausdahl said:
All very nice! Is there a plugin/extension for Edge?
Yes!. Thanks for asking as I haven't got around to trying in Edge. The instructions are a bit different because here are no style extensions available yet that I can see. Do this instead:
- Install the Tampermonkey extension from the Microsoft Store.
- When it installs you should get a confirmation dialog, select "Turn it on"
- Go to the theme on UserStyles
- Scroll down to the link "Install style as userscript" and click on it.
- Then click the Install button on the page that opens.
The procedure for updating after it is already installed:
- Click the Tampermonkey icon on the Edge toolbar on the right side
- Select "Check for userscript updates"
Tampermonkey extension also works in Chrome, Microsoft Edge, Safari, Opera Next, and Firefox. And is a good alternative.
EDIT: Actually, Tampermonkey automatically updates scripts once a day by default. I had thought this defaulted to off. So you don't have to worry about the update procedure above. That makes Tampermonkey the preferable extension if you want automatic updates or if you are already using Tampermonkey anyway.
0 -
Wonderful! I know Edge has taken a lot heat since it replaced IE as Microsoft's default browser, so I was really expecting the answer to be "No". So a pleasant surprise. I'd never heard of Tampermonkey, but I'll install it, give the process a try, and report back.Randy W. Sims said:Rick Ausdahl said:All very nice! Is there a plugin/extension for Edge?
Yes!. Thanks for asking as I haven't got around to trying in Edge. The instructions are a bit different because here are no style extensions available yet that I can see. Do this instead:
- Install the Tampermonkey extension from the Microsoft Store.
- When it installs you should get a confirmation dialog, select "Turn it on"
- Go to the theme on UserStyles
- Scroll down to the link "Install style as userscript" and click on it.
- Then click the Install button on the page that opens.
The procedure for updating after it is already installed:
- Click the Tampermonkey icon on the Edge toolbar on the right side
- Select "Check for userscript updates"
Tampermonkey extension also works in Chrome, Microsoft Edge, Safari, Opera Next, and Firefox. And is a good alternative.
EDIT: Actually, Tampermonkey automatically updates scripts once a day by default. I had thought this defaulted to off. So you don't have to worry about the update procedure above. That makes Tampermonkey the preferable extension if you want automatic updates or if you are already using Tampermonkey anyway.
Thanks, Randy.
0 -
Very, very nice, Randy!
You said you're not a "designer", but I think you must be. Maybe not by profession, but for sure at heart.
Thanks for this very appealing and easy-on-the-eyes makeover.
[Y][Y]
0 -
EXPERIMENTAL ADD-ON:
While working on the theme, styling the searchbar, I thought I'd take a shot at a userscript to send all searches to google any time you use the search on the forums, in place of the forum search. I have it partly working: you can type your search in to the searchbar (including google syntax) and click the search button with the mouse and get google search results, limited by site:community.logos.com. You can Ctrl-Click to get google search results limited by (site:community.logos.com OR wiki.logos.com). Unfortunately, I haven't got the <Enter> key to search google. It still uses the often non-working forum search. And I'm not yet clear on whether Ctrl-Click equates to Cmd-Click on Mac or if that's a different key: haven't had a chance to look in to it yet.
This is completely independent of the theme. You can install one or the the other or both. For this script you need to install TamperMonkey for your browser.
A bit of WARNING: TamperMonkey is safe. The theme and this search add-on are safe. There are many great and useful scripts you can install in TamperMonkey to enhance websites greatly. But there are also a lot of malicious scripts out there too. Like anything else on the net, know what you're getting and make sure it's trustworthy.
You can install the Search Script from: https://greasyfork.org/en/scripts/369856-faithlife-community-forum-search2g
---
I wasn't gonna post more updates on the theme until I finished but since I'm posting I'll mention that I've updated the styling of the searchbar, completely updated the form used to post replies, quick replies (gradient, icons, state styling), updated the quote styling. I've done a huge amount of code restructuring and polishing of the theme as well as making things more consistent throughout, especially shadows, though I still have a lot to do--mostly in the smaller dialogs and modals. If you installed the theme through TamperMonkey, you already have the updates. Otherwise, update here.
0 -
Randy W. Sims said:
While working on the theme, styling the searchbar, I thought I'd take a shot at a userscript to send all searches to google any time you use the search on the forums, in place of the forum search. I have it partly working...
I now have this working. This script alters the searchbar in the forums:
- Type your search in the search bar and press Enter or click the search button and you will be taken to Google search:
site:community.logos.com <YOUR SEARCH TERMS> - Type your search in the search bar and press Ctrl-Enter or hold Ctrl and click the search bar and you will be taken to Google search:
(site:community.logos.com OR site:wiki.logos.com) <YOUR SEARCH TERMS> - Type your search in the search bar and press Shift-Enter or hold Shift and click the search button and you will get the default forum search. With one little problem: Shift-Click opens in a new window and I haven't figured out yet how to prevent that.
The link to the search script is in the post above.
EDIT: Added Alt+S shortcut key to activate the search box.
0 - Type your search in the search bar and press Enter or click the search button and you will be taken to Google search:
-
Thanks for this, Randy - your work is appreciated!!! [Y]
Pastor Glenn Crouch
St Paul's Lutheran Church
Kalgoorlie-Boulder, Western Australia0 -
Randy, this is sooooooo cool brother. Thank you for using your talents to be a blessing to all of us. We owe you a debt of gratitude sir
Myke Harbuck
Lead Pastor, www.ByronCity.Church
Adjunct Professor, Georgia Military College0 -
Stylish appears to have been pulled by Chrome, Firefox and Opera due to privacy intrusions. See article: https://nakedsecurity.sophos.com/2018/07/06/chrome-and-firefox-pull-history-stealing-browser-extension/
0 -
This is great, thanks! [Y]
0
