Dantes (обсуждение | вклад) Нет описания правки Метка: ручная отмена |
Dantes (обсуждение | вклад) Нет описания правки |
||
| Строка 2: | Строка 2: | ||
display: flex; | display: flex; | ||
flex-wrap: wrap; | flex-wrap: wrap; | ||
gap: 1em; | gap: 1em; | ||
overflow-x: auto; | overflow-x: auto; /* горизонтальная прокрутка, если не помещается */ | ||
padding | padding: 0.5em; | ||
} | } | ||
.alchemy-card { | .alchemy-card { | ||
flex: 1 1 22%; /* приблизительно 4 карточки в ряд */ | |||
border | min-width: 280px; | ||
border: 2px solid; | |||
border-radius: 8px; | border-radius: 8px; | ||
background-color: #1a2a1a; | |||
color: #eee; | |||
padding: 1em; | |||
box-sizing: border-box; | box-sizing: border-box; | ||
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; | |||
} | } | ||
.alchemy-title { | .alchemy-title { | ||
margin-top: 0; | margin-top: 0; | ||
margin-bottom: 0.5em; | |||
color: #66cc66; | |||
font-weight: bold; | |||
text-align: center; | text-align: center; | ||
} | } | ||
.alchemy-main-row { | .alchemy-main-row { | ||
display: flex; | display: flex; | ||
align-items: | justify-content: center; | ||
align-items: center; | |||
gap: 1em; | |||
margin-bottom: 0.7em; | |||
flex-wrap: nowrap; | |||
} | } | ||
.alchemy-ingredients, | .alchemy-ingredients, .alchemy-result { | ||
.alchemy-result { | |||
display: flex; | display: flex; | ||
flex-direction: column; | flex-direction: column; | ||
gap: 0.3em; | |||
min-width: 80px; | |||
} | } | ||
.alchemy- | .alchemy-item { | ||
background-color: #338833; | |||
padding: 0.2em 0.4em; | |||
border-radius: 3px; | |||
. | font-size: 0.9em; | ||
border- | text-align: center; | ||
font- | |||
} | } | ||
.alchemy-plus { | .alchemy-plus { | ||
font-weight: bold; | font-weight: bold; | ||
color: #cc7744; | |||
user-select: none; | user-select: none; | ||
font-size: 1.1em; | |||
} | } | ||
.alchemy-effects { | .alchemy-effects { | ||
padding-left: 1.2em; | |||
margin-top: 0; | |||
color: # | margin-bottom: 0.5em; | ||
color: #eee; | |||
font-size: 0.9em; | |||
} | } | ||
.alchemy-effects-desc { | .alchemy-effects-desc { | ||
font-style: italic; | font-style: italic; | ||
font-size: 0.85em; | font-size: 0.85em; | ||
color: #ccc; | |||
margin-top: 0.3em; | |||
white-space: normal; | |||
} | } | ||
Версия от 18:22, 16 мая 2025
.alchemy-grid {
display: flex;
flex-wrap: wrap;
gap: 1em;
overflow-x: auto; /* горизонтальная прокрутка, если не помещается */
padding: 0.5em;
}
.alchemy-card {
flex: 1 1 22%; /* приблизительно 4 карточки в ряд */
min-width: 280px;
border: 2px solid;
border-radius: 8px;
background-color: #1a2a1a;
color: #eee;
padding: 1em;
box-sizing: border-box;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.alchemy-title {
margin-top: 0;
margin-bottom: 0.5em;
color: #66cc66;
font-weight: bold;
text-align: center;
}
.alchemy-main-row {
display: flex;
justify-content: center;
align-items: center;
gap: 1em;
margin-bottom: 0.7em;
flex-wrap: nowrap;
}
.alchemy-ingredients, .alchemy-result {
display: flex;
flex-direction: column;
gap: 0.3em;
min-width: 80px;
}
.alchemy-item {
background-color: #338833;
padding: 0.2em 0.4em;
border-radius: 3px;
font-size: 0.9em;
text-align: center;
}
.alchemy-plus {
font-weight: bold;
color: #cc7744;
user-select: none;
font-size: 1.1em;
}
.alchemy-effects {
padding-left: 1.2em;
margin-top: 0;
margin-bottom: 0.5em;
color: #eee;
font-size: 0.9em;
}
.alchemy-effects-desc {
font-style: italic;
font-size: 0.85em;
color: #ccc;
margin-top: 0.3em;
white-space: normal;
}