Our Concept
当店のコンセプト
いつでも新鮮なサラダを、お好きなだけ。
グレイッシュ・サラダ・バーでは、近隣の農家と契約し、毎日採れたての野菜を仕入れています。
美味しいスープや魅力的なデザートもございます。地元の食材と手作りの料理を通じて、お客様に豊かな食体験をお届けします。
Opening hours
営業時間
Mornig
07:00 – 09:00
（LO 08:20）
Lunch
11:00 – 15:00
（LO 14:20）
Dinner
17:00 – 23:00
（LO 22:20）
以降はCSSの新しいスクロールアニメーション（Scroll-driven Animations ）のデモです。
Javascriptのライブラリを使用しないとなかなか難しかった、
スクロールに連動したパララックスなどのリッチな表現が、CSSで実現できるようになります。
※カスタマイズ方法の紹介は未定です。各参考記事をご覧ください。
※現在サポートされているブラウザはGoogleChromeとEdgeのみです。
当サイトでは、polyfillを使用している為、FireFox, Safari（iOS含む）でも同様に動作を確認いただけます。
早く全ブラウザでサポートされるといいですね！
以下は、新着記事の横スクロール表現です。（参考記事を見ながら作ってみました！）
スライダーの動きとはまた異なり、途中から勝手に横スクロールになるのでインパクトあり。
ただ、スクロールジャックといって、全部スクロールしないと次に進めない部分になりますので、導入には注意が必要です。
ユーザーの意思を奪うアニメーションとなりますので、多用すると離脱の原因になるかも・・・。
あと、レスポンシブ対応で苦労するかも（汗）
以下のNewsカバーブロックにも背景画像のパララックス効果を採用しています。
ちょっと分かりにくいかも？ゆっくりスクロールしてみてくださいね。
アニメーションが苦手な方もいらっしゃるので、やり過ぎないように気をつけましょう〜！
