User:Sky/Rarity: Difference between revisions
< User:Sky
Jump to navigation
Jump to search
(break out more css) |
(csss) |
||
Line 62: | Line 62: | ||
} | } | ||
body .itemicon-wrapper { | body .bg3wiki-itemicon-wrapper { | ||
text-align: center; | text-align: center; | ||
white-space: nowrap; | white-space: nowrap; | ||
} | } | ||
body .itemicon-wrapper .itemicon { | body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon { | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
body .itemicon-wrapper .itemicon.common { | body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.common { | ||
background: linear-gradient(var(--bg-main), var(--rarity-common | background: linear-gradient(var(--bg-main), var(--rarity-common)); | ||
border: solid 1px var(--rarity-common); | border: solid 1px var(--rarity-common); | ||
} | } | ||
body .itemicon-wrapper .itemicon.uncommon { | body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.uncommon { | ||
background: linear-gradient(var(--bg-main), var(--rarity-uncommon-bck)); | background: linear-gradient(var(--bg-main), var(--rarity-uncommon-bck)); | ||
border: solid 1px var(--rarity-uncommon); | border: solid 1px var(--rarity-uncommon); | ||
} | } | ||
body .itemicon-wrapper .itemicon.rare { | body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.rare { | ||
background: linear-gradient(var(--bg-main), var(--rarity-rare-bck)); | background: linear-gradient(var(--bg-main), var(--rarity-rare-bck)); | ||
border: solid 1px var(--rarity-rare); | border: solid 1px var(--rarity-rare); | ||
} | } | ||
body .itemicon-wrapper .itemicon.very-rare { | body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.very-rare { | ||
background: linear-gradient(var(--bg-main), var(--rarity-very-rare-bck)); | background: linear-gradient(var(--bg-main), var(--rarity-very-rare-bck)); | ||
border: solid 1px var(--rarity-very-rare); | border: solid 1px var(--rarity-very-rare); | ||
} | } | ||
body .itemicon-wrapper .itemicon.legendary { | body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.legendary { | ||
background: linear-gradient(var(--bg-main), var(--rarity-legendary-bck)); | background: linear-gradient(var(--bg-main), var(--rarity-legendary-bck)); | ||
border: solid 1px var(--rarity-legendary); | border: solid 1px var(--rarity-legendary); | ||
} | } | ||
body .itemicon-wrapper .itemicon.story { | body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.story { | ||
background: linear-gradient(var(--bg-main), var(--rarity-story-bck)); | background: linear-gradient(var(--bg-main), var(--rarity-story-bck)); | ||
border: solid 1px var(--rarity-story); | border: solid 1px var(--rarity-story); |
Revision as of 04:55, 9 September 2023
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
- Potion of Healing
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin tristique ligula vitae turpis varius ullamcorper. Ut sagittis Potion of Healing eu dolor accumsan venenatis. Maecenas sit amet ante at ligula efficitur fermentum. Suspendisse ac neque pretium nisi finibus euismod. Suspendisse varius ipsum lorem, vitae consectetur metus mattis sit amet. Proin ornare orci turpis, non blandit lorem scelerisque a. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Potion of Healing in luctus arcu. Proin aliquet lorem quis lacus lacinia molestie. Suspendisse iaculis venenatis nibh, et dapibus augue varius a.
CSS
body {
--rarity-common: #48484899;
--rarity-common-bck: #48484820;
--rarity-uncommon: #01BD3999;
--rarity-uncommon-bck: #01BD3920;
--rarity-rare: #01BFFF99;
--rarity-rare-bck: #01BFFF20;
--rarity-very-rare: #D1017B99;
--rarity-very-rare-bck: #D1017B20;
--rarity-legendary: #B7861D99;
--rarity-legendary-bck: #B7861D20;
--rarity-story: #FF590199;
--rarity-story-bck: #FF590120;
}
body .bg3wiki-itemicon-wrapper {
text-align: center;
white-space: nowrap;
}
body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon {
display: inline-block;
}
body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.common {
background: linear-gradient(var(--bg-main), var(--rarity-common));
border: solid 1px var(--rarity-common);
}
body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.uncommon {
background: linear-gradient(var(--bg-main), var(--rarity-uncommon-bck));
border: solid 1px var(--rarity-uncommon);
}
body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.rare {
background: linear-gradient(var(--bg-main), var(--rarity-rare-bck));
border: solid 1px var(--rarity-rare);
}
body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.very-rare {
background: linear-gradient(var(--bg-main), var(--rarity-very-rare-bck));
border: solid 1px var(--rarity-very-rare);
}
body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.legendary {
background: linear-gradient(var(--bg-main), var(--rarity-legendary-bck));
border: solid 1px var(--rarity-legendary);
}
body .bg3wiki-itemicon-wrapper .bg3wiki-itemicon.story {
background: linear-gradient(var(--bg-main), var(--rarity-story-bck));
border: solid 1px var(--rarity-story);
}