User:Aeywoo/stella.css
Jump to navigation
Jump to search
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/*
* Created on the Fandom Developers Wiki by Sophiedp
* (https://dev.fandom.com/wiki/Stella)
*/
#mw-content-text #card-holder {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
#mw-content-text #card-holder .card {
flex: 1;
flex-basis: calc(100% / 5);
background: #474747;
border-radius: 10px;
padding: 4px;
border: 2px solid #8D8D8D;
margin: 6px;
height: 130px;
width: 200px;
display: flex;
flex-direction: column;
align-items: center;
color: #FFF;
text-decoration: unset;
cursor: pointer;
}
#mw-content-text #card-holder .card:hover {
filter: contrast(1.5);
}
#mw-content-text #card-holder .card.active {
order: -1;
border-color: #FC9149;
}
#mw-content-text #card-holder .card.active {
background-color: #CC753B;
}
#mw-content-text #card-holder .card .card-title {
flex: 1; /* idea from https://stackoverflow.com/questions/40020921 */
font-weight: bold;
text-align: center;
}
#mw-content-text #card-holder .card .card-count {
font-size: small;
}