You are not logged in.
This thread is a repost from CrunchBang forums. It is for discussion, setups and tips about CSS user styles for web pages and tweaking UI in web browsers. We can share handy styles we find from http://userstyles.org/, home brewed styles or userChrome and userContent setups.
With user styles you can theme webpages (individual sites or globally) or change user interface of a browser. Styles can be managed with browser addons:
Interface can also be changed by userChrome.css and site looks by userContent.css.
Related threads in Bunsenlabs forums:
Related threads in CrunchBang forums:
Firefox/Iceweasel reader mode: How to change the font families
Getting Started in userChrome.css
Help for Smaller Screens
Last edited by nore (2015-10-29 10:42:23)
Offline
nobody served us with beautiful forum theme and improvements on userstyles.org. Some like the light ones, others prefer the dark side. I need to have a bit more contrast though, if I'm going to read the posts longer than a minute, especially on a small screen. (With small I mean anything below 20 inch.) That's why I made myself a style for just darkening the texts and lightening the backgrounds.
Offline
Nore, this is great work, and a good example to any others who'd like to help keep the content on the #! forums accessible by useful linking from posts here at BL.
Cheers!
Last edited by johnraff (2015-10-03 04:12:40)
...elevator in the Brain Hotel, broken down but just as well...
( a boring Japan blog (currently paused), now on Bluesky, there's also some GitStuff )
Offline
Nuclear option for my userContent.css usually.
Global changes do break stuff like buttons and such but dangit I don't care
because it matches the rest of my theme .
pretty simple for me
* {
font-family:verdana !important;
background-color: #c5b994 !important;
color:#403a30 !important;
font-size:13px !important;
border-collapse:collapse !important;
}
div, td {
color:#403a30 !important;
border-color: #403a30 !important;
}
select {
color: #c5b994 !important;
background: #c5b994 !important;
}
input {
font-size:12px !important;
color:#403a30 !important;
}
input[type=radio] {
width:auto !important;
color: #403a30 !important;
}
input[type=submit] {
text-align:center !important;
background:#c5b994 !important;
}
input[name=q] {
background:#c5b994 !important;
padding:2px 5px !important;
}
label {
color:#403a30 !important;
font-size:12px !important;
}
a:link {
color:#202020 !important;
text-decoration:none !important;
}
a:visited {
color:#403a30 !important;
text-decoration:none !important;
}
a:hover {
color:#403a30 !important;
}
Offline
Offline
Nice colorscheme. Some elements look interesting: do you see a white background beside #C5B994 in codebox in these forums? Sorry, two styles were interferring.
Now I see, what you see.
http://s11.postimg.org/jjc2cmlxb/Screenshot_03_10_2015_21_25_35.jpg
That looks incredible....except for that nasty Firefox blue download arrow (which I know isn't your fault).
"All we are is dust in the wind, dude"
- Theodore "Ted" Logan
"Led Zeppelin didn't write tunes that everybody liked, they left that to the Bee Gees."
- Wayne Campbell
Offline
Dobbie03:
That looks incredible....except for that nasty Firefox blue download arrow (which I know isn't your fault).
Thx, yeah that has to do with the iceweasel theme.
I use an addon that blocks the navigation bar and use vimperator instead.
Offline
Yep, it's my fault. Just wanted to try your theme on. Should've linked your consistent dwm screenshot instead.
Offline
I like having night and day modes with themes
same general config but an inverse of the last color scheme
Nice flat grey background kinda crunchbangin.
* {
font-family:verdana !important;
background-color: #403a30 !important;
color:#c5b994 !important;
font-size:13px !important;
border-collapse:collapse !important;
}
div, td {
color:#c5b994 !important;
border-color: #c5b294 !important;
}
select {
color: #403a30 !important;
background: #403a30 !important;
}
input {
font-size:12px !important;
color:#c5b994 !important;
}
input[type=radio] {
width:auto !important;
color: #c5b994 !important;
}
input[type=submit] {
text-align:center !important;
background:#403a30 !important;
}
input[name=q] {
background:#403a30 !important;
padding:2px 5px !important;
}
label {
color:#c5b994 !important;
font-size:12px !important;
}
a:link {
color:#c5b994 !important;
text-decoration:none !important;
}
a:visited {
color:#776a54 !important;
text-decoration:none !important;
}
a:hover {
color:#776a54 !important;
}
Offline
Thanks for sharing, gako. I'll give your stuff a go for sure. Cool theming. You should call the whole thing café latte or something... LOL
Offline
ahh cafe latte I like it.
Started adding this to the bottom of my global userContent.css
For youtube it will allow you to color the progress/time bar and volume slider.
Very handy as my theme always breaks this. I need to find a way to unscrew soundclloud now, then I'll be sitting pretty as far as my own needs go.
.html5-play-progress, .ytp-play-progress {
background: #36352e !important;
}
.html5-scrubber-button:hover, .ytp-scrubber-button:hover, .ytp-swatch-background-color, .ytp-swatch-background-color-secondary {
background: #36352e !important;
}
.ytp-volume-slider-track {
background: #36352e !important;
}
.ytp-settings-button.ytp-hd-quality-badge::after, .ytp-settings-button.ytp-4k-quality-badge::after, .ytp-settings-button.ytp-5k-quality-badge::after, .ytp-settings-button.ytp-8k-quality-badge::after, .ytp-settings-button.ytp-3d-badge::after {
background-color: #36352e !important;
}
.ytp-swatch-color {
color: #36352e !important;
}
.ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox {
background: #36352e !important;
}
.ytp-chrome-controls .ytp-button.ytp-youtube-button:hover:not([aria-disabled="true"]):not([disabled]) .ytp-svg-fill-logo-tube-lozenge {
fill: #36352e !important;
}
Last edited by gako (2015-10-29 06:30:08)
Offline
@nore
the getting-started-in-userchromecss link is dead, at least for me
Offline
^removed
Offline
No more CSS trickery in Firefox trying to avoid low contrast in input boxes. Googling thousandth and first time for "firefox dark themes" I ran first into an FF extension and then read this:
If you use a theme that does not have a light variant (e.g, Arc Dark; the light version, Arc, is a separate theme), then create a new string entry in
about:config
called
widget.content.gtk-theme-override
and set it to a light theme, e.g. Arc or Adwaita:light.
Extension was much too complicated to be handy but that tip works like a charm.
Bunsen-Dark-He GTK theme outside, Victory-17.04 inside:
I'm happy squirrel now.
Offline
^ oh please please make this work on seamonkey!
(trying it now, need to restart though)
Offline
widget.content.gtk-theme-override
and set it to a light theme, e.g. Arc or Adwaita:light.
works on firefox, does not work on seamonkey :-(
Offline