Dogcraft Wiki
Dogcraft 10 Year Anniversary Showcase/styles.css
From Dogcraft Wiki
No edit summary |
mNo edit summary |
||
| (14 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
.wiki-content-box.page-card { | .wiki-content-box.page-card { | ||
--background- | --background-gradient: linear-gradient(90deg, white 35%, rgba(255, 255, 255, .90) 70%, transparent 100%); | ||
width: 100%; | width: 100%; | ||
border-top-width: 0px; | border-top-width: 0px; | ||
border-left-width: 5px; | border-left-width: 5px; | ||
padding: 15px 20px; | padding: 15px 20px; | ||
position:relative; | position:relative; | ||
flex-grow:unset; | |||
} | } | ||
| Line 16: | Line 14: | ||
} | } | ||
.wiki-content-box.page-card .page-card-gradient { | |||
background-image: var(--background-gradient); | |||
position: absolute; | |||
right:0; | |||
top:0; | |||
bottom:0; | |||
left:0; | |||
z-index:-1; | |||
} | |||
.wiki-content-box.page-card .page-card-image img { | .wiki-content-box.page-card .page-card-image img { | ||
position: absolute; | position: absolute; | ||
| Line 22: | Line 29: | ||
left: 0; | left: 0; | ||
height: 100%; | height: 100%; | ||
z-index: - | z-index: -2; | ||
border-radius: 0 5px 5px 0; | border-radius: 0 5px 5px 0; | ||
object-fit: fill; | |||
object-position: 12vw; | |||
} | |||
@media only screen and (max-width: 999px) { | |||
.wiki-content-box.page-card .page-card-image img { | |||
object-fit: cover; | |||
object-position: 10vw; | |||
} | |||
} | } | ||
| Line 34: | Line 50: | ||
font-weight: bold; | font-weight: bold; | ||
margin-bottom: 0; | margin-bottom: 0; | ||
} | |||
.path-start { | |||
width: 20px; | |||
border: 8px solid gray; | |||
border-radius: 50%; | |||
margin: 0 auto; | |||
aspect-ratio: 1/1; | |||
display: flex; | |||
justify-content: center; | |||
} | |||
.path-start > div { | |||
background: darkgray; | |||
width: 10px; | |||
margin-top: 27px; | |||
position: absolute; | |||
height: 20px; | |||
z-index: -1; | |||
} | |||
.meta-box > div { | |||
border-width: 5px !important; | |||
padding: 15px 20px !important; | |||
color: gray; | |||
} | } | ||
Latest revision as of 23:41, 24 September 2025
.wiki-content-box.page-card {
--background-gradient: linear-gradient(90deg, white 35%, rgba(255, 255, 255, .90) 70%, transparent 100%);
width: 100%;
border-top-width: 0px;
border-left-width: 5px;
padding: 15px 20px;
position:relative;
flex-grow:unset;
}
.wiki-content-box.page-card > .wiki-content-box-header {
text-align: start;
}
.wiki-content-box.page-card .page-card-gradient {
background-image: var(--background-gradient);
position: absolute;
right:0;
top:0;
bottom:0;
left:0;
z-index:-1;
}
.wiki-content-box.page-card .page-card-image img {
position: absolute;
width: 100%;
top: 0;
left: 0;
height: 100%;
z-index: -2;
border-radius: 0 5px 5px 0;
object-fit: fill;
object-position: 12vw;
}
@media only screen and (max-width: 999px) {
.wiki-content-box.page-card .page-card-image img {
object-fit: cover;
object-position: 10vw;
}
}
.wiki-content-box.page-card > p:nth-child(1) {
width: 80%;
}
.wiki-content-box.page-card > p:nth-child(2) {
text-align: center;
font-weight: bold;
margin-bottom: 0;
}
.path-start {
width: 20px;
border: 8px solid gray;
border-radius: 50%;
margin: 0 auto;
aspect-ratio: 1/1;
display: flex;
justify-content: center;
}
.path-start > div {
background: darkgray;
width: 10px;
margin-top: 27px;
position: absolute;
height: 20px;
z-index: -1;
}
.meta-box > div {
border-width: 5px !important;
padding: 15px 20px !important;
color: gray;
}