MediaWiki: Common.css: различия между версиями
Материал из Vanilla Station
TFMB (обсуждение | вклад) Нет описания правки |
TFMB (обсуждение | вклад) Нет описания правки |
||
(не показано 5 промежуточных версий этого же участника) | |||
Строка 33: | Строка 33: | ||
font-family: "Montserrat",sans-serif; | font-family: "Montserrat",sans-serif; | ||
font-optical-sizing: auto; | font-optical-sizing: auto; | ||
font-style: normal; | font-style: normal; | ||
} | } | ||
h1 { | h1 { | ||
font-size: | font-size: 1.5em; | ||
border-bottom: | border-bottom:3px solid black; | ||
} | } | ||
h2 { | h2 { | ||
font-size: | font-size: 1.4em; | ||
border-bottom:2px solid black; | border-bottom:2px solid black; | ||
} | } | ||
h3 {font-size: | h3 {font-size: 1.3em; | ||
border-bottom:1px solid black; | border-bottom:1px solid black; | ||
} | } | ||
h4 {font-size: | h4 {font-size: 1.2em;margin: 10px 0;} | ||
h5 { font-size: | h5 { font-size: 1.1em;margin: 10px 0;} | ||
h6 {font-size: | h6 {font-size: 1em;margin: 10px 0;} | ||
dl{ | dl{ | ||
margin-top:0.5rem; | margin-top:0.5rem; | ||
Строка 58: | Строка 57: | ||
font-family: "Open Sans",sans-serif; | font-family: "Open Sans",sans-serif; | ||
font-optical-sizing: auto; | font-optical-sizing: auto; | ||
font-style: normal; | font-style: normal; | ||
font-variation-settings: "wdth" 100; | font-variation-settings: "wdth" 100; | ||
Строка 74: | Строка 72: | ||
scroll-behavior:smooth; | scroll-behavior:smooth; | ||
} | } | ||
.frame1 {border-radius: 12px; | |||
.frame2 {position: absolute;width: 100%;height: 100%;background: linear-gradient(to right,#565C61,#1B1B21)} | .frame1 { | ||
.frame3 {width: 100%;height: fit-content;display: flex;flex-direction: row;position: relative} | border-radius: 12px; | ||
.frame4 {filter: invert(35%) sepia(24%) saturate(99%) hue-rotate(164deg) brightness(92%) contrast(92%);position: absolute;width: 100%;height: 100%;background-size: cover;opacity: .15;background-image: url(https://cdn.cloudflare.steamstatic.com/apps/dota2/images/dota_react/icons/facets/ripple_texture.png)} | border: 1px solid black; | ||
.frame5 {width: 100%;display: flex;flex-direction: row} | flex-grow: 1; | ||
.frame6 {width: 44px;min-height: 38px;height:100%;position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center} | height: 100%; | ||
.frame7 {width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: linear-gradient(to bottom,rgba(0,0,0,0.2),rgba(0,0,0,0.1));border-right: 1px solid rgba(255,255,255,.03)} | position: relative; | ||
.frame8 {width: 32px;height: 32px;background-size: cover;z-index: 1;filter: drop-shadow(0px 3px 2px rgba(0,0,0,0.3))} | box-shadow: 0px 12px 16px #00000054; | ||
.frame8 img{width:32px;height:auto | display: flex; | ||
flex-direction: column | |||
} | |||
.frame2 { | |||
position: absolute; | |||
border-radius:12px; | |||
width: 100%; | |||
height: 100%; | |||
background: linear-gradient(to right,#565C61,#1B1B21) | |||
} | |||
.frame3 { | |||
width: 100%; | |||
height: fit-content; | |||
display: flex; | |||
flex-direction: row; | |||
position: relative | |||
} | |||
.frame4 { | |||
filter: invert(35%) sepia(24%) saturate(99%) hue-rotate(164deg) brightness(92%) contrast(92%); | |||
position: absolute; | |||
width: 100%; | |||
height: 100%; | |||
background-size: cover; | |||
opacity: .15; | |||
background-image: url(https://cdn.cloudflare.steamstatic.com/apps/dota2/images/dota_react/icons/facets/ripple_texture.png) | |||
} | |||
.frame5 { | |||
width: 100%; | |||
display: flex; | |||
flex-direction: row | |||
} | |||
.frame6 { | |||
width: 44px; | |||
min-height: 38px; | |||
height: 100%; | |||
position: relative; | |||
display: flex; | |||
flex-direction: column; | |||
align-items: center; | |||
justify-content: center | |||
} | |||
.frame7 { | |||
width: 100%; | |||
height: 100%; | |||
position: absolute; | |||
top: 0; | |||
left: 0; | |||
background: linear-gradient(to bottom,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); | |||
border-right: 1px solid rgba(255,255,255,.03) | |||
} | |||
.frame8 { | |||
width: 32px; | |||
height: 32px; | |||
background-size: cover; | |||
z-index: 1; | |||
filter: drop-shadow(0px 3px 2px rgba(0,0,0,0.3)) | |||
} | |||
.frame8 img { | |||
width: 32px; | |||
height: auto | |||
} | |||
.frame9 { | .frame9 { | ||
display: flex; | display: flex; | ||
Строка 89: | Строка 156: | ||
font-size: 16px; | font-size: 16px; | ||
padding: 4px 20px; | padding: 4px 20px; | ||
text-shadow: 0px 2px 8px rgba(0,0,0,.5); | text-shadow: 0px 2px 8px rgba(0,0,0,.5); | ||
z-index: 1 | z-index: 1 | ||
} | } | ||
.frame10 {display: flex;flex-direction: column;height: fit-content;padding: 7px;background: #090d0fa8;z-index: 1} | |||
.frame11 {font-size: 16px;color: #8b989e;line-height: 1.3;font-weight: 600;display: flex;flex-direction: row; | .frame10 { | ||
.frame12 {width: 0px;min-width: 0px} | display: flex; | ||
.frame13 {width: 6px;height: 6px;min-width: 6px;border-radius: 3px;background-color: #8b989e;margin-top: 8px} | flex-direction: column; | ||
.frame14 {width: 100%;flex-grow: 1;background: #090d0fa8;z-index: 1} | height: fit-content; | ||
padding: 7px; | |||
background: #090d0fa8; | |||
z-index: 1 | |||
} | |||
.frame11 { | |||
font-size: 16px; | |||
color: #8b989e; | |||
line-height: 1.3; | |||
font-weight: 600; | |||
display: flex; | |||
flex-direction: row; | |||
lign-items: top | |||
} | |||
.frame12 { | |||
width: 0px; | |||
min-width: 0px | |||
} | |||
.frame13 { | |||
width: 6px; | |||
height: 6px; | |||
min-width: 6px; | |||
border-radius: 3px; | |||
background-color: #8b989e; | |||
margin-top: 8px | |||
} | |||
.frame14 { | |||
width: 100%; | |||
flex-grow: 1; | |||
background: #090d0fa8; | |||
z-index: 1 | |||
} | |||
kbd { | kbd { | ||
border: 1px solid #555555; | border: 1px solid #555555; |
Текущая версия от 16:14, 29 сентября 2024
/*ДЛЯ ТЕХ КТО БУДЕТ ПИЗДИТЬ МОЙ КОД - ИДИТЕ НАХУЙ!*/
@import url(https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap);
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&display=swap');
.montserrat {
font-family: "Montserrat",sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal
}
.caveat {
font-family: "Caveat", cursive;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.raleway{
font-family: "Raleway", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
.open-sans {
font-family: "Open Sans",sans-serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
font-variation-settings: "wdth" 100
}
h1>*,h2>*,h3>*,h4>*,h5>*,h6>*{
font-family: "Montserrat",sans-serif;
font-optical-sizing: auto;
font-style: normal;
}
h1 {
font-size: 1.5em;
border-bottom:3px solid black;
}
h2 {
font-size: 1.4em;
border-bottom:2px solid black;
}
h3 {font-size: 1.3em;
border-bottom:1px solid black;
}
h4 {font-size: 1.2em;margin: 10px 0;}
h5 { font-size: 1.1em;margin: 10px 0;}
h6 {font-size: 1em;margin: 10px 0;}
dl{
margin-top:0.5rem;
margin-bottom:0.5rem;
}
body{
font-family: "Open Sans",sans-serif;
font-optical-sizing: auto;
font-style: normal;
font-variation-settings: "wdth" 100;
font-size:16px;
color:darkgray;
}
header, button{
font-family: "Raleway",sans-serif;
font-optical-sizing: auto;
font-weight: 500;
font-style: normal
}
/*ПРОЧАЯ ХРЕНЬ*/
html{
scroll-behavior:smooth;
}
.frame1 {
border-radius: 12px;
border: 1px solid black;
flex-grow: 1;
height: 100%;
position: relative;
box-shadow: 0px 12px 16px #00000054;
display: flex;
flex-direction: column
}
.frame2 {
position: absolute;
border-radius:12px;
width: 100%;
height: 100%;
background: linear-gradient(to right,#565C61,#1B1B21)
}
.frame3 {
width: 100%;
height: fit-content;
display: flex;
flex-direction: row;
position: relative
}
.frame4 {
filter: invert(35%) sepia(24%) saturate(99%) hue-rotate(164deg) brightness(92%) contrast(92%);
position: absolute;
width: 100%;
height: 100%;
background-size: cover;
opacity: .15;
background-image: url(https://cdn.cloudflare.steamstatic.com/apps/dota2/images/dota_react/icons/facets/ripple_texture.png)
}
.frame5 {
width: 100%;
display: flex;
flex-direction: row
}
.frame6 {
width: 44px;
min-height: 38px;
height: 100%;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center
}
.frame7 {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: linear-gradient(to bottom,rgba(0,0,0,0.2),rgba(0,0,0,0.1));
border-right: 1px solid rgba(255,255,255,.03)
}
.frame8 {
width: 32px;
height: 32px;
background-size: cover;
z-index: 1;
filter: drop-shadow(0px 3px 2px rgba(0,0,0,0.3))
}
.frame8 img {
width: 32px;
height: auto
}
.frame9 {
display: flex;
flex-direction: row;
align-items: center;
font-size: 16px;
padding: 4px 20px;
text-shadow: 0px 2px 8px rgba(0,0,0,.5);
z-index: 1
}
.frame10 {
display: flex;
flex-direction: column;
height: fit-content;
padding: 7px;
background: #090d0fa8;
z-index: 1
}
.frame11 {
font-size: 16px;
color: #8b989e;
line-height: 1.3;
font-weight: 600;
display: flex;
flex-direction: row;
lign-items: top
}
.frame12 {
width: 0px;
min-width: 0px
}
.frame13 {
width: 6px;
height: 6px;
min-width: 6px;
border-radius: 3px;
background-color: #8b989e;
margin-top: 8px
}
.frame14 {
width: 100%;
flex-grow: 1;
background: #090d0fa8;
z-index: 1
}
kbd {
border: 1px solid #555555;
border-radius: 0.2em;
box-shadow: 0.1em 0.1em 0.2em rgba(0, 0, 0, 0.1);
background-image: linear-gradient(to bottom, #1e1e1e, #393838, #1e1e1e);
color: lightgrey;
padding: 0.1em 0.3em;
font-family: inherit;
font-size: 0.95em;
}
/*Рендеринг картинок*/
img{image-rendering:pixelated;}
.wikiEditor-ui-toolbar .page-characters div span {
height:1.5em;
color:white;
}
.wikiEditor-ui-toolbar .booklet > .index >:not(.current):hover {
background:var(--dark);
}
.page-link {
background-color: transparent !important;
}
#content a.external[href^="https://"], .link-https{
background:none;
}
.mw-notification{
border: solid 1px #000000;
border-radius: 8px;
background-color: #212126;
}