MediaWiki:Common.css: различия между версиями
Перейти к навигации
Перейти к поиску
Shaseer (обсуждение | вклад) |
Zibit (обсуждение | вклад) м |
||
Строка 3: | Строка 3: | ||
position: fixed; | position: fixed; | ||
background-image: linear-gradient(#ffffff 50%,#f6f6f6 100%); | background-image: linear-gradient(#ffffff 50%,#f6f6f6 100%); | ||
+ | } | ||
+ | |||
+ | #button { | ||
+ | display: inline-block; | ||
+ | background-color: #FF9800; | ||
+ | width: 50px; | ||
+ | height: 50px; | ||
+ | text-align: center; | ||
+ | border-radius: 4px; | ||
+ | position: fixed; | ||
+ | bottom: 30px; | ||
+ | right: 30px; | ||
+ | transition: background-color .3s, | ||
+ | opacity .5s, visibility .5s; | ||
+ | opacity: 0; | ||
+ | visibility: hidden; | ||
+ | z-index: 1000; | ||
+ | } | ||
+ | #button::after { | ||
+ | content: "\f077"; | ||
+ | font-family: FontAwesome; | ||
+ | font-weight: normal; | ||
+ | font-style: normal; | ||
+ | font-size: 2em; | ||
+ | line-height: 50px; | ||
+ | color: #fff; | ||
+ | } | ||
+ | #button:hover { | ||
+ | cursor: pointer; | ||
+ | background-color: #333; | ||
+ | } | ||
+ | #button:active { | ||
+ | background-color: #555; | ||
+ | } | ||
+ | #button.show { | ||
+ | opacity: 1; | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | /* Styles for the content section */ | ||
+ | |||
+ | .content { | ||
+ | width: 77%; | ||
+ | margin: 50px auto; | ||
+ | font-family: 'Merriweather', serif; | ||
+ | font-size: 17px; | ||
+ | color: #6c767a; | ||
+ | line-height: 1.9; | ||
+ | } | ||
+ | @media (min-width: 500px) { | ||
+ | .content { | ||
+ | width: 43%; | ||
+ | } | ||
+ | #button { | ||
+ | margin: 30px; | ||
+ | } | ||
+ | } | ||
+ | .content h1 { | ||
+ | margin-bottom: -10px; | ||
+ | color: #03a9f4; | ||
+ | line-height: 1.5; | ||
+ | } | ||
+ | .content h3 { | ||
+ | font-style: italic; | ||
+ | color: #96a2a7; | ||
} | } |
Версия 10:05, 6 декабря 2019
/* Размещённый здесь CSS будет применяться ко всем темам оформления */ .mv-head { position: fixed; background-image: linear-gradient(#ffffff 50%,#f6f6f6 100%); } #button { display: inline-block; background-color: #FF9800; width: 50px; height: 50px; text-align: center; border-radius: 4px; position: fixed; bottom: 30px; right: 30px; transition: background-color .3s, opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 1000; } #button::after { content: "\f077"; font-family: FontAwesome; font-weight: normal; font-style: normal; font-size: 2em; line-height: 50px; color: #fff; } #button:hover { cursor: pointer; background-color: #333; } #button:active { background-color: #555; } #button.show { opacity: 1; visibility: visible; } /* Styles for the content section */ .content { width: 77%; margin: 50px auto; font-family: 'Merriweather', serif; font-size: 17px; color: #6c767a; line-height: 1.9; } @media (min-width: 500px) { .content { width: 43%; } #button { margin: 30px; } } .content h1 { margin-bottom: -10px; color: #03a9f4; line-height: 1.5; } .content h3 { font-style: italic; color: #96a2a7; }