26 lines
1.3 KiB
HTML
26 lines
1.3 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
|
|
<title>BD Item Distribution</title>
|
|
<link rel="stylesheet" href="../bd-static/shared.css">
|
|
<style>
|
|
.tabs { position: relative; display: flex; }
|
|
.tab { flex: 1; padding: 10px 0; color: rgba(0,0,0,.45); font-size: 1.3em; font-weight: 700; text-align: center; }
|
|
.tab.active { color: #4b8f67; }
|
|
.tab-line { position: absolute; bottom: 0; width: 15px; height: 3px; border-radius: 3px; background: #77bd8d; transition: left .25s ease; }
|
|
.goods { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; padding: 15px; }
|
|
.goods-card { display: flex; flex-direction: column; align-items: center; padding: 10px; border: 1px solid #d7eadf; border-radius: 10px; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
|
|
.goods-card img { width: 60%; aspect-ratio: 1/1; object-fit: contain; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<main class="page">
|
|
<div class="tabs" id="tabs"></div>
|
|
<div class="goods" id="goods"></div>
|
|
</main>
|
|
<script type="module" src="./item-distribution.js"></script>
|
|
</body>
|
|
</html>
|