MediaWiki:Common.css: Difference between revisions
From Starlight wiki
Created page with "→CSS placed here will be applied to all skins: .gradient-header-frame { border: 1px solid #3a3a46; border-radius: 0.3em; } .gradient-header-frame__header { color: #efefef; font-size: 1.15em; font-family: "noto sans"; padding: 6px 10px; background: linear-gradient(90deg, #2f2f37 0%, #3a3a45 40%, #3b3b47 50%, #3a3a45 60%, #2f2f37 100%); text-align: center; } .gradient-header-frame__content { } .gradient-header-frame__content::-webkit..." |
No edit summary |
||
| Line 21: | Line 21: | ||
.gradient-header-frame__content::-webkit-scrollbar-track { background: #2c2c33; } | .gradient-header-frame__content::-webkit-scrollbar-track { background: #2c2c33; } | ||
.gradient-header-frame__content::-webkit-scrollbar-thumb { background: #44444d; border: 2px solid #2c2c33; border-radius: 0; } | .gradient-header-frame__content::-webkit-scrollbar-thumb { background: #44444d; border: 2px solid #2c2c33; border-radius: 0; } | ||
.gradient-header-frame-sub { | |||
border: 1px solid #3a3a46; | |||
border-radius: 0.3em; | |||
} | |||
.gradient-header-frame-sub__header { | |||
color: #efefef; | |||
font-size: 1.15em; | |||
font-family: "noto sans"; | |||
padding: 6px 10px; | |||
background: linear-gradient(90deg, #3a3a45 0%, #3a3a45 10%, #2f2f37 50%); | |||
text-align: left; | |||
} | |||
.gradient-header-frame-sub__content { | |||
} | |||
.gradient-header-frame-sub__content::-webkit-scrollbar { width: 10px; } | |||
.gradient-header-frame-sub__content::-webkit-scrollbar-track { background: #2c2c33; } | |||
.gradient-header-frame-sub__content::-webkit-scrollbar-thumb { background: #44444d; border: 2px solid #2c2c33; border-radius: 0; } | |||
.modern-frame { | |||
display: flex; | |||
flex-direction: column; | |||
} | |||
.modern-frame__title { | |||
position: relative; | |||
display: flex; | |||
align-items: center; | |||
min-height: 32px; | |||
padding: 2px 8px; | |||
color: #e5e5e5; | |||
font-size: 15px; | |||
font-family: "noto sans"; | |||
border-radius: 0.3em 0.3em 0 0; | |||
border-bottom: 3px solid #00000045 !important; | |||
} | |||
.modern-frame__content { | |||
border-radius: 0 0 0.3em 0.3em; | |||
box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.4); | |||
} | |||
@media (max-width: 800px) { | |||
.modern-frame__content { | |||
gap: 6px; | |||
padding: 8px; | |||
} | |||
} | |||
.modern-button { | |||
position: relative; | |||
display: flex; | |||
min-width: 45%; | |||
background: #31313b; | |||
border-radius: 8px; | |||
min-height: 64px; | |||
width: 100%; | |||
overflow: hidden; | |||
box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2); | |||
} | |||
.modern-button__image { | |||
display: flex; | |||
align-items: center; | |||
background: #40404d; | |||
padding: 4px; | |||
box-shadow: inset 20px 0px 20px 0px rgba(0, 0, 0, 0.05); | |||
} | |||
.modern-button__content { | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
gap: 2px; | |||
width: 100%; | |||
padding: 8px 10px; | |||
} | |||
.modern-button__title { | |||
font-size: 1.8em; | |||
line-height: 1; | |||
font-family: "Oswald"; | |||
} | |||
.modern-button__subtext { | |||
font-size: 0.8em; | |||
} | |||
Revision as of 13:33, 30 December 2024
/* CSS placed here will be applied to all skins */
.gradient-header-frame {
border: 1px solid #3a3a46;
border-radius: 0.3em;
}
.gradient-header-frame__header {
color: #efefef;
font-size: 1.15em;
font-family: "noto sans";
padding: 6px 10px;
background: linear-gradient(90deg, #2f2f37 0%, #3a3a45 40%, #3b3b47 50%, #3a3a45 60%, #2f2f37 100%);
text-align: center;
}
.gradient-header-frame__content {
}
.gradient-header-frame__content::-webkit-scrollbar { width: 10px; }
.gradient-header-frame__content::-webkit-scrollbar-track { background: #2c2c33; }
.gradient-header-frame__content::-webkit-scrollbar-thumb { background: #44444d; border: 2px solid #2c2c33; border-radius: 0; }
.gradient-header-frame-sub {
border: 1px solid #3a3a46;
border-radius: 0.3em;
}
.gradient-header-frame-sub__header {
color: #efefef;
font-size: 1.15em;
font-family: "noto sans";
padding: 6px 10px;
background: linear-gradient(90deg, #3a3a45 0%, #3a3a45 10%, #2f2f37 50%);
text-align: left;
}
.gradient-header-frame-sub__content {
}
.gradient-header-frame-sub__content::-webkit-scrollbar { width: 10px; }
.gradient-header-frame-sub__content::-webkit-scrollbar-track { background: #2c2c33; }
.gradient-header-frame-sub__content::-webkit-scrollbar-thumb { background: #44444d; border: 2px solid #2c2c33; border-radius: 0; }
.modern-frame {
display: flex;
flex-direction: column;
}
.modern-frame__title {
position: relative;
display: flex;
align-items: center;
min-height: 32px;
padding: 2px 8px;
color: #e5e5e5;
font-size: 15px;
font-family: "noto sans";
border-radius: 0.3em 0.3em 0 0;
border-bottom: 3px solid #00000045 !important;
}
.modern-frame__content {
border-radius: 0 0 0.3em 0.3em;
box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.4);
}
@media (max-width: 800px) {
.modern-frame__content {
gap: 6px;
padding: 8px;
}
}
.modern-button {
position: relative;
display: flex;
min-width: 45%;
background: #31313b;
border-radius: 8px;
min-height: 64px;
width: 100%;
overflow: hidden;
box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2);
}
.modern-button__image {
display: flex;
align-items: center;
background: #40404d;
padding: 4px;
box-shadow: inset 20px 0px 20px 0px rgba(0, 0, 0, 0.05);
}
.modern-button__content {
display: flex;
flex-direction: column;
justify-content: center;
gap: 2px;
width: 100%;
padding: 8px 10px;
}
.modern-button__title {
font-size: 1.8em;
line-height: 1;
font-family: "Oswald";
}
.modern-button__subtext {
font-size: 0.8em;
}
