MediaWiki: Common.css: различия между версиями

Материал из Vanilla Station
Перейти к: навигация, поиск
мНет описания правки
Нет описания правки
 
(не показано 18 промежуточных версий 2 участников)
Строка 3: Строка 3:
@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=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=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 {
.montserrat {
     font-family: "Montserrat",sans-serif;
     font-family: "Montserrat",sans-serif;
Строка 8: Строка 9:
     font-weight: 500;
     font-weight: 500;
     font-style: normal
     font-style: normal
}
.caveat {
  font-family: "Caveat", cursive;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
}
.raleway{
.raleway{
Строка 26: Строка 33:
     font-family: "Montserrat",sans-serif;
     font-family: "Montserrat",sans-serif;
     font-optical-sizing: auto;
     font-optical-sizing: auto;
    font-weight: 500;
     font-style: normal;
     font-style: normal;
}
}


h1 {
h1 {
     font-size: 32px;
     font-size: 1.5em;
     border-bottom:4px solid black;
     border-bottom:3px solid black;
}
}
h2 {
h2 {
     font-size: 28px;
     font-size: 1.4em;
     border-bottom:2px solid black;
     border-bottom:2px solid black;
}
}
h3 {font-size: 24px;
h3 {font-size: 1.3em;
     border-bottom:1px solid black;
     border-bottom:1px solid black;
}
}
h4 {font-size: 20px}
h4 {font-size: 1.2em;margin: 10px 0;}
h5 { font-size: 18px}
h5 { font-size: 1.1em;margin: 10px 0;}
h6 {font-size: 16px}
h6 {font-size: 1em;margin: 10px 0;}
::marker {font-size: 0.7em;}
dl{
margin-top:0.5rem;
margin-bottom:0.5rem;
}
body{
body{
         font-family: "Open Sans",sans-serif;
         font-family: "Open Sans",sans-serif;
         font-optical-sizing: auto;
         font-optical-sizing: auto;
        font-weight: 500;
         font-style: normal;
         font-style: normal;
         font-variation-settings: "wdth" 100;
         font-variation-settings: "wdth" 100;
Строка 64: Строка 72:
     scroll-behavior:smooth;
     scroll-behavior:smooth;
}
}
.frame1 {border-radius: 12px;overflow: hidden;border: 1px solid black;flex-basis: calc(33% - 8px);flex-grow: 1;height: auto;position: relative;box-shadow: 0px 12px 16px #00000054;display: flex;flex-direction: column;margin-bottom: 10px}
 
.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;
Строка 79: Строка 156:
     font-size: 16px;
     font-size: 16px;
     padding: 4px 20px;
     padding: 4px 20px;
    /* font-family: Reaver,serif; */
     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;gap: 6px;lign-items: top}
.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;
Строка 97: Строка 208:
     font-family: inherit;
     font-family: inherit;
     font-size: 0.95em;
     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;
}
}

Текущая версия от 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;
}