ElmDemo/UI/pages/index.html
2023-06-21 17:23:21 +08:00

113 lines
4.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<link rel="icon" type="image/svg+xml" href="../assets/svgs/favicon.svg"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Tailwind + Sass</title>
<link rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.15.4/css/all.css"
integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous"/>
</head>
<body>
<div id="app" class="app">
<div class="topBarInHome">
<div>
<i class="fa fa-map-marker-alt"></i>
云南省昆明市呈贡区云南大学xxxx
<i class="fa fa-sort-down"></i>
</div>
<div class="mt-3 w-full">
<label>
<input type="text" class="w-full rounded border-0"/>
</label>
</div>
</div>
<div class="mainPad">
<div class="mainMenu ">
<div>
<img src="https://cube.elemecdn.com/7/d8/a867c870b22bc74c87c348b75528djpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed" alt="">
美食
</div>
<div>
<img src="https://cube.elemecdn.com/c/7e/76a23eb90dada42528bc41499d6f8jpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed" alt="">早餐
</div>
<div><img
src="https://cube.elemecdn.com/0/d0/dd7c960f08cdc756b1d3ad54978fdjpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed" alt="">
拍腿代购
</div>
<div><img
src="https://cube.elemecdn.com/7/0a/af108e256ebc9f02db599592ae655jpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed">
海报
</div>
<div>
<img src="https://cube.elemecdn.com/c/21/e42997b86b232161a5a16ab813ae8jpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed">
甜品
</div>
<div>
<img src="https://cube.elemecdn.com/b/7f/432619fb21a40b05cd25d11eca02djpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed">
速食
</div>
<div><img
src="https://cube.elemecdn.com/e/c7/b7ba9547aa700bd20d0420e1794a8jpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed">
地方小吃
</div>
<div>
<img src="https://cube.elemecdn.com/7/d6/6f2631288a44ec177204e05cbcb93jpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed">
米粉
</div>
<div>
<img src="https://cube.elemecdn.com/3/01/c888acb2c8ba9e0c813f36ec9e90ajpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed">
苞子
</div>
<div>
<img src="https://cube.elemecdn.com/a/8a/ec21096d528b7cfd23cdd894f01c6jpeg.jpeg?x-oss-process=image/format,webp/resize,w_90,h_90,m_fixed">
炸鸡
</div>
</div>
<div class="AdBar">
<div class="basis-3/5">
<div>配置套餐</div>
<div>搭配齐全吃得好</div>
<div class="text-yellow-600">立即抢购></div>
</div>
<div class="basis-2/5">
<img src="https://cube.elemecdn.com/e/ee/df43e7e53f6e1346c3fda0609f1d3png.png?x-oss-process=image/format,webp/resize,w_282,h_188,m_fixed">
</div>
</div>
<!-- <div class="businessPad">-->
<!-- <div class="bsTitleBar">-->
<!-- list title-->
<!-- </div>-->
<!-- <div class="bsList">lst</div>-->
<!-- </div>-->
</div>
<div class="bottomBar">
<div>
<i class="fas fa-home fa-lg"></i>
<br/>
首页
</div>
<div>
<i class="far fa-compass fa-lg"></i>
<br/>
发现
</div>
<div>
<i class="far fa-file-alt fa-lg"></i>
<br/>订单
</div>
<div>
<i class="far fa-user fa-lg"></i>
<br/>
我的
</div>
</div>
</div>
<script type="module" src="../src/main.ts"></script>
</body>
</html>