Mercurial > hgrepos > hgweb.cgi > skipweb
changeset 3905:77c97937f2c3
sawaguchi plus
author | Madoka Yamaguchi <c117208@e.koeki-u.ac.jp> |
---|---|
date | Fri, 02 Aug 2019 13:46:39 +0900 |
parents | 5c01ef37aa88 |
children | 278b6c4f07e9 |
files | shuzai/sawaguchi/mesi.css shuzai/sawaguchi/mesi.html shuzai/sawaguchi/mesi.js shuzai/sawaguchi/mesi1.jpeg shuzai/sawaguchi/mesi2.jpeg |
diffstat | 5 files changed, 283 insertions(+), 0 deletions(-) [+] |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/shuzai/sawaguchi/mesi.css Fri Aug 02 13:46:39 2019 +0900 @@ -0,0 +1,133 @@ +body, html{ + width: 100%; + height: 100%; +} + + +body{ + background: linear-gradient(#05FBFF, #d8fafc) fixed; +} + +h1{ + color: white; + border-left: solid 5px #46ff37; + background-color: #6aece9; + margin-bottom: 3px; + color: #fff9c9; +} + +.float{ + position: fixed; + float: left; + border-radius: 50%; + padding-right: 20px; + margin-right: 10px; + background-color: white; + +} + +.main{ + clear: clear; + margin-left: 170px; + padding: 15px 20px; + width: 100vx; + background-color: white; + border-radius: 30px; +} + +.main p { + margin-left: 20px; +} + + +div.header p{ + margin-left: 20%; +} + +div.photo { + display: inline-block; + padding: 25px; + height: 200px; +} + +div.photo span{ + background: linear-gradient(#ff771d, #ffba5b); + padding: 5px 10px; + border-radius: 5px; +} + + + +div.gaiyo { + /* background-color: pink; */ + height: 100%; + width: 100%; + border-bottom: dotted 2px blue; + padding-bottom: 5%; +} + +div.menu { + /* background-color: yellow; */ + height: 100%; + width: 100%; + border-bottom: dotted 2px blue; + padding-bottom: 5%; +} + +div.int { + height: 100%; + width: 100%; + border-bottom: dotted 2px blue; + padding-bottom: 5%; +} + +div.photospace { + /* background-color: green; */ + overflow:scroll; + height: 100%; + width: 100%; + border-bottom: dotted 2px blue; + padding-bottom: 5%; +} + + +table{ + width: 40%; + border-spacing: 0; +} +table th{ + border-bottom: solid 2px #fb5144; + + padding: 10px 0; +} +table td{ + border-bottom: solid 2px #ddd; + border-left: dotted 2px #ddd; + padding: 10px 0; +} + + +ul.view{ + list-style-type: none; +} + +ul.view li{ + font-size: 130%; +} + +ul.view li:before{ + content:"Q "; + color: blue; + font-size: 130%; +} + +ul.view p:before{ + content:"A "; + color: red; + font-size: 130%; +} + +div#map{ + color: red; + width: 65vw; height: 65vw; margin:0 auto; +}
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/shuzai/sawaguchi/mesi.html Fri Aug 02 13:46:39 2019 +0900 @@ -0,0 +1,132 @@ +<!DOCTYPE html> +<lang = "ja"> + <meta charset="utf-8"> + <head> + <title>2019repo</title> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <link rel="stylesheet" href="mesi.css"> + <link rel="stylesheet" href="js/leaflet_1.1.0/leaflet.css" /> + <script src="js/leaflet_1.1.0/leaflet.js"></script> + <style type="text/css"> + + </style> + </head> + + <body> + + <div class="float"> + <ul> + <li><a href="#main">概要</a></li> + + <li><a href="#int">インタビュー</a></li> + <li><a href="#photo">写真</a></li> + <li><a href="#map">地図</a></li> + + </ul> + </div> + + + <div class="header"> + <p><img src="rogo5.png" alt="ロゴ"></p> + </div> + + + + <div class="main"> + + <div class="gaiyo"> + <h1><a name="main">さわぐちの概要</a></h1> + <p>さわぐちってどんなお店??</p> + <p>さわぐちでは海鮮料理がメインのお店だよ!店主はとても優しくて、学生には色んなサービスもあるみたい!!店の定食の中で唯一お肉を使った定食があるけど、国産牛が使われています!!</p> + <table> + <tr> + <th>営業時間</th> + <td>11:30〜14:00<br>17:00〜21:30</td> + </tr> + <tr> + <th>住所</th> + <td>酒田市相生町2丁目2-3</td> + </tr> + <tr> + <th>平均料金</th> + <td>(通常)5,000円<br> + (ランチ)1,000円〜2,000円<br> + (宴会)3,000円</td> + </tr> + <tr> + <th>定休日</th> + <td>日曜日(予約により日曜営業)</td> + </tr> + <tr> + <th>電話番号</th> + <td>0234-26-6888</td> + </tr> + </table> + + <div class="int"> + <h1><a name="int">インタビュー</h1> + <ul class="view"> + <li>いま飛島にほしいものは何ですか</li> + <p>昔は離島ブームによって人が多かったが、現在は落ち着いてしまった。<br> + そのため何か集客できるものがほしい。</p> + + <li>天ぷらのこだわりはなんですか。</li> + <p>素材とボリュームをもたせることにこだわっている。 </p> + + <li>ヒレカツ定食のこだわりは何かありますか。</li> + <p>国産のでトンヒレを使っている。</p> + + <li>苦労したことはありますか。</li> + <p>社会情勢に苦労させられた。<br> + とくにバブルが崩壊したころは客足が途絶えてしまった</p> + + <li>定食の組み合わせに何かこだわりはありますか。</li> + <p>3ヶ月ごとにその時期とれるもので定食のセットを変えている。</p> + + <li>どの年齢層のお客さんが多いですか。</li> + <p>高齢者の方が多い。<br> + たまに先生が公益大生の人を連れてくることもある</p> + + <li>どういう人に来てほしいですか。</li> + <p>若い人に来てほしい。<br> + 若い人にはサービスしたくなる。</p> + + <li>外国人のお客さんへの対応はどのようにしていますか。</li> + <p>役所に海外の人向けのパンフレットがあるため、ある程度メニューを理解していたり、日本語を話せる外国人が多い。<br> + そのため英語を話す機会は少ない。<br> + 英語を話すことになった場合はジェスチャーを交えながら説明している。</p> + </ul> + </div> + + <div class="photospace"> + <h1><a name="photo">写真</a></h1> + <div class="photo"> + <img src="sasimi.jpeg" alt="mesi1" width="100%" height="200px"> + <p><span>刺身定食</span></p> + </div> + <div class="photo"> + <img src="sawaguti2.jpg" alt="" width="100%" height="200px"> + <p><span>さわぐち定食</span></p> + </div> + <div class="photo"> + <img src="tenpura.JPG" alt="" width="100%" height="200px"> + <p><span>天ぷら定食</span></p> + </div> +<div class="photo"> + <img src="hirekatu.JPG" alt="" width="100%" height="200px"> + <p><span>ヒレカツ定食</span></p> + </div> +<h4>このメニュー以外にも美味しいものがたくさんあります!!</h4> + </div> + <h1><a name="map">さわぐちの地図</h1> + <div id="map"> + <script type="text/javascript" src="mesi.js" charset="utf-8"></script> + </div> + </div> + + + + </body> + </html> + +
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/shuzai/sawaguchi/mesi.js Fri Aug 02 13:46:39 2019 +0900 @@ -0,0 +1,18 @@ +/* domon.js - 北緯38.891度, 東経139.824度, ズームレベル14 で地図表示 */ + +var map = L.map("map").setView([38.920910,139.842267], 16); +L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { + attribution: + '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' +}).addTo(map); + +var qIcon = L.icon({ + iconUrl: 'sakana2.png', + iconSize: [80,80], +}) + +var marker1 = [38.920910,139.842267]; +var m1opt = {title: "さわぐち"}; +var sawaguti = L.marker(marker1, {icon: qIcon}).addTo(map); + +sawaguti.bindPopup("ぜひ食べに来てね!!!!");