aboutsummaryrefslogtreecommitdiffhomepage
path: root/src/components/ParksFilters.astro
diff options
context:
space:
mode:
authorYasutake Yohei <61961825+yasutakeyohei@users.noreply.github.com>2026-11-07 13:58:40 +0900
committerYasutake Yohei <61961825+yasutakeyohei@users.noreply.github.com>2026-11-07 13:58:40 +0900
commit5b256fa4b3e38e207eff25fdc726f47d961aff71 (patch)
tree995ab2791173aa05bbde930e3ea28758ae820153 /src/components/ParksFilters.astro
parent70a77e189a09d180fd42d5f0cdceb7e0cbd903ce (diff)
park-icons.ts: 公園アイコンを指定のものに差し替え、禁止マークを調整
- ブランコ・草地広場・野外卓を指定のアイコンに変更 - 水飲み・時計・トイレ・東屋をマップ/フキダシ/フィルターで統一 - 健康遊具のアイコンを追加 - ペット・ボール遊び禁止はアイコンに細い×を重ねる - ボール可・試合形式のみ禁止は「試×」バッジで表示
Diffstat (limited to 'src/components/ParksFilters.astro')
-rw-r--r--src/components/ParksFilters.astro30
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%;