Loading

MyFigureCollection UsercssMyFigureCollection UsercssMisc

CatgrillsCatgrills5 meses atrás
This article is related to this one : BLOG #45267

For those who don't want to read the first article I made, here is a summary : usercss are code designed to alter the appearance of a site. You can apply those code with an add-on called Stylus. I wrote an usercss for this site.

If you don't really like the new interface, you can install my script to change the design (if you find it more appealing that's it) : github.com/Catg...

Here are the side-by-side comparisons :

Light theme
http://u.cubeupload.com/Catgrills/lightnewold.png

Gray theme
http://u.cubeupload.com/Catgrills/graynewold.png

Dark theme
http://u.cubeupload.com/Catgrills/darknewold.png

Don't hesitate to tell me if you encounter issues while using this script, I'll try to solve them asap.
1,738 hits • 23 favoritos27 comentários

Comentários27

bluberi_tan4 meses atrás#77696660is it possible to use for mobile

I do think there is a way for android. Unfortunately, I'm not familiar with writing usercss for mobile.
4 meses atrás
is it possible to use for mobile
4 meses atrás
MC707 Rage your dream
Absolutely fantastic changes. The table formatting for the Item pages looks really good, and changing the font to 12p for everything makes it so much easy on the eyes.

For those who want to change all of the 70 entries with 14p font size, copy and paste all the code into a Notepad++ window for Windows or a Visual Studio Code window (or your favorite text editor) on Linux. Then use the find and replace feature, change them all to 12p and copy-paste back to the Style window on Stylus.

Thanks to everyone who contributed to make this better and to Catgrills for laying the foundation.
5 meses atrás
Catgrills5 meses atrás#77600828The font size I used for the article and comments is '14pt', you can search for every 14pt in the script and replace it with a smaller size ('12pt', "10pt', etc). If you have issues don't hesitate to tell me.

I'll give it a try; thank you! and thank you for fixing the article font colors/sizes thing as well, I appreciate it ^^
5 meses atrás
Magusfigures5 meses atrás#77599775If I had to pick one thing to make smaller, it would probably be the body text. I can deal with huge header text, but the text in articles/comments is too big for me. I'd like to make it maybe half the size it is now?
(Another minor thing I noticed that I had a question about - I use color/different sized text a lot in my articles, and those don't display properly with the custom css. It's a minor thing, but I'd love to be able use those again if possible!)


The font size I used for the article and comments is '14pt', you can search for every 14pt in the script and replace it with a smaller size ('12pt', "10pt', etc). If you have issues don't hesitate to tell me.
5 meses atrás
NekoVader5 meses atrás#77600694I use MFC mostly for the database. I'm overriding MFCs css with the following code, to display all informations in a table and make them readable again.
.form .form-field { display: table-row; }
.form .form-label, .form .form-input { display: table-cell; }
.form .form-label { text-align: right; vertical-align: top; padding: 11px !important; }
.data .form { background-color: inherit; }
.data .form > .form-field:last-child > .form-label { border-bottom: none !important; }
https://i.ibb.co/sQrcRWJ/mfc-item-table.jpg


Magusfigures5 meses atrás#77599775If I had to pick one thing to make smaller, it would probably be the body text. I can deal with huge header text, but the text in articles/comments is too big for me. I'd like to make it maybe half the size it is now?
(Another minor thing I noticed that I had a question about - I use color/different sized text a lot in my articles, and those don't display properly with the custom css. It's a minor thing, but I'd love to be able use those again if possible!)


Vanya-pon5 meses atrás#77599488Oh dear lord, I didn't realize the admin would've done such a dumb choice, only to "cover it up" with a 90% opacity background as if he wanted to fix his mistake lmfao. Sadly it's the same .css class as on the profile, so unless there is a way to inject an extra class into the container for the home page only, I don't think I can make that happen. So if you're super particular about keeping the profile backgrounds highly visible on dark mode, you gotta live with the ugly home site, or try a different value (like .5 instead of .2 to see if there's a working middle ground >.<; )
If I do find a fix for this mess however, I'll update my initial post accordingly. It's quite haphazard right now. XD;
Unless I misunderstood ya - if you need a different background color for the opacity overlay, you can draw a different RGB value like e.g. rgb(24,24,26,.2) instead of whatever value I used. °^°
As for the "fixed" dropdowns, I just updated the code to draw from the variables, it should be
View spoilerHide spoilerselect option {
background: var(--card-bg);
color: var(--primary-color);
}
and you put it at the end of the bottom CSS: ^^; It'll basically avoid "breaking" the layout on light theme.
Edit: A workaround for the "I want the profile BGs to return but stay tf out of my home screen and articles" has been found, check my original post below for instructions. If you need further help, feel free to DM me.


Thanks for the feedbacks, I updated the script :
1/ Table information display for the item page thanks to NekoVader
2/ colors and font-size for the article for Magusfigures
3/ Custom background and "fixed" dropdown thanks to Vanya-pon

GosuGopher5 meses atrás#77600375I appreciate the effort. Looking at your previous post, you originally set out to create a dark mode with relatively minimal formatting changes otherwise. Do you think you'l take some of the adjustments you make further or are you pretty happy with how it is currently? It's all a matter of preference, just curious what your intentions are.
Mostly asking about the item pages, which imo are the worst part of MFC's new crappy layout.
Either way, thanks for this.


When I write a script, I reach a state of "well, that's good enough" and I'm never satisfied completely. That's why I want others peoples to give feedbacks to what is lacking, it'll help me improving the script.
5 meses atrás
I use MFC mostly for the database. I'm overriding MFCs css with the following code, to display all informations in a table and make them readable again.
.form .form-field { display: table-row; }
.form .form-label, .form .form-input { display: table-cell; }
.form .form-label { text-align: right; vertical-align: top; padding: 11px !important; }
.data .form { background-color: inherit; }
.data .form > .form-field:last-child > .form-label { border-bottom: none !important; }
https://i.ibb.co/sQrcRWJ/mfc-item-table.jpg
5 meses atrás
I appreciate the effort. Looking at your previous post, you originally set out to create a dark mode with relatively minimal formatting changes otherwise. Do you think you'l take some of the adjustments you make further or are you pretty happy with how it is currently? It's all a matter of preference, just curious what your intentions are.

Mostly asking about the item pages, which imo are the worst part of MFC's new crappy layout.

Either way, thanks for this.
5 meses atrás
Catgrills5 meses atrás#77599412Of course, what do you want to change specifically ?
If I had to pick one thing to make smaller, it would probably be the body text. I can deal with huge header text, but the text in articles/comments is too big for me. I'd like to make it maybe half the size it is now?

(Another minor thing I noticed that I had a question about - I use color/different sized text a lot in my articles, and those don't display properly with the custom css. It's a minor thing, but I'd love to be able use those again if possible!)
5 meses atrás
Vanya-pon Resident Zergling
MC7075 meses atrás#77599476Excellent, this fixed the custom backgrounds on user pages not being visible. The main page of MFC also has the POTD as a background which is cool. Unfortunately it also caused most other pages to have this light gray background. Any way to make those the dark bluish gray like it was before in the dark mode theme?
Also I'm not sure what those "fixed" dropdowns are or where to put the code exactly.

Oh dear lord, I didn't realize the admin would've done such a dumb choice, only to "cover it up" with a 90% opacity background as if he wanted to fix his mistake lmfao. Sadly it's the same .css class as on the profile, so unless there is a way to inject an extra class into the container for the home page only, I don't think I can make that happen. So if you're super particular about keeping the profile backgrounds highly visible on dark mode, you gotta live with the ugly home site, or try a different value (like .5 instead of .2 to see if there's a working middle ground >.<; )

If I do find a fix for this mess however, I'll update my initial post accordingly. It's quite haphazard right now. XD;
Unless I misunderstood ya - if you need a different background color for the opacity overlay, you can draw a different RGB value like e.g. rgb(24,24,26,.2) instead of whatever value I used. °^°

As for the "fixed" dropdowns, I just updated the code to draw from the variables, it should be
View spoilerHide spoilerselect option {
background: var(--card-bg);
color: var(--primary-color);
}
and you put it at the end of the bottom CSS: ^^; It'll basically avoid "breaking" the layout on light theme.

Edit: A workaround for the "I want the profile BGs to return but stay tf out of my home screen and articles" has been found, check my original post below for instructions. If you need further help, feel free to DM me.
5 meses atrás
Exclusive anime goods from Japan!

About this blog

More by Catgrills+

Itens relacionados

Etiquetas0

Clubes relacionados