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

Материал из SAMP
Нет описания правки
Нет описания правки
 
(не показано 7 промежуточных версий этого же участника)
Строка 42: Строка 42:
width: 100%;
width: 100%;
height: auto;
height: auto;
}
@media screen and (orientation: landscape)/* PK */
{
.infobox
{
position: relative;
lear: right;
float: right;
width: 320px;
}
.infobox_image > span > span > img
{
width: 100%;
height: 200px;
border: none;
}
}
@media screen and (orientation: portrait )/* mobile */
{
.infobox
{
width: 100%;
}
.infobox_image > span > span > img
{
width: 100%;
height: 180px;
border: none;
}
}
}


Строка 136: Строка 107:
     transition: 0.2s;
     transition: 0.2s;
}
}
.index_subelems > p { display: none; }
.index_elem.active > .index_subelems
.index_elem.active > .index_subelems
{
{
Строка 143: Строка 115:
.index_subelem
.index_subelem
{
{
width: 96%;
width: 90%;
padding: 2% 5%;
padding: 2% 5%;
background-color: #111d41;
background-color: #111d41;
Строка 155: Строка 127:
{
{
border-radius: 0 0 15px 15px;
border-radius: 0 0 15px 15px;
}
@media screen and (orientation: landscape)/* PK */
{
.infobox
{
position: relative;
lear: right;
float: right;
width: 320px;
}
.infobox_image > span > span > img
{
width: 100%;
height: 200px;
border: none;
}
}
@media screen and (orientation: portrait )/* mobile */
{
.infobox
{
width: 100%;
}
.infobox_image > span > span > img
{
width: 100%;
height: 180px;
border: none;
}
.index
{
gap: 20px 0;
font-size: 14px;
}
}
.mw-notification-visible
{
background: #111d41 !important;
    border: 1px solid #070b28  !important;
}
}

Текущая версия от 01:30, 1 июня 2025

.infobox
{
	border: 1px #C6C6C6 solid;
}
.infobox_head 
{ 
	text-align: center; 
	font-weight: bold; 
	padding: 2% 0.5%; 
	font-size: 18px;
}
.infobox_param
{
	display: flex;
	border-bottom: 2px solid #FFFFFF;
    margin: 1px 5%;
    padding: 5px 5px 10px 5px;
}
.infobox_param:last-child
{
	border-bottom: unset;
}
.infobox_param_titul
{
	font-weight: bold;
}
.infobox_param_text > p
{
	margin: 0;
}
.infobox_param > div
{
	width: 50%;
}
.skin
{
	display: inline-block;
	max-width: 20%;
}
.skin > span > span > img
{
	width: 100%;
	height: auto;
}


.index
{
	display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    align-items: flex-start;
}
.index_elem
{
	background: #111d41;
	border: 1px #111111 solid; 
	border-radius: 15px;
	width: 350px;
	position: relative;
	margin: 1%;
	cursor: pointer;
}
.banner > span > span > img
{
	width: 100%;
	height: 120px;
	border-radius: 15px;
}

.index_elem.active > .banner > span > span > img
{
	border-radius: 15px 15px 0 0;
}

.index_elem_title
{
	position: absolute;
	top: 50px;
	left: 15px;
	font-weight: bold;
	width: 90%;
	cursor: pointer;
}
.index_elem_title::after
{    
	display: inline-block;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFFFFF' width='24' height='24'%3e%3cpath d='M13 17.586V4h-2v13.586l-6.293-6.293-1.414 1.414L12 21.414l8.707-8.707-1.414-1.414L13 17.586z'/%3e%3c/svg%3e");
	width: 20px;
	height: 20px;
	background-size: cover;
	content: "";
    position: absolute;
    right: 0;
    transition: 0.2s;
}

.index_elem.active > .index_elem_title::after
{
	transform: rotate(180deg);
}
.index_subelems
{
    text-shadow: 0 0 6px black;
    display: none;
    height: 0;
    transition: 0.2s;
}
.index_subelems > p { display: none; }
.index_elem.active > .index_subelems
{
	display: block;
	height: auto;
}
.index_subelem
{
	width: 90%;
	padding: 2% 5%;
	background-color: #111d41;
	transition: 0.2s;
	&:hover
	{
		background-color: #1c2a54;
	}
}
.index_subelem:last-child
{
	border-radius: 0 0 15px 15px;
}


@media screen and (orientation: landscape)/* PK */ 
{
	.infobox
	{
		position: relative;
		lear: right;
		float: right;
		width: 320px;
	}
	.infobox_image > span > span > img
	{
		width: 100%;
		height: 200px;
		border: none;
	}
}
@media screen and (orientation: portrait )/* mobile */ 
{
	.infobox
	{
		width: 100%;
	}
	.infobox_image > span > span > img
	{
		width: 100%;
		height: 180px;
		border: none;
	}
	.index
	{
		gap: 20px 0;
		font-size: 14px;
	}
}

.mw-notification-visible
{
	background: #111d41 !important;
    border: 1px solid #070b28  !important;
}