DOYOGA，健身輕時尚

簡介

DOYOGA瑜珈

健身輕時尚，做你的瑜珈 多給自己一點時間享受靜謐！

Demo： https://hungcurry.github.io/webLayout-2021-week08/

頁面：

• 首頁 index
• 課程介紹 course
• 瑜珈空間 surroundings
• 本月課表 schedule
• 立即預約 reservation
• 立即預約 reservation_info
• 立即預約 reservation_finish
• 聯絡我們 contact

專案說明

• 多頁式切版
• SCSS模組化和RWD
• 使用 Git 版本控制

使用技術/相關套件

• SCSS
• Swiper
• Bootstrap5
• gulp
• EJS樣板引擎

重點功能展示：

1. 選擇課程功能js判斷
2. Scroll page
3. 等比例圖框
4. Sticky Footer

(一).專案架構模組化

1. 分拆SCSS並模組化管理
2. 使用EJS製作共用頁面

(二).預約課程流程

1. 先選擇預約課程，手機/平板只會出現單一選擇課程
2. 展開 課程階級 並且將資料帶入到下方預約欄位
3. 無選擇 課程階級 ，則無法送出
4. 搭配collapse和Swiper

• 桌機
• 平板

(三).等比例圖框

等比例圖框撰寫

(四).圖片輪播

使用 Swiper 製作圖片輪播

(五).table表格與表單

表格與表單製作