[html]<style>
.bankwrap{max-width:520px;margin:16px auto;font-family:var(--font-main);color:var(--text);font-size:12px;display:flex;flex-direction:column;gap:14px}
.bankhead{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:14px 18px;display:flex;justify-content:space-between;align-items:center}
.bankhead .l{font-size:11px;color:var(--muted);text-transform:lowercase}
.bankhead .src{display:block;margin-top:3px;font-size:10px;color:#5f8158}
.bankhead .src b{font-weight:600}
.bankhead .v{font-size:20px;font-weight:700;color:var(--accent)}
.bankshop{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:14px}
.banktitle{font-size:11px;color:var(--muted);text-transform:lowercase}
#bankPositions{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}
.bankpos{display:flex;justify-content:space-between;align-items:center;height:34px;padding:0 14px;border:1px solid var(--border);border-radius:8px;background:var(--white);color:var(--text);font-family:var(--font-main);font-size:12px;text-transform:lowercase;cursor:pointer}
.bankpos:hover{border-color:var(--soft)}
.bankpos b{font-weight:700;color:var(--steel)}
.bankcart{border-top:1px dashed var(--border);padding-top:12px;display:flex;flex-direction:column;gap:10px}
#bankCart{display:flex;flex-direction:column;gap:8px;font-size:12px}
.bankline{display:flex;flex-direction:column;gap:5px}
.bankline-top{display:flex;justify-content:space-between;align-items:center;color:var(--text)}
.bankline .q{font-style:normal;color:var(--muted);font-size:11px}
.bankline .bctrl{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:4px;border-radius:4px;background:var(--panel);color:var(--steel);cursor:pointer;font-size:12px;line-height:1}
.bankline .bctrl:hover{background:var(--bg)}
.bankline .bctrl.bx:hover{background:var(--bg);color:var(--accent)}
.banklink{width:100%;height:28px;padding:0 10px;border:1px solid var(--border);border-radius:6px;background:var(--white);font-family:var(--font-main);font-size:11px;color:var(--text)}
.banklink:focus{outline:none;border-color:var(--soft)}
.banklink::placeholder{color:var(--muted)}
.banksum{border-top:1px dashed var(--border);margin-top:6px;padding-top:8px;display:flex;flex-direction:column;gap:4px}
.banksum-row{display:flex;justify-content:space-between;align-items:center;color:var(--muted)}
.banksum-row .bplus{color:#5f8158;font-weight:600}
.banksum-row .bminus{color:#c04060;font-weight:600}
.banksum-row.banknet{color:var(--text);font-weight:600}
.banksum-row.bankfinal{color:var(--text);font-weight:700;font-size:14px;border-top:1px dashed var(--border);padding-top:7px;margin-top:2px}
.bankrow{display:flex;gap:8px}
.bankbtn{flex:1;height:34px;border:none;border-radius:8px;background:var(--accent);color:var(--white);font-family:var(--font-main);font-size:12px;font-weight:600;text-transform:lowercase;cursor:pointer}
.bankbtn:hover{background:var(--soft)}
.bankbtn2{flex:1;height:34px;border:1px solid var(--border);border-radius:8px;background:var(--white);color:var(--steel);font-family:var(--font-main);font-size:12px;font-weight:600;text-transform:lowercase;cursor:pointer}
.bankbtn2:hover{border-color:var(--accent);color:var(--accent)}
#bankOut{width:100%;min-height:70px;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--white);font-family:var(--font-main);font-size:11px;color:var(--text);resize:vertical}
</style>
<div class="bankwrap">
<div class="bankhead">
<span class="l">текущий баланс
<span id="bankSource" class="src" data-label="из профиля"></span>
</span>
<span class="v"><span id="bankStart">…</span></span>
</div>
<div id="bankBox" style="display:none"></div>
<div class="bankshop">
<div class="banktitle">выбери операции</div>
<div id="bankPositions"></div>
<div class="bankcart">
<div class="banktitle" style="display:flex;justify-content:space-between;align-items:center">
<span>корзина (<span id="bankCount">0</span>)</span>
<span id="bankClear" style="cursor:pointer;color:var(--accent)">очистить</span>
</div>
<div id="bankCart"
data-empty="пусто"
data-earned="заработано"
data-spent="потрачено"
data-add="итого прибавить"
data-sub="итого отнять"
data-end="итог"
data-link="ссылка / комментарий"></div>
<div class="bankrow">
<button type="button" id="bankToForm" class="bankbtn"
data-label-start="было"
data-label-earned="заработано"
data-label-spent="потрачено"
data-label-add="итого прибавить"
data-label-sub="итого отнять"
data-label-end="стало">в форму ответа</button>
<button type="button" id="bankCopy" class="bankbtn2" data-done="скопировано">скопировать</button>
</div>
<textarea id="bankOut" readonly style="display:none"></textarea>
</div>
</div>
</div>[/html]
банк
Страница: 1
Сообщений 1 страница 1 из 1
Поделиться12026-07-05 23:32:50
Страница: 1