Glowacreep said: Where is the section to change the banner images and to make the background an image? It looks like you may have already figured this out, but you can change them with MyAnimeList's built-in cover image and background image uploaders on the same page you input the CSS: https://myanimelist.net/ownlist/style  |
LEGENDS_OF_ANIME said: Amethyst_Ero said: Hi, it's me again. So I would like to know. How to change this: https://i.imgur.com/8lRT2Mf.png To this: https://i.imgur.com/NmSnZpS.png Because it bothers my eyes and it gets blurry to see properly. add this code to to the bottom of your list:
/*Quick search dark mode fix*/
body[data-owner="1"] #fancybox-frame { filter: none; }
Thank you so muuuuch! |
Valerio_Lyndon said: ChipChippy said: I love the layout, had clarity before this, but wanted one with big covers and i find out you made this. Never used any other layouts. I modiefied it quite a bit, but don't have much CSS knowledge so I'm unsure how it all works together so I have one question, is it possible to create Top Rated banners but they only show up when a specific tag is added? It probably is but i can't figure it out. If you can help that would be lovely Did you mean something like this?  It is possibe, but does require some modifications of how the tags work. This means that the scrollbar on tags no longer works, so some vertical overflow may occur when you are using a lot of tags. It also removes the little tag icon next to the tag. This first code affects only the B-Tier tag. It can easily be applied to other tags by changing the selectors if you know how to do that. The second spoiler shows an example of that. Use only one of these. Yeah that's how I imagined it, except the customized tags are always displayed when not hovering. If i change the opacities, the banner and the tag change together picture:  |
ChipChippy said: Ah yeah, that definitely needs fixing. It's a bit of a weird fix but by finnangling the color and text shadow properties a bit we can have the text hidden while keeping the banner visible. Here's some new code which should fix that:Valerio_Lyndon said: Did you mean something like this? It is possibe, but does require some modifications of how the tags work. This means that the scrollbar on tags no longer works, so some vertical overflow may occur when you are using a lot of tags. It also removes the little tag icon next to the tag. This first code affects only the B-Tier tag. It can easily be applied to other tags by changing the selectors if you know how to do that. The second spoiler shows an example of that. Use only one of these. Yeah that's how I imagined it, except the customized tags are always displayed when not hovering. If i change the opacities, the banner and the tag change together picture: Edit for other people who might use this code: To make this fit a different tag, you need to find all instances of this text: [href$="=B-Tier"] And replace the "B-Tier" text with your preferred tag, in URL format. URL format can be viewed by mousing over or clicking on your tag to check the URL address. Here's an example replacement that would target the "Testing 123" tag: [href$="=Testing%20123"]. |
Valerio_LyndonMar 7, 2022 10:40 PM
Gotta say this is a great layout. I used Clarity at first but then thought I'd try one with large pics and their both Amazing. I've been trying to add back a couple things from Clarity and was having a little trouble
Edited: The All Anime page stops at #300 for some reason and doesn't seem to be loading is there a way to fix this? Nevermind this one, found this in the forum [https://myanimelist.net/forum/?topicid=1847882]. |
LeosparsJun 13, 2021 5:25 PM
      |
| I see this layout and Clarity on so many non-club member's lists O_O |
Leospars said: I've been trying to add back a couple things from Clarity and was having a little trouble • Getting the header text colour based on category [CatCol Header Text R0.0] Yeah, if you're using mods from Clarity they will probably need a lot of tweaking to work on Brink, if they work at all. They are coded very differently. On Brink, there are some different selectors used as well as some different variables. Leospars said: • The text at the top in the banner I tried to use the Frankenstein you made before [https://myanimelist.net/forum/?topicid=1772180&show=50#msg57814011] but it broke the header layout :P. It's mostly a case of finding a different selector to apply the ::after element to. Leospars said: I also used the Hide Hentai Cover Mod to try this: It doesn't show in the preview on [https://myanimelist.net/ownlist/style/theme/3] however it does work but it also changes the opacity of all tags to 0. I thought this line was to bring them back .list-item:hover,
.list-item:focus-within .data.tags a {
opacity: 1 !important;
}
Ah no, that's a fuck-up on my part. It should be: .list-item:hover .data.tags a,
.list-item:focus-within .data.tags a {
opacity: 1;
} |
Shishio-kun said: I see this layout and Clarity on so many non-club member's lists O_O It's a bit weird to think about sometimes! |
Oh I see. I added them now and they work nicely. I am trying to add an indicator for Favourite like what I had on the last layout. So I used the code you gave me the last time and changed it up a bit. However, I couldn't find a way to get it below the text and above the category colour at the same time, and when I try to show without hover the text shows too. To resolve the first issue I tried this instead /*------------------------------*\
|* Banner Tag *|
\* - - - - - - - - - - - - - - -*/
/* Modify how Tags Work */
.data.tags {
overflow: initial;
opacity: 1;
z-index: 10;
}
.data.tags span {
min-height: initial;
margin-bottom: 0;
}
.data.tags a {
min-height: 15px;
margin-bottom: 4px;
opacity: 0;
transition:
color var(--timeText) var(--bezierFast),
opacity calc(var(--timeItem) * 1.5) var(--bezierFast);
} .list-item:hover .data.tags a {
opacity: 1;
}
/* Tag-Specific Changes */
.data.tags a[href$="=Favourite"] {
position: static;
opacity: 1;
}
.data.tags a[href$="=Favourite"]::before {
content: "";
position: absolute;
right: -12px;
top: -51px;
z-index: -1;
width: 210px;
height: 300px;
border: 2px solid #ff1cae;
box-shadow: 0 0 6px #ff1cae;
border-radius: 6px;
pointer-events: none;
}
.data.tags a[href$="=Favourite"]::after {
content: "Favourite";
position: absolute;
right: 93px;
top: -60px;
z-index: -1;
min-width: 100px;
height: 21px;
padding: 3px 5px 0;
border-radius: 3px;
background: #ff1cae;
color: hsl(var(--bg));
font: bold 15px/15px var(--font);
text-align: center;
letter-spacing: 1px;
text-shadow: none;
transform: translateX(50%);
pointer-events: none;
}With the code you gave ChipChippy [https://myanimelist.net/forum/?topicid=1772180&show=300#msg63392710] earlier. The top :before was off by one, so I changed that. However the tag itself was still showing. Added:
.data.tags span a[href*="=Favourite"]
{color: transparent !important;
--btn-text-h: #bc1681!important;
}
.list-item:hover .data.tags span a[href*="=Favourite"]{
color: #ff1cae !important;
} |
LeosparsJun 16, 2021 5:17 PM
|
Leospars said: However, I couldn't find a way to get it below the text and above the category colour at the same time, and when I try to show without hover the text shows too. The category background is intrinsically linked with the anime title, and due to how limiting z-index functions are, I don't think it's possible to have the favourite tag go below the title while keeping it above the background colour. I could be wrong, but I tested it out and couldn't see a way. Leospars said: To resolve the first issue I tried this instead … However the tag itself was still showing. Looking on your list currently, it seems to be working alright. Were you still having issues with this solution? If you need a fix for the tag showing, I posted a revised version of that code in response to the other user: https://myanimelist.net/forum/?topicid=1772180&show=300#msg63467614  And if you want the Favourite banner to display above the Top Tier tag, you can modify the z-index of the Favourite tag code. For example, changing the ".data.tags a[href$="=Favourite"]::after" z-index from -1 to 6:   |
Leospars said: Shishio-kun said: Oh is this a height animation you're trying to change? You want the text color to come in slow and the height fast or..?  Yeah that's it. I want the height to move slower and the text color to stay as the original which was fast, var(--Beizerfast) I think. Moved the post over here |
Leospars said: Leospars said: /*------------------------------*\
|* Fixed Height Titles *|
\* - - - - - - - - - - - - - - -*/
.data.title .link{
/* change the number after the -webkit-line-clamp: _ to adjust the amount of lines*/
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
transition: height 0.7s ease-in, color var(--bezierFast) linear;
}
.data.title:hover .link{
-webkit-line-clamp: 4;
max-height: 100%;
}Is it possible to get the color of the link and height on hover to transition/change at different speeds. Yeah that's it. I want the height to move slower and the text color to stay as the original which was fast, var(--Beizerfast) I think. Unfortunately, there's no way to animate line-clamp from what I can see. I also don't believe there is a way to animate max-heigth or any "auto" value either, so I think it's something to do with values that get automatically generated by the browser and may be different depending on the length of text. The point is, the only way to animate the height would be to set a fixed default and fixed expansion value, for instance 2 lines expanding into 4 lines worth of height. Then, you could add that to the transition property separately from the color property. Here's an example of that, replacing your current "fixed height titles" section: /*------------------------------*\
|* Fixed Height Titles *|
\* - - - - - - - - - - - - - - -*/
.data.title .link{
/* change the number after the calc( _ to adjust the amount of lines*/
height: calc( 2 * 18px + 10px );
overflow: hidden;
transition:
color var(--timeText) var(--bezierFast),
height 0.3s ease-in-out
!important;
}
.data.title:hover .link {
/* change the number after the calc( _ to adjust the amount of lines*/
height: calc( 4 * 18px + 10px );
max-height: initial;
} |
Valerio_Lyndon said: I posted a revised version of that code in response to the other user: https://myanimelist.net/forum/?topicid=1772180&show=300#msg63467614 I missed that part I'll add it. Valerio_Lyndon said: Unfortunately, there's no way to animate line-clamp from what I can see. I also don't believe there is a way to animate max-heigth or any "auto" value either, so I think it's something to do with values that get automatically generated by the browser and may be different depending on the length of text. The point is, the only way to animate the height would be to set a fixed default and fixed expansion value, for instance 2 lines expanding into 4 lines worth of height. Then, you could add that to the transition property separately from the color property. Here's an example of that, replacing your current "fixed height titles" section: I understand. Thanks. |
|
| I'm having trouble finding the URL to change the banner, heck it's not even showing up any idea on how to fix this thanks |
[/url] mugen2k20 said: I'm having trouble finding the URL to change the banner, heck it's not even showing up any idea on how to fix this thanks The banner can be changed by using the default MAL cover image uploader, found on the same style editing page as where you input the CSS. I may change this in a later version though. |
| Every time I put my render in the URL, it never shows up |
mugen2k20 said: Every time I put my render in the URL, it never shows up You shouldn't have or need a URL. Download the image to your PC, and when on the MyAnimeList theme customization page select it by using the "Browse" button and uploading it from your PC.  If it's still not working, then I need more detail than what you're providing. For instance, what image are you trying to use? What exactly are you doing that isn't working? Are you uploading the image or trying to input the URL into the Browse popup UI? |
Valerio_LyndonJul 3, 2021 9:50 PM
| I'm just experiment re-modified my list and go to forum to get some ideas and i saw this; Valerio_Lyndon said: Leospars said: Yeah that's it. I want the height to move slower and the text color to stay as the original which was fast, var(--Beizerfast) I think. Unfortunately, there's no way to animate line-clamp from what I can see. I also don't believe there is a way to animate max-heigth or any "auto" value either, so I think it's something to do with values that get automatically generated by the browser and may be different depending on the length of text. The point is, the only way to animate the height would be to set a fixed default and fixed expansion value, for instance 2 lines expanding into 4 lines worth of height. Then, you could add that to the transition property separately from the color property. Here's an example of that, replacing your current "fixed height titles" section: /*------------------------------*\
|* Fixed Height Titles *|
\* - - - - - - - - - - - - - - -*/
.data.title .link{
/* change the number after the calc( _ to adjust the amount of lines*/
height: calc( 2 * 18px + 10px );
overflow: hidden;
transition:
color var(--timeText) var(--bezierFast),
height 0.3s ease-in-out
!important;
}
.data.title:hover .link {
/* change the number after the calc( _ to adjust the amount of lines*/
height: calc( 4 * 18px + 10px );
max-height: initial;
}Then I thought we had pretty much the same problem and I wasn't satisfied with it yet so I thought I’d replace it and here’s what I do  |
   free candies:       premium candies: |
| Thanks for this great layout. Simple yet so neat and very informative. I'm trying the mods right now(adding synopsis mod currently) Valerio_Lyndon said: To add it, you would have to add this to the bottom of your CSS: /* Synopsis Code */
.list-unit .list-status-title,
.list-table > tbody:first-of-type {
z-index: 0;
} .list-table > tbody:first-of-type:hover {
z-index: 5;
}
.progress div::after {
position: absolute;
right: -12px;
bottom: 288px;
z-index: 50;
width: 210px;
max-height: 300px;
padding: 8px 12px;
background: hsl(var(--bg));
border-radius: 6px;
box-shadow: -1.2px 1.68px 3.36px hsla(0,0%,0%,35%);
overflow-x: hidden;
overflow-y: auto;
font-size: .8rem;
text-align: left;
white-space: normal;
opacity: 0;
scrollbar-width: thin;
transition: opacity var(--timeItem) var(--bezierFast);
pointer-events: none;
} .list-item:hover .progress div::after {
opacity: 1;
pointer-events: auto;
}And use this preset while generating your code using the tool: /* [TITLE] *[DEL]/ .progress-[ID]:after{content:"[DESC]"}- Where should I put these codes exactly?(especially the last one) - Can I use my generated synopsis from my previous layout? or Generate a new one? |
Tunahan_ said: How can i change the banner picture's area size? Sorry my english is bad. I hope you can understand me. Add this to the bottom of your CSS. You can then change the number to the right of the "--banner-height" text to increase or decrease the height of the banner. |
ReinTod said: Thanks for this great layout. Simple yet so neat and very informative. I'm trying the mods right now(adding synopsis mod currently) Valerio_Lyndon said: To add it, you would have to add this to the bottom of your CSS: /* Synopsis Code */
.list-unit .list-status-title,
.list-table > tbody:first-of-type {
z-index: 0;
} .list-table > tbody:first-of-type:hover {
z-index: 5;
}
.progress div::after {
position: absolute;
right: -12px;
bottom: 288px;
z-index: 50;
width: 210px;
max-height: 300px;
padding: 8px 12px;
background: hsl(var(--bg));
border-radius: 6px;
box-shadow: -1.2px 1.68px 3.36px hsla(0,0%,0%,35%);
overflow-x: hidden;
overflow-y: auto;
font-size: .8rem;
text-align: left;
white-space: normal;
opacity: 0;
scrollbar-width: thin;
transition: opacity var(--timeItem) var(--bezierFast);
pointer-events: none;
} .list-item:hover .progress div::after {
opacity: 1;
pointer-events: auto;
}And use this preset while generating your code using the tool: /* [TITLE] *[DEL]/ .progress-[ID]:after{content:"[DESC]"}- Where should I put these codes exactly?(especially the last one) - Can I use my generated synopsis from my previous layout? or Generate a new one? The first and largest code goes at the bottom of your MAL Custom CSS. The preset/template is used to generate the CSS while using the linked tool. You can find an updated version of the tool here: https://myanimelist.net/forum/?topicid=1905478 If the synopses are generated with the same tool, you could re-use them by replacing all the relevant parts of code to match the new template. This isn't too hard if you have/get a tool to replace all instances of some text and know what code to overwrite, but generating new synopses shouldn't take too long either (and will make sure they're up-to-date). |
Valerio_LyndonJul 6, 2021 10:31 PM
Valerio_Lyndon said: Tunahan_ said: How can i change the banner picture's area size? Sorry my english is bad. I hope you can understand me. Add this to the bottom of your CSS. You can then change the number to the right of the "--banner-height" text to increase or decrease the height of the banner. Thank you so much! Great theme i liked it |
Reffman said: Hello, I used the hentai censor which is working properly, but I would like for the image behind to be blurred a little more and for it to be dimmer. How do I do that? Within the modification code, find the ".data.tags a[href$="tag=Hentai"]" section. Within that section, you can change the "backdrop-filter: blur(4px);" code to a different number. Here's an image of me doing this: https://i.imgur.com/FJ077kd.gif  |
Valerio_Lyndon said: Reffman said: Hello, I used the hentai censor which is working properly, but I would like for the image behind to be blurred a little more and for it to be dimmer. How do I do that? Within the modification code, find the ".data.tags a[href$="tag=Hentai"]" section. Within that section, you can change the "backdrop-filter: blur(4px);" code to a different number. Here's an image of me doing this: https://i.imgur.com/FJ077kd.gif Thanks, it worked! Is there any way to keep it blurred after hovering over it? |
ReffmanJul 17, 2021 8:58 PM
Reffman said: Valerio_Lyndon said: Within the modification code, find the ".data.tags a[href$="tag=Hentai"]" section. Within that section, you can change the "backdrop-filter: blur(4px);" code to a different number. Here's an image of me doing this: https://i.imgur.com/FJ077kd.gif Thanks, it worked! Is there any way to keep it blurred after hovering over it? That's a bit more complicated. You could give this ago, replacing the entire modification with this new version. I haven't extensively tested this so you'll have to let me know if it's buggy. [Code Difference] |
Valerio_Lyndon said: That's a bit more complicated. You could give this ago, replacing the entire modification with this new version. I haven't extensively tested this so you'll have to let me know if it's buggy. [Code Difference] This works perfectly so far! I will let you know if I do see anything buggy going on ;) |
MAL now added Genre and Demographics to List Settings. Will you have an update to this soon? |
wildcard7638Sep 15, 2021 8:29 PM
 |
I made my own patch and wanted to share if anyone's interested. |
|
| @Lawliet529 I was away for a time, but I've applied a similar patch to the main theme now. Thank you for sharing your code in the meantime, it's much appreciated. |
Valerio_Lyndon said: @Lawliet529 I was away for a time, but I've applied a similar patch to the main theme now. Thank you for sharing your code in the meantime, it's much appreciated. Glad you're finally here. :D |
|
| Sorry for spamming, how do I change "Airing" to for example, a red colour? Thanks in advance. |
Reg4shi said: Sorry for spamming, how do I change "Airing" to for example, a red colour? Thanks in advance. You should watch Shishio-kun's Inspect Element tutorial https://www.youtube.com/watch?v=cTGbVutdqfc and the code you want is .content-status {
color: #FF0000 !important;
}https://html-color.codes/red |
ShaggyZEOct 15, 2021 5:00 PM
   My Userscripts - Themes - Userstyles - Extensions (Chrome/Firefox) [API CSS] MAL-Scraper-API Cover/CSS Generator |
ShaggyZE said: Reg4shi said: Sorry for spamming, how do I change "Airing" to for example, a red colour? Thanks in advance. You should watch Shishio-kun's Inspect Element tutorial https://www.youtube.com/watch?v=cTGbVutdqfc and the code you want is .content-status {
color: #FF0000 !important;
}https://html-color.codes/red I'll try that out later, thank you for letting me know, I'll update you if it worked for me or not. |
ShaggyZE said: I've tried it and it works, I've got some more questions so I'll put them all right here. It's fine if you can't be bothered to answer them.Reg4shi said: Sorry for spamming, how do I change "Airing" to for example, a red colour? Thanks in advance. You should watch Shishio-kun's Inspect Element tutorial https://www.youtube.com/watch?v=cTGbVutdqfc and the code you want is .content-status {
color: #FF0000 !important;
}https://html-color.codes/red 1. How do I remove the colours of the status below MAL icon? 2. How do I change the "TOP RATED" to for example "MASTERPIECE"? I've tried the codes that were given by the creator but that didn't work. 3. Is it possible to make the cover images of the animes higher quality? My browser works fine everything works fine for now but I'm wondering if it's possible to do that. 4. How do I make the #number on the anime cover only visible when mouse dragged over it? Basically it only shows the cover unless it's dragged on. Thanks in advance. |
Reg4shiOct 16, 2021 3:02 AM
Reg4shi said: ShaggyZE said: I've tried it and it works, I've got some more questions so I'll put them all right here. It's fine if you can't be bothered to answer them.You should watch Shishio-kun's Inspect Element tutorial https://www.youtube.com/watch?v=cTGbVutdqfc and the code you want is .content-status {
color: #FF0000 !important;
}https://html-color.codes/red 1. How do I remove the colours of the status below MAL icon? 2. How do I change the "TOP RATED" to for example "MASTERPIECE"? I've tried the codes that were given by the creator but that didn't work. 3. Is it possible to make the cover images of the animes higher quality? My browser works fine everything works fine for now but I'm wondering if it's possible to do that. 4. How do I make the #number on the anime cover only visible when mouse dragged over it? Basically it only shows the cover unless it's dragged on. Thanks in advance. 1.This will remove the slim bar under MAL icon. Is that what you want? 2. You can change "MASTERPIECE" to whatever you want (e.g. "AMAZING"). 3. Yes, it's possible. But malscraper already generated covers with quality slightly higher than needed, so using even higher quality simply won't change anything but make loading time longer. 4. Tell me if they work. |
wildcard7638Oct 16, 2021 8:16 AM
|
Lawliet529 said: Holyyyy!!! This is exactly what I wanted, they're working perfectly, again thank you. I know I said those were all of my questions but I've asked the creator of the layout himself and if he doesn't get back to me, would you willing to help me as you did twice already? :) Have a nice day. Reg4shi said: I've tried it and it works, I've got some more questions so I'll put them all right here. It's fine if you can't be bothered to answer them. 1. How do I remove the colours of the status below MAL icon? 2. How do I change the "TOP RATED" to for example "MASTERPIECE"? I've tried the codes that were given by the creator but that didn't work. 3. Is it possible to make the cover images of the animes higher quality? My browser works fine everything works fine for now but I'm wondering if it's possible to do that. 4. How do I make the #number on the anime cover only visible when mouse dragged over it? Basically it only shows the cover unless it's dragged on. Thanks in advance. 1.This will remove the slim bar under MAL icon. Is that what you want? 2. You can change "MASTERPIECE" to whatever you want (e.g. "AMAZING"). 3. Yes, it's possible. But malscraper already generated covers with quality slightly higher than needed, so using even higher quality simply won't change anything but make loading time longer. 4. Tell me if they work. |
| @Lawliet529 Thanks for helping them, good job! :D |
| I love this, it looks so nice and clean, thank you so much! Such a huge upgrade from my previous layout, I'm almost embarrassed that I had been using such an old one for so many years :p Just a quick question though.. Usually all the titles are in Japanese as per their listing in the database, but when I'm viewing my list while logged out they all turn into their English counterparts (eg Shingeki no Kyojin --> Attack on Titan). Is that normal? Anything I can do to make it consistent? If there's nothing that can be done about it then it's quite alright. :) Edit- Oh, one more thing, is it normal for this layout (or modern layouts in general) to load much more slowly compared to a classic layout? I'm completely new to modern layouts so forgive me for my ignorance. My old layout (which was classic but also showed the same number of pictures for all the titles) would load almost immediately, whereas this one takes maybe 30 seconds to fully load). Just a nitpick so if this is typical then no worries |
EncastaNov 14, 2021 2:20 AM
 柵の向こうには 本当に狼などおらぬのか |
iiKrina said: Just a quick question though.. Usually all the titles are in Japanese as per their listing in the database, but when I'm viewing my list while logged out they all turn into their English counterparts (eg Shingeki no Kyojin --> Attack on Titan). Is that normal? Anything I can do to make it consistent? If there's nothing that can be done about it then it's quite alright. :) This might be related to this new update MAL just rolled out. https://myanimelist.net/forum/?topicid=1971418 Your list looks fine to me though. |
|
Lawliet529 said: iiKrina said: Just a quick question though.. Usually all the titles are in Japanese as per their listing in the database, but when I'm viewing my list while logged out they all turn into their English counterparts (eg Shingeki no Kyojin --> Attack on Titan). Is that normal? Anything I can do to make it consistent? If there's nothing that can be done about it then it's quite alright. :) This might be related to this new update MAL just rolled out. https://myanimelist.net/forum/?topicid=1971418 Your list looks fine to me though. Ahh I see. Thanks for checking for me (: Any reason why it takes so long to load? Just checked yours out and even though we have the same list style and the same amount of entries, yours loaded more than twice as fast as mine |
| 柵の向こうには 本当に狼などおらぬのか |
Not 100% sure but I think I know what the problem is. Try replacing this line near the top of your css: @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelink"; with this: @\import "https://malscraper.azurewebsites.net/covers/anime/iiKrina/presets/dataimagelink"; @\import "https://malscraper.azurewebsites.net/covers/manga/iiKrina/presets/dataimagelink"; |
wildcard7638Nov 14, 2021 10:45 AM
|
Lawliet529 said: Not 100% sure but I think I know what the problem is. Try replacing this line near the top of your css: @\import "https://malscraper.azurewebsites.net/covers/auto/presets/dataimagelink"; with this: @\import "https://malscraper.azurewebsites.net/covers/anime/iiKrina/presets/dataimagelink"; @\import "https://malscraper.azurewebsites.net/covers/manga/iiKrina/presets/dataimagelink"; Yep that fixed it! Thank you so much <3 |
| 柵の向こうには 本当に狼などおらぬのか |
| Hey VAL, I just updated my Brink Layout to the most recent one --- v1.7.0 (5th of Oct, 2021) • Added support for new genre/demographic columns. and I noticed I had a problem with my stats, the stats is showing without me pressing the stats button and its was out of place (before changing width to 100% it seems and, as if the padding isn't working). The compression is pretty large so had some struggle finding the parts that changed for stats. /*-------------------------------*|
[ Stats Internals ]
|*-------------------------------*/
.list-unit .list-status-title .stats a:first-child{
display: inline-block;
position: absolute;
top: 0px;
right: calc(50% - var(--listW) + 77.5px - 26px - 2px);
/*minus max-width minus padding*/
max-width: 26px;
overflow: hidden;
pointer-events: inherit;
}
.list-unit .list-status-title .stats a:first-child::before{
content: " ";
}
.list-unit .list-stats {
top: 0px;
left: 0px;
width: 100%;
height: 16px;
background: 0 0;
margin: 0 auto;
color: hsla(var(--stats), var(--statsOpac));
font: 13px/16px var(--font);
text-shadow: 2px 2px 4px #000;
padding: 10px 0 30px !important;
pointer-events: none !important;
}
|
LeosparsNov 14, 2021 9:23 PM
|
Leospars said: Hey VAL, I just updated my Brink Layout to the most recent one --- v1.7.0 (5th of Oct, 2021) • Added support for new genre/demographic columns. and I noticed I had a problem with my stats, the stats is showing without me pressing the stats button and its was out of place (before changing width to 100% it seems and, as if the padding isn't working). The compression is pretty large so had some struggle finding the parts that changed for stats. I think you modified some of the main theme code in your other version to accomodate the stats position change, hence why it broke when you updated it. Anyway, here's an updated version of your mod code that should move all the functionality into the modification and fix this. This is meant to be added at the bottom of the code as a modification, instead of replacing some of the theme code. /*-------------------------------*|
[ Stats Internals ]
|*-------------------------------*/
.list-unit .list-status-title .stats a:first-child{
display: inline-block;
position: absolute;
top: 0px;
right: calc(50% - var(--listW) + 77.5px - 26px - 2px);
/*minus max-width minus padding*/
max-width: 26px;
overflow: hidden;
pointer-events: inherit;
}
.list-unit .list-status-title .stats a:first-child::before{
content: " ";
}
.list-unit .list-stats {
position: static;
color: hsla(var(--text), 88%);
font: 13px/16px var(--font);
text-shadow: 2px 2px 4px #000;
padding: 10px 0 30px !important;
pointer-events: none !important;
} .list-unit .list-stats:not([style="display: block;"]) {
display: none !important;
}If you are modifying the theme a lot, you might want to try the uncompressed version so that it's easier. |
| @Lawliet529 Thanks a bunch for helping out Krina!  |
| @Valerio_Lyndon No problem! Btw, they changed the selector for the "plus" icon. From [class^="icon-add-"] .fa::before to [class^="icon-add-"] .fa-solid::before |
|
Lawliet529 said: @Valerio_Lyndon No problem! Btw, they changed the selector for the "plus" icon. From [class^="icon-add-"] .fa::before to [class^="icon-add-"] .fa-solid::before Ah, good catch, thank you. Now you mention it, they seem to have changed the sort icons as well. Hopefully that's the only ones! |
Valerio_LyndonNov 19, 2021 4:03 AM
More topics from this board
» ❓ Ask for help here + See Frequently Asked Questions ( 1 2 3 4 5 ... Last Page )Shishio-kun - Apr 15, 2010 |
7921 |
by takkun_
»»
Yesterday, 9:54 PM |
|
» [CSS - MODERN] ⚡️ Fully-Customizable Layouts (2024 updates!) ( 1 2 3 4 5 ... Last Page )Shishio-kun - Jul 21, 2017 |
381 |
by KabukiChouNights
»»
Sep 13, 10:56 AM |
|
» theme helpthreat - Jul 5 |
5 |
by Zaryf
»»
Aug 21, 5:46 AM |
|
» [CSS - Modern] 🍰 Clarity by V.L ( 1 2 3 4 5 ... Last Page )Valerio_Lyndon - Apr 19, 2018 |
1261 |
by KiranaStarr
»»
Aug 16, 5:48 PM |
|
» [CSS] ⭐️ Customize your List Cursor + Cursor FixesShishio-kun - Mar 8, 2021 |
30 |
by Shishio-kun
»»
Jul 28, 3:17 AM |