Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /* Switch USERNAME with yours for the hover preview pics! */
- @\import "https://malscraper.azurewebsites.net/covers/anime/USERNAME/presets/dataimagelinkbefore";
- @\import "https://malscraper.azurewebsites.net/covers/manga/USERNAME/presets/dataimagelinkbefore";
- @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Theme%20-%20Compressed.css";
- @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Hover%20Image%20Compressed.css";
- @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Mod%20-%20Dark%20Mode%20Compressed.css";
- /*-S-T-A-R-T--------------------*\
- | Banner Titles |
- You can type text into the quotations after name for custom text on your banner.
- \*------------------------------*/
- body{ --name: "";
- }
- /*-S-T-A-R-T--------------------*\
- | Banner Background Image
- To change background images: delete what's in the parenthesis. Upload
- the new background to Imgur or a similar site, then copy the direct link (or Original GIF link if it's animated) and paste it into the parenthesis. Save.
- Reposition the banner with the percentages below. For example, change the second 10% to 50% to move 50% of the banner up.
- |
- \*------------------------------*/
- body { --banner: url(https://i.imgur.com/Ny1h69s.jpg); }
- .cover-block{
- background-position: 0% 10% !important;
- }
- /*-S-T-A-R-T--------------------*\
- | Banner Character (Render)
- Background size is the size of the image. 100% is full size.
- The first percentage after background position is the position from the left. Lower percentages move it left and you can go negative. The second percentage is position from the top. Lower percentages move it down.
- |
- \*------------------------------*/
- body { --character: url();
- }
- #list-container #cover-image-container {
- background-size: 60%;
- background-position: 80% 20%;
- }
- /*-S-T-A-R-T--------------------*\
- | Banner Avatar |
- \*------------------------------*/
- body { --avatar: url(https://imgur.com/mBay2Ca.jpg); }
- /*-S-T-A-R-T--------------------*\
- | Per-Category Background Image
- If you want a wallpaper on a category, you can add direct background images links to the parenthesis here for each category! By default, there is no wallpaper.
- |
- \*------------------------------*/
- body { --background: url(); }
- /*SIDE RENDERS (left and right)
- To move the renders, adjust the percentage after "left" or "right" and "top". You can use negatives. The percentage is the distance from the left, top, or right.
- To resize the renders, adjust the percentage after "width". 0% will remove the render.*/
- body footer:before {
- left: -5%;
- top: 15%;
- width: 35% !important;
- background-size: contain !important;
- background-image: url();
- background-position: left bottom !important;
- }
- body footer:after {
- right: -10%;
- top: 0%;
- width: 40% !important;
- background-size: contain !important;;
- background-image: url();
- background-position: right bottom !important;
- }
- /*------------------------------*\
- | Character Renders R0.3 |
- \*------------------------------*/
- footer:before, footer:after {
- content: "";
- position: fixed;
- top: 0;
- z-index: -1;
- width: calc(50% - 538px);
- min-width: 262px;
- height: 100%;
- background: transparent no-repeat center bottom / contain scroll;
- }
- /*------------------------------*\
- | ANIME TITLE COLOR
- \*------------------------------*/
- :root {
- --text: #ababab;
- }
- /*------------------------------*\
- | TABLE COLORS |
- Use an RGBA color generator to find the perfect color for the tables!
- https://www.cssportal.com/css3-rgba-generator/
- \*------------------------------*/
- :root {
- --bg: #212121;
- }
- /*------------------------------*\
- | List colors |
- pbg is the color of the wallpaper when you have no image there
- bg is the color of the tables and rows
- text is the color of your anime
- titles and some text on your rows (numbers, score, information, tags)
- text-dim is other text on your rows (edit, more, non-links, Progress:, Rated:, etc)
- btn-bg is the button color around score and tags
- text-head is the category links unselected
- text-head-h is the current category link selected
- btn-head-bg-h is buttons under the header when selected
- btn-text-h is that button text
- banner-text is the banner text color, and its shadow color is under that
- Get a new HTML/Hex color number here, or use color names.
- https://htmlcolorcodes.com/
- Get new RGBA colors here for the rows
- https://cssgenerator.org/rgba-and-hex-color-generator.html
- \*------------------------------*/
- :root {
- --pbg: #161616;
- --bg: #212121;
- --bg-dark: #444;
- --text: #ababab;
- --text-h: #416abe;
- --text-dim: #777;
- --text-dim-h: #999;
- --text-dark: #ababab;
- --shadow: rgba(0,0,0,0.8);
- --icon: #959595;
- --accent: #416abe;
- --banner-text: #f6f5ff;
- --banner-text-shadow: #e4bef4;
- --btn-bg: #191919;
- --btn-bg-h: #ababab;
- --btn-head-bg-h: #416abe;
- --btn-text-h: #212121;
- --text-head: #9b9b9b;
- --text-head-h: #ababab;
- --cover-bg: #090909;
- --edit-btn: #323232;
- --checkmark: #416abe;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement