Tessst
Тест инвентаря
Страница: 1
Сообщений 1 страница 3 из 3
Поделиться12025-10-16 07:50:13
- Администратор
- Зарегистрирован: 2024-11-01
- Приглашений: 0
- Сообщений: 97
- Уважение: [+0/-0]
- Позитив: [+2/-0]
- Провел на форуме:
2 дня 2 часа - Последний визит:
2026-01-03 17:50:24 - Чашек кофе: 10
Поделиться22025-10-16 19:38:31
Инвентарь пользователя
[html]
<style>
.usr_inv {display: grid;gap: 10px;margin-top: 10px;grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));}
.inv_item {background: #f5f5f5;border: 1px solid #ddd;border-radius: 4px;padding: 10px;text-align: center;}
.item-image {width: 64px;height: 64px;object-fit: cover;border-radius: 4px;}
.item-description {display: none;}
#detailed-view:checked ~ .usr_inv {grid-template-columns: 1fr;}
#detailed-view:checked ~ .usr_inv .inv_item {display: flex;align-items: center;text-align: left;gap: 15px;padding: 15px;}
#detailed-view:checked ~ .usr_inv .item-image {width: 50px;height: 50px;flex-shrink: 0;}
#detailed-view:checked ~ .usr_inv .item-description {display: block;flex: 1;}
</style>
<div>
<input type="checkbox" id="detailed-view">
<label for="detailed-view" class="view-toggle">Подробный вид</label>
<div class="usr_inv">
<div class="inv_item">
<img src="https://sun1-20.userapi.com/s/v1/ig2/b1JVr5rd8PrNlEQAXdr_AbIEVYuE3Wp_gvvCM3oiMgk9kJaF67ikES5S-6t5trCKx3G7SbWrEEkWReQFb_Szz6z6.jpg?quality=95&crop=167,1,939,939&as=32x32,48x48,72x72,108x108,160x160,240x240,360x360,480x480,540x540,640x640,720x720&ava=1&cs=200x200&sec=DQ0+QTpQQEYEOi8bDTEeQxdbBAA4LDgfDC4zC2EYMB84NzpDW3h+Dj0MJBsgBwYcDTAgQiYYa181CCdZPh8hAzkaJklmayJHKgchXSEbOBE6B0RS" title="Пёсель" alt="Пёсель" class="item-image">
<div class="item-description">
<h3>Пёсель</h3>
<p>Little puppy</p>
<div>
<p><strong>Нашедший:</strong> proizvol (ID: 10)</p>
<p><strong>Страница:</strong> <a href="https://gremlinquisitor.mybb.ru/viewtopic.php?id=27" target="_blank">Тест инвентаря</a></p>
<p><strong>Время находки:</strong> 16.10.2025, 19:38:31</p>
</div>
</div>
</div>
</div>
</div>
[/html]
Последнее обновление: 16.10.2025, 19:38:32
Поделиться32025-10-19 22:07:25
- Администратор
- Зарегистрирован: 2024-11-01
- Приглашений: 0
- Сообщений: 97
- Уважение: [+0/-0]
- Позитив: [+2/-0]
- Провел на форуме:
2 дня 2 часа - Последний визит:
2026-01-03 17:50:24 - Чашек кофе: 10
Инвентарь пользователя
[html]
<style>
.usr_inv {display: grid;gap: 10px;margin-top: 10px;grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));}
.inv_item {background: ;border: 1px solid #ddd;border-radius: 4px;padding: 10px;text-align: center;}
.item-image {width: 64px;height: 64px;object-fit: cover;border-radius: 4px;}
.item-description {display: none;}
#detailed-view-mgy2ylioeu1pikqoyg5:checked ~ .usr_inv {grid-template-columns: 1fr;}
#detailed-view-mgy2ylioeu1pikqoyg5:checked ~ .usr_inv .inv_item {display: flex;align-items: center;text-align: left;gap: 15px;padding: 15px;}
#detailed-view-mgy2ylioeu1pikqoyg5:checked ~ .usr_inv .item-image {width: 50px;height: 50px;flex-shrink: 0;}
#detailed-view-mgy2ylioeu1pikqoyg5:checked ~ .usr_inv .item-description {display: block;flex: 1;}
</style>
<div>
<input type="checkbox" id="detailed-view-mgy2ylioeu1pikqoyg5">
<label for="detailed-view-mgy2ylioeu1pikqoyg5" class="view-toggle">Подробный вид</label>
<div class="usr_inv">
<div class="inv_item">
<img src="https://upforme.ru/uploads/001c/52/b6/2/605998.png?sec=DQ0+QTpQQEY1QS8BDj4WARcAOho9ASReNzorVGMbAgEQMxwYc0VADj8mJB8gACAcJhogDCAhGhU0IVZXPzEhRTgzMkNiRQgFKxcDECMiP1A=" title="Тыква" alt="Тыква" class="item-image">
<div class="item-description">
<h3>Тыква</h3>
<p>Рыжая, сочная, задорно сверающая глазами и караулящая за углом.</p>
<div>
<p><strong>Нашедший:</strong> Gremlin (ID: 2)</p>
<p><strong>Страница:</strong> <a href="https://gremlinquisitor.mybb.ru/viewtopic.php?id=28#p148" target="_blank">Многобукаф</a></p>
<p><strong>Время находки:</strong> 19.10.2025, 22:07:21</p>
</div>
</div>
</div>
<div class="inv_item">
<img src="https://upforme.ru/uploads/001c/52/b6/2/319417.png?sec=DQ0+QTpQQEY1QS8BDj4WARcAOho9ASReNzorVGMbAgEQMxwYc0VADj8mJB8gACAcJhogDCAhGhU0IVZXPzEhRTgzMkNiRQgFKjkDHiAYP1A=" title="Колпак" alt="Колпак" class="item-image">
<div class="item-description">
<h3>Колпак</h3>
<p>Не Распределяющая шляпа, но и у нас не Хогвартс.</p>
<div>
<p><strong>Нашедший:</strong> Gremlin (ID: 2)</p>
<p><strong>Страница:</strong> <a href="https://gremlinquisitor.mybb.ru/viewtopic.php?id=28#p148" target="_blank">Многобукаф</a></p>
<p><strong>Время находки:</strong> 19.10.2025, 22:09:06</p>
</div>
</div>
</div>
</div>
</div>
[/html]
Последнее обновление: 19.10.2025, 22:09:10
Страница: 1