「飲食店検索」の版間の差分

2025年12月5日 (金) 13:51時点における版

エラー: テーブル飲食店情報が見つかりません。

@@ 27行目: / 27行目: @@
    <input type="submit" value="検索" />
 </form>
+<style>
+.search-card {
+  border: 1px solid #ddd;
+  border-radius: 8px;
+  padding: 10px;
+  margin-bottom: 12px;
+  max-width: 600px;
+  transition: box-shadow 0.2s;
+  max-height: 332px;
+}
+.search-card:hover {
+  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
+}
+.card-header {
+  margin-bottom: 5px;
+}
+.card-title {
+  margin: 0;
+}
+.card-genre {
+  margin: 0;
+  font-size: calc(1em - 3px);
+}
+.img-crop {
+  height: 200px;
+  overflow-x: auto;
+  overflow-y: hidden;
+  white-space: nowrap;
+}
+.img-crop p,
+.img-crop > div {
+  height: 100%;
+  margin: 0;
+  display: flex;
+  flex-direction: row;
+  width: max-content;
+}
+.crop-img img {
+  width: 200px;
+  height: 200px;
+  object-fit: cover;
+  border-radius: 4px;
+  display: inline-block;
+  margin-right: 2px;
+}
+.card-info {
+  margin-top: 10px;
+}
+.card-cost, .card-address {
+  margin: 0;
+  font-size: calc(1em - 3px);
+}
+</style>
 <script>
 document.getElementById('searchForm').addEventListener('submit', function(e) {