diff options
| author | Yasutake Yohei <61961825+yasutakeyohei@users.noreply.github.com> | 2026-11-07 13:58:40 +0900 |
|---|---|---|
| committer | Yasutake Yohei <61961825+yasutakeyohei@users.noreply.github.com> | 2026-11-07 13:58:40 +0900 |
| commit | 5b256fa4b3e38e207eff25fdc726f47d961aff71 (patch) | |
| tree | 995ab2791173aa05bbde930e3ea28758ae820153 /src/components/ParksFilters.astro | |
| parent | 70a77e189a09d180fd42d5f0cdceb7e0cbd903ce (diff) | |
park-icons.ts: 公園アイコンを指定のものに差し替え、禁止マークを調整
- ブランコ・草地広場・野外卓を指定のアイコンに変更
- 水飲み・時計・トイレ・東屋をマップ/フキダシ/フィルターで統一
- 健康遊具のアイコンを追加
- ペット・ボール遊び禁止はアイコンに細い×を重ねる
- ボール可・試合形式のみ禁止は「試×」バッジで表示
Diffstat (limited to 'src/components/ParksFilters.astro')
| -rw-r--r-- | src/components/ParksFilters.astro | 30 |
1 files changed, 25 insertions, 5 deletions
diff --git a/src/components/ParksFilters.astro b/src/components/ParksFilters.astro index 88b78eb..a41b00b 100644 --- a/src/components/ParksFilters.astro +++ b/src/components/ParksFilters.astro @@ -55,8 +55,8 @@ const facilityTypes = [ </label> <fieldset class="parks-facilities"> <legend>設備・遊具で絞る</legend> - <label><input type="checkbox" data-fac-filter value="toilet" />トイレ</label> - <label><input type="checkbox" data-fac-filter value="water" />水飲み</label> + <label><input type="checkbox" data-fac-filter value="toilet" /><span class="filter-wc" aria-hidden="true">WC</span>トイレ</label> + <label><input type="checkbox" data-fac-filter value="water" /><span class="filter-icon filter-icon-water" set:html={PARK_ICONS.water.svg} />水飲み</label> <label> <input type="checkbox" data-fac-filter value="picnic" /> <span class="filter-icon filter-icon-grass" set:html={PARK_ICONS.grass.svg} />草地広場 @@ -65,7 +65,7 @@ const facilityTypes = [ <input type="checkbox" data-fac-filter value="table" /> <span class="filter-icon" set:html={PARK_ICONS.picnic.svg} />野外卓/縁台 </label> - <label><input type="checkbox" data-fac-filter value="clock" />⏰時計</label> + <label><input type="checkbox" data-fac-filter value="clock" /><span class="filter-icon filter-icon-clock" set:html={PARK_ICONS.clock.svg} />時計</label> <label> <input type="checkbox" data-fac-filter value="sand" /> <span class="filter-icon" set:html={PARK_ICONS.sand.svg} />砂場 @@ -99,8 +99,8 @@ const facilityTypes = [ <span class="filter-icon" set:html={PARK_ICONS.playground.svg} />複合遊具 </label> <label><input type="checkbox" data-fac-filter value="basket" />🏀バスケゴール</label> - <label><input type="checkbox" data-fac-filter value="shelter" />⛱東屋/シェルター</label> - <label><input type="checkbox" data-fac-filter value="health" />💪健康遊具</label> + <label><input type="checkbox" data-fac-filter value="shelter" /><span class="filter-icon" set:html={PARK_ICONS.shelter.svg} />東屋/シェルター</label> + <label><input type="checkbox" data-fac-filter value="health" /><span class="filter-icon" set:html={PARK_ICONS.health.svg} />健康遊具</label> <label><input type="checkbox" data-fac-filter value="special" /><span class="filter-icon" set:html={PARK_ICONS.special.svg} />特殊遊具</label> </fieldset> <label class="parks-fire-toggle" title="消火栓・防火水槽を地図に表示する"> @@ -196,6 +196,26 @@ const facilityTypes = [ .filter-icon-grass { color: #2e7d32; } + .filter-icon-water { + color: #0277bd; + } + .filter-icon-clock { + color: #f9a825; + } + .filter-wc { + display: inline-flex; + align-items: center; + justify-content: center; + width: 18px; + height: 14px; + flex: none; + border-radius: 3px; + background: #455a64; + color: #fff; + font-size: 8px; + font-weight: 700; + line-height: 1; + } .filter-icon :global(svg) { display: block; width: 100%; |
