MediaWiki:Common.css: различия между версиями
Перейти к навигации
Перейти к поиску
Нет описания правки |
Нет описания правки |
||
(не показано 59 промежуточных версий этого же участника) | |||
Строка 1: | Строка 1: | ||
/* Размещённый здесь CSS будет применяться ко всем темам оформления */ | /* Размещённый здесь CSS будет применяться ко всем темам оформления */ | ||
.banner_top { | |||
width: 20%; | |||
height: 500px; | |||
margin-left: 20px; | |||
position: sticky; | |||
top: 5px; | |||
border-radius: 10px; | |||
transition: all 0.5s; | |||
display: flex; | |||
justify-content: right; | |||
} | |||
.banner_top img:hover { | |||
box-shadow: 0px 0px 17px 0px #00fed7; | |||
transition: all 0.5s; | |||
transform: scale(1.01); | |||
} | |||
.banner_top_red img:hover { | |||
box-shadow: 0px 0px 17px 0px #ff7b7b; | |||
transition: all 0.5s; | |||
transform: scale(1.01); | |||
} | |||
.banner_bottom { | |||
width:720px; | |||
margin:auto; | |||
} | |||
.banner_bottom img:hover { | |||
transition: all 0.5s; | |||
transform: scale(1.01); | |||
} | |||
img.strip { | img.strip { | ||
Строка 152: | Строка 190: | ||
.flexbox { | .flexbox { | ||
display: flex; | |||
justify-content: space-between; | |||
margin: auto; | |||
flex-wrap: wrap; | |||
} | |||
.image_good { | |||
position: relative; | |||
margin: 0px 0px 20px 0px; | |||
} | |||
.image_bad { | |||
position: relative; | |||
margin: 0px 35px 20px 35px; | |||
width: 200px | |||
} | |||
.box_center { | |||
display: block; | |||
width: 80%; | |||
margin: auto; | |||
} | |||
.shadow1 img:hover { | |||
box-shadow: 0px 0px 15px 0px #d10e0ee8; | |||
transition-duration: 0.5s; | |||
} | |||
.shadow1 img { | |||
border-radius: 27px; | |||
} | |||
.image-container { | |||
width: 30%; | |||
display: flex; | |||
flex-flow: column; | |||
align-items: center; | |||
} | |||
.container_list_draws { | |||
margin: auto; | |||
display: flex; | |||
justify-content: space-between; | |||
} | |||
.info_content_text { | |||
margin-left: 6%; | |||
margin-right: 6%; | |||
margin-top: 30px; | |||
} | |||
.draw_block, | |||
.draw_block_active { | |||
width: 320px; | |||
height: 345px; | |||
background-color: white; | |||
border-radius: 20px; | |||
margin-bottom: 30px; | |||
overflow: hidden; | |||
box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15); | |||
transition: 0.3s all; | |||
} | |||
.draw_block img, | |||
.draw_block_active img { | |||
width: 320px; | |||
height: auto; | |||
display: block; | |||
margin-top: -7px; | |||
} | |||
.draw_buttons { | |||
text-align: center; | |||
} | |||
.draw_buttons p { | |||
font-weight: 700; | |||
color: #ca9e58; | |||
} | |||
.draw_buttons_line img { | |||
width: 15px; | |||
margin-left: 3px; | |||
} | |||
.draw_buttons_line { | |||
display: flex; | |||
justify-content: space-evenly; | |||
margin: auto; | |||
margin-bottom: 25px; | |||
} | |||
.draw_buttons_line button { | |||
width: 140px !important; | |||
font-size: 14px !important; | |||
display: flex; | |||
padding: 10px; | |||
justify-content: center; | |||
} | |||
.button_welcome_bonus, .button_gifts_raffle, .button_gifts_telegram, .button_gifts_giveaway { | |||
display: flex; | display: flex; | ||
justify-content: center; | justify-content: center; | ||
margin: | margin: auto; | ||
flex- | width: calc(80% - 5px); | ||
text-align: center; | |||
background-color: #ccc; | |||
border-radius: 30px; | |||
cursor: pointer; | |||
text-align: center; | |||
margin-bottom: 15px; | |||
padding: 12px; | |||
color: white; | |||
transition: 0.3s all; | |||
margin-top: 14px; | |||
} | |||
.button_welcome_bonus{ | |||
display: inline; | |||
margin-top: 0px; | |||
} | |||
.button_welcome_bonus{ | |||
background: linear-gradient(rgb(255 220 125) 0%, rgb(199 154 86) 100%); | |||
} | |||
.button_gifts_raffle{ | |||
background: linear-gradient(180deg, #ff93b2 0%, #950000 150%); | |||
} | |||
.button_gifts_telegram{ | |||
background: linear-gradient(180deg, #a358df 0%, #266bc0 100%); | |||
} | |||
.button_gifts_giveaway{ | |||
background: linear-gradient(180deg, #c4ba93 0%, #268d6b 100%); | |||
} | |||
.draw_buttons button:hover { | |||
box-shadow: -1px 3px 7px 0 rgba(0, 0, 0, 0.367); | |||
transform: translateY(-3px); | |||
} | |||
.mw-parser-output a.external { | |||
background-image: none; | |||
background-position: center right; | |||
background-repeat: no-repeat; | |||
background-size: 0.857em; | |||
padding-right: 0em; | |||
} | |||
@media only screen and (max-width : 1750px) { | |||
.container_list_draws { | |||
flex-direction: column; | |||
align-items: center; | |||
} | |||
} | } |
Текущая версия от 21:12, 29 июля 2024
/* Размещённый здесь CSS будет применяться ко всем темам оформления */ .banner_top { width: 20%; height: 500px; margin-left: 20px; position: sticky; top: 5px; border-radius: 10px; transition: all 0.5s; display: flex; justify-content: right; } .banner_top img:hover { box-shadow: 0px 0px 17px 0px #00fed7; transition: all 0.5s; transform: scale(1.01); } .banner_top_red img:hover { box-shadow: 0px 0px 17px 0px #ff7b7b; transition: all 0.5s; transform: scale(1.01); } .banner_bottom { width:720px; margin:auto; } .banner_bottom img:hover { transition: all 0.5s; transform: scale(1.01); } img.strip { margin-right: 250px; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,0.5); } p.strip { text-align: left; margin: 25px; } .panel-s { border: 3px double rgb(255, 255, 255); padding: 1px; margin: 2% 5%; display: flex; } .img-right { margin-right: 1em; } .img-right img { float: right; border-radius: 5px; box-shadow: 0 0 10px rgba(93, 93, 93, 0.5); } .desc-r { text-align: justify; padding-right: 1.5em; font-size: 17px; } .desc-a { text-align: center; padding-right: 1.5em; font-size: 17px; } .desc-t { text-align: left; padding-left: 30px; font-size: 17px; } .desc-m { text-align: left; padding-left: 30px; font-size: 17px; margin: 2% 3%; } .img-right, .desc-r { display: flex; align-items: center; justify-content: center; } .about { width: 18%; margin-top: 15px; margin-bottom: 15px; text-align: left; border: 2px dashed #5FE2CA; padding: 11px; font-weight: 700; color: #213F55 } .about_c { width: 19%; margin: 0 auto; text-align: left; border: 2px dashed #5FE2CA; padding: 11px; font-weight: 700; color: #213F55 } .about_all { width: 50%; margin: 0 auto; margin-top: 15px; margin-bottom: 15px; text-align: center; border: 2px dashed #5FE2CA; padding: 20px; font-weight: 700; color: #213F55 } .about_s { width: 55%; margin: 0 auto; margin-top: 15px; margin-bottom: 15px; text-align: left; border: 2px dashed #5FE2CA; padding: 20px; font-weight: 700; color: #213F55 } .mw-highlight { background: #f8f8f8; unicode-bidi: embed; padding: 1px 4px; } .img-logo{ } @media only screen and (max-width : 700px) { .img-logo{ max-width: 50% !important } } .ul#menu li{ display:inline-block; } .block_3 { display: inline-block; padding-right: 0px; margin: 10px; font-size: 18px; } .square { border: 15px solid transparent; border-image: linear-gradient(343deg,#b2ffed 0%,#2f957c 100%) 20% / 1 / 0 stretch; padding: 15px; font-size: 20px; } .b { font-weight: bolder; } .strong { font-size: 28px; font-weight: bolder; } .flexbox { display: flex; justify-content: space-between; margin: auto; flex-wrap: wrap; } .image_good { position: relative; margin: 0px 0px 20px 0px; } .image_bad { position: relative; margin: 0px 35px 20px 35px; width: 200px } .box_center { display: block; width: 80%; margin: auto; } .shadow1 img:hover { box-shadow: 0px 0px 15px 0px #d10e0ee8; transition-duration: 0.5s; } .shadow1 img { border-radius: 27px; } .image-container { width: 30%; display: flex; flex-flow: column; align-items: center; } .container_list_draws { margin: auto; display: flex; justify-content: space-between; } .info_content_text { margin-left: 6%; margin-right: 6%; margin-top: 30px; } .draw_block, .draw_block_active { width: 320px; height: 345px; background-color: white; border-radius: 20px; margin-bottom: 30px; overflow: hidden; box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15); transition: 0.3s all; } .draw_block img, .draw_block_active img { width: 320px; height: auto; display: block; margin-top: -7px; } .draw_buttons { text-align: center; } .draw_buttons p { font-weight: 700; color: #ca9e58; } .draw_buttons_line img { width: 15px; margin-left: 3px; } .draw_buttons_line { display: flex; justify-content: space-evenly; margin: auto; margin-bottom: 25px; } .draw_buttons_line button { width: 140px !important; font-size: 14px !important; display: flex; padding: 10px; justify-content: center; } .button_welcome_bonus, .button_gifts_raffle, .button_gifts_telegram, .button_gifts_giveaway { display: flex; justify-content: center; margin: auto; width: calc(80% - 5px); text-align: center; background-color: #ccc; border-radius: 30px; cursor: pointer; text-align: center; margin-bottom: 15px; padding: 12px; color: white; transition: 0.3s all; margin-top: 14px; } .button_welcome_bonus{ display: inline; margin-top: 0px; } .button_welcome_bonus{ background: linear-gradient(rgb(255 220 125) 0%, rgb(199 154 86) 100%); } .button_gifts_raffle{ background: linear-gradient(180deg, #ff93b2 0%, #950000 150%); } .button_gifts_telegram{ background: linear-gradient(180deg, #a358df 0%, #266bc0 100%); } .button_gifts_giveaway{ background: linear-gradient(180deg, #c4ba93 0%, #268d6b 100%); } .draw_buttons button:hover { box-shadow: -1px 3px 7px 0 rgba(0, 0, 0, 0.367); transform: translateY(-3px); } .mw-parser-output a.external { background-image: none; background-position: center right; background-repeat: no-repeat; background-size: 0.857em; padding-right: 0em; } @media only screen and (max-width : 1750px) { .container_list_draws { flex-direction: column; align-items: center; } }