Module:ScopeBox/styles.css: Difference between revisions
From Amaranth Legacy, available at amaranth-legacy.community
More actions
Content deleted Content added
Tesinormed (talk | contribs) m Text replacement - "amaranth-legacy\.yttrium\.systems\/[0-9a-f]\/[0-9a-f]{2}\/([^\/\s]+)*" to "amaranth-legacy.yttrium.systems/$1" |
Tesinormed (talk | contribs) No edit summary |
||
| Line 1: | Line 1: | ||
@media screen { |
@media screen { |
||
.scope-box { |
.scope-box { |
||
/* make sure this displays correctly */ |
|||
display: inline-block; |
display: inline-block; |
||
/* fill the entire width of the container */ |
|||
width: 100%; |
|||
| ⚫ | |||
/* add a little shadow around the box */ |
|||
border: var(--border-color) 1px solid; |
|||
box-shadow: 0 0 10px black; |
box-shadow: 0 0 10px black; |
||
/* center the text */ |
|||
| ⚫ | |||
| ⚫ | |||
background-clip: padding-box; |
|||
background-color: transparent; |
|||
} |
} |
||
.scope-box a { |
.scope-box a { |
||
/* make sure this displays correctly */ |
|||
display: inline-block; |
display: inline-block; |
||
/* fill the entire width of the container */ |
|||
width: 100%; |
|||
/* background: linear-gradient(to right, var(--color-0) 30%, var(--color-1) 50%, 75%, var(--color-2) 100%); */ |
|||
/* |
/* blur the background */ |
||
| ⚫ | |||
/* use the background as text color */ |
|||
| ⚫ | |||
| ⚫ | |||
font |
/* font settings */ |
||
font- |
font-family: var(--font-family-serif) !important; |
||
font-size: 300% !important; |
font-size: 300% !important; |
||
} |
|||
.scope-box-ambrosia { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/NebulaAddition4.png"); |
|||
} |
|||
.scope-box-cosmoria { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/NebulaAddition3.png"); |
|||
} |
|||
.scope-box-galvyria { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/NebulaAddition5.png"); |
|||
} |
|||
.scope-box-vela { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/Vela-Background.png"); |
|||
} |
|||
.scope-box-astralis { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/Astralis-Background.png"); |
|||
} |
|||
.scope-box-haven { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/Amarleg-haven.png"); |
|||
} |
|||
.scope-box-aziel { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/Aziel-Background.png"); |
|||
} |
|||
.scope-box-empyrea { |
|||
background-image: url("https://amaranth-legacy.yttrium.systems/Empyrea-Background.png"); |
|||
} |
} |
||
} |
} |
||
Revision as of 21:56, February 2, 2025
@media screen {
.scope-box {
/* make sure this displays correctly */
display: inline-block;
/* fill the entire width of the container */
width: 100%;
/* add a little shadow around the box */
box-shadow: 0 0 10px black;
/* center the text */
text-align: center;
}
.scope-box a {
/* make sure this displays correctly */
display: inline-block;
/* fill the entire width of the container */
width: 100%;
/* blur the background */
backdrop-filter: blur(2px);
/* use the background as text color */
background-clip: text;
/* font settings */
font-family: var(--font-family-serif) !important;
font-size: 300% !important;
}
}