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

Версия от 15:51, 7 июля 2024

.pageframe-container {
  backdrop-filter: var(--blur-default);
}

/* Лого на главной странице */
.tg-logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 900px;
  padding: 2em 1.5em 0;
  background-color: var(--color-bg-section-light);
  border: var(--border-classic);
  border-radius: var(--border-radius-large);
  backdrop-filter: var(--blur-default);
}

.tg-logo a img {
  width: 100%;
  height: auto;
}

.tg-welcome {
  display: inline-flex;
  font-weight: bold;
  padding: 0 1em;
  margin: 1em 0.5em 0.5em 0.5em;
  background-color: var(--color-primary);
  color: var(--color-white);
  border-radius: var(--border-radius-large);
}

.tg-info {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.tg-info-string:first-child {
  max-width: 80%;
  padding: 0.5em 1em;
  margin-bottom: 0.5em;
  background-color: var(--color-bg-section-light);
  border: var(--border-classic);
  border-top: 0;
  border-radius: 0 0 var(--border-radius-large) var(--border-radius-large);
  box-shadow: inset 0px 5px 5px -5px rgba(0,0,0, 0.2);
  backdrop-filter: var(--blur-default);
}

/* Контент главной страницы */
.wiki-mainpage {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75em;
}

.wiki-mainpage-column {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.75em;
}

/* Вкладки департаментов для NavBar */
.department-tabs {
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
}

.department-tabs-tab {
  display: inline-flex;
  flex-grow: 1;
  flex-basis: 5%;
}

.department-tabs-tab a {
  padding: 0.4em 1em;
  flex-grow: 1;
  text-align: center;
  font-weight: bold;
}

.department-tabs-tab a,
.department-tabs-tab a:active {
  color: var(--color-text-gray);
}

.department-tabs-tab a:hover,
.department-tabs-tab a:active:hover {
  color: var(--color-text-darker);
}

.department-tabs-tab a.mw-selflink {
  color: var(--color-text) !important;
}

/* Кнопки на главной странице */
.pagebutton-container {
  display: inline-flex;
  flex-direction: column;
  margin: 0.25em;
  border: var(--border-classic);
}

.pagebutton-hover {
  background-color: transparent;
  transition: background-color var(--transition-time);
}

.pagebutton-hover:hover {
  background-color: var(--color-bg-section-light);
}

.pagebutton-text a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  min-height: 21px;
  background-color: var(--color-bg-focus);
  color: var(--color-white) !important;
  border-top: var(--border-classic);
}

.pagebutton-image a img {
  display: flex;
  margin: 0 auto;
  padding: 0.5em;
}

/* Стилизованные ссылки */
.custom-link a {
  display: inline-block;
  margin: 0.25em;
  padding: 0em 0.5em;
  vertical-align: middle;
  background-color: var(--color-primary);
  color: var(--color-white) !important;
  border-radius: var(--border-radius-small);
  transition: background-color var(--transition-time);
}

.custom-link a:hover {
  background-color: var(--color-primary-light);
}

/* Item Template */
.item-template {
  position: relative;
  overflow: auto;
  display: inline-flex;
  flex-direction: column;
  border-radius: var(--border-radius-small);
}

.item-template-item {
  display: flex;
}

.item-template-desc {
  padding: 0.25em 0.5em;
  white-space: break-spaces;
}

.item-template-desc p {
  display: inline-block;
  width: 100%;
}

.item-template-desc ul {
  white-space: normal;
}

.item-template-desc br {
  display: none;
}

.item-template-storage {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Construction Template */
.construction-container {
  overflow: auto; 
  display: flex; 
  position: relative; 
  width: 50%;
  border-radius: var(--border-radius-medium);
  box-shadow: var(--shadow-template--medium);
}

.construcion-object {
  display: flex;
  flex-direction: column;
  width: 20%; 
  box-shadow: var(--shadow-template--small);
  z-index: var(--index-fore);
}

.construction-tools {
  display: flex;
  flex-direction: column; 
}

.construction-steps {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.construction-info-header {
  padding: 0.25em 0.5em;
  text-align: center;
  font-weight: bold;
  color: var(--color-white);
}