fix(podbor): niche inputs overflow — min-width:0 + shorter placeholders

This commit is contained in:
wasrusgen 2026-05-09 13:43:17 +03:00
parent d1165d5e4f
commit 571297c017
3 changed files with 20 additions and 12 deletions

View File

@ -227,17 +227,25 @@
font-weight: 500;
color: var(--ink-2);
}
.niche-inputs { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.niche-inputs {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 6px;
min-width: 0;
}
.niche-inputs input {
min-width: 0; /* критично — иначе input не даёт колонке сжиматься */
width: 100%;
font-family: var(--font-mono);
font-size: 13px;
padding: 9px 10px;
font-size: 12.5px;
padding: 8px 4px;
text-align: center;
background: var(--paper);
border: 1px solid var(--line);
border-radius: var(--r-tag);
color: var(--ink);
}
.niche-inputs input::placeholder { font-size: 11px; }
.budget-list { display: flex; flex-direction: column; gap: var(--s2); }
.field-inline {

View File

@ -200,9 +200,9 @@ const Podbor = (function () {
<div class="niche-row">
<div class="niche-label">${cat.label}</div>
<div class="niche-inputs">
<input type="number" data-niche="${c}.w" value="${n.w || ""}" placeholder=, мм">
<input type="number" data-niche="${c}.h" value="${n.h || ""}" placeholder="В, мм">
<input type="number" data-niche="${c}.d" value="${n.d || ""}" placeholder=, мм">
<input type="number" data-niche="${c}.w" value="${n.w || ""}" placeholder=">
<input type="number" data-niche="${c}.h" value="${n.h || ""}" placeholder="В">
<input type="number" data-niche="${c}.d" value="${n.d || ""}" placeholder=">
</div>
</div>
`;

View File

@ -12,8 +12,8 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Geist:wght@400;500;600&family=Newsreader:ital,wght@0,400..600;1,400..600&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500&display=swap">
<script src="https://telegram.org/js/telegram-web-app.js"></script>
<link rel="stylesheet" href="assets/styles.css?v=20260509k">
<link rel="stylesheet" href="assets/podbor.css?v=20260509k">
<link rel="stylesheet" href="assets/styles.css?v=20260509l">
<link rel="stylesheet" href="assets/podbor.css?v=20260509l">
</head>
<body>
<main id="app">
@ -21,9 +21,9 @@
<div class="spinner"></div>
</div>
</main>
<script src="assets/icons.js?v=20260509k"></script>
<script src="assets/podbor.config.js?v=20260509k"></script>
<script src="assets/podbor.js?v=20260509k"></script>
<script src="assets/app.js?v=20260509k"></script>
<script src="assets/icons.js?v=20260509l"></script>
<script src="assets/podbor.config.js?v=20260509l"></script>
<script src="assets/podbor.js?v=20260509l"></script>
<script src="assets/app.js?v=20260509l"></script>
</body>
</html>