MediaWiki:Mobile.css: различия между версиями
Перейти к навигации
Перейти к поиску
Gryadka (обсуждение | вклад) (Полностью удалено содержимое страницы) Метка: очистка |
Gryadka (обсуждение | вклад) Нет описания правки Метка: ручная отмена |
||
(не показано 27 промежуточных версий этого же участника) | |||
Строка 1: | Строка 1: | ||
.header-container.header-chrome { | |||
background: url('/images/f/f2/Shapka.png') no-repeat top left; | |||
background-color: #ffffff; | |||
background-size: 450px; | |||
box-shadow: inset 0 -2px 3px rgba(0,0,0,0.1); | |||
} | |||
.search-box { | |||
text-align: right; | |||
} | |||
.search-box .search { | |||
background-color: #ffffff; | |||
border-color: transparent; | |||
box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1); | |||
color: var(--text-color); | |||
} | |||
.search-box .search::placeholder { | |||
color: var(--byline-color); | |||
} | |||
.mw-ui-background-icon-search { | |||
background-image: var(--searchbutton-icon); | |||
} | |||
.overlay.search-overlay { | |||
background: var(--body-main); | |||
} | |||
.overlay.search-overlay .results, | |||
.overlay.search-overlay .search-feedback { | |||
background-color: var(--body-light); | |||
} | |||
.overlay.search-overlay .search-content { | |||
border-color: var(--body-mid); | |||
} | |||
.event-container { | |||
display: flex; | |||
justify-content: flex-start; | |||
align-items: center; | |||
flex-wrap: nowrap; | |||
overflow-x: auto; /* добавляет горизонтальный скролл, если содержимое выходит за пределы */ | |||
scrollbar-width: none; /* Для Firefox */ | |||
-ms-overflow-style: none; /* Для Internet Explorer 10+ */ | |||
} | |||
.event-container::-webkit-scrollbar { | |||
display: none; /* Для WebKit браузеров, таких как Chrome и Safari */ | |||
} | |||
.event-block { | |||
flex: 1 0 auto; | |||
padding: 10px; | |||
margin-right: 20px; | |||
border: 1px solid rgba(0, 0, 0, 0.1); | |||
width: 400px; /* Установите максимальную ширину блока по вашему желанию */ | |||
height: 500px; /* Установите максимальную ширину блока по вашему желанию */ | |||
flex-shrink: 0; | |||
} | |||
.event-container .event-block:first-child { | |||
margin-left: 0px; /* или любое другое значение, которое подходит */ | |||
} | |||
.event-content { | |||
display: flex; | |||
flex-direction: column; | |||
max-width: 100%; /* Используйте 100% для автоматического соответствия ширине блока */ | |||
} | |||
.event-image { | |||
/* Стили для изображения */ | |||
} | |||
.event-details { | |||
/* Стили для деталей события */ | |||
overflow: hidden; /* Обрезать текст, который выходит за пределы блока */ | |||
} |
Текущая версия от 07:41, 20 декабря 2023
.header-container.header-chrome { background: url('/images/f/f2/Shapka.png') no-repeat top left; background-color: #ffffff; background-size: 450px; box-shadow: inset 0 -2px 3px rgba(0,0,0,0.1); } .search-box { text-align: right; } .search-box .search { background-color: #ffffff; border-color: transparent; box-shadow: 0 0.25rem 0.35rem -0.25rem rgba(0, 0, 0, 0.1); color: var(--text-color); } .search-box .search::placeholder { color: var(--byline-color); } .mw-ui-background-icon-search { background-image: var(--searchbutton-icon); } .overlay.search-overlay { background: var(--body-main); } .overlay.search-overlay .results, .overlay.search-overlay .search-feedback { background-color: var(--body-light); } .overlay.search-overlay .search-content { border-color: var(--body-mid); } .event-container { display: flex; justify-content: flex-start; align-items: center; flex-wrap: nowrap; overflow-x: auto; /* добавляет горизонтальный скролл, если содержимое выходит за пределы */ scrollbar-width: none; /* Для Firefox */ -ms-overflow-style: none; /* Для Internet Explorer 10+ */ } .event-container::-webkit-scrollbar { display: none; /* Для WebKit браузеров, таких как Chrome и Safari */ } .event-block { flex: 1 0 auto; padding: 10px; margin-right: 20px; border: 1px solid rgba(0, 0, 0, 0.1); width: 400px; /* Установите максимальную ширину блока по вашему желанию */ height: 500px; /* Установите максимальную ширину блока по вашему желанию */ flex-shrink: 0; } .event-container .event-block:first-child { margin-left: 0px; /* или любое другое значение, которое подходит */ } .event-content { display: flex; flex-direction: column; max-width: 100%; /* Используйте 100% для автоматического соответствия ширине блока */ } .event-image { /* Стили для изображения */ } .event-details { /* Стили для деталей события */ overflow: hidden; /* Обрезать текст, который выходит за пределы блока */ }