wuhui_zzw
/
wyyl
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

首页优化

This commit is contained in:
pushuo 2022-06-22 22:21:15 +08:00
parent e8d63718c9
commit ca1ab01624
18 changed files with 238 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
public/build/beike/shop/default/css/app.css vendored
View File

@ -1,4 +1,37 @@
@charset "UTF-8";
@font-face {
font-family: "iconfont";
src: url("/vendor/iconfont/iconfont.woff") format("woff"), url("/vendor/iconfont/iconfont.ttf") format("truetype");
/* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
}
.iconfont {
font-family: "iconfont";
font-size: 1rem;
font-style: normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
.module-title {
font-size: 1.5rem;
text-align: center;
font-weight: bold;
position: relative;
padding-bottom: 10px;
margin-bottom: 2rem;
}
.module-title:after {
position: absolute;
bottom: 0;
transform: translateX(-50%);
left: 50%;
content: "";
width: 100px;
height: 1px;
background: #FD560F;
}
header .top-wrap {
height: 44px;
background: #F7F8FA;
@ -29,16 +62,36 @@ header .header-content .right-btn .nav-link i {
font-size: 1.1rem;
}
@font-face {
font-family: "iconfont";
src: url("/vendor/iconfont/iconfont.woff") format("woff"), url("/vendor/iconfont/iconfont.ttf") format("truetype");
/* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
.module-image-plus .module-image-plus-top {
display: flex;
}
.iconfont {
font-family: "iconfont";
font-size: 1rem;
font-style: normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
.module-image-plus .module-image-plus-top .right {
margin-left: 20px;
}
.module-image-plus .module-image-plus-bottom {
margin-top: 20px;
}
.product-wrap {
margin-bottom: 26px;
text-align: center;
}
.product-wrap .image {
margin-bottom: 10px;
}
.product-wrap .product-name {
margin-bottom: 6px;
}
.product-wrap .product-price .price-new {
color: #fd560f;
font-weight: bold;
}
.product-wrap .product-price .price-lod {
color: #aaa;
margin-left: 4px;
text-decoration: line-through;
}
.module-brand .brand-item {
margin-bottom: 20px;
}

4
public/build/beike/shop/default/css/bootstrap.css vendored
View File

@ -10018,3 +10018,7 @@ h3 {
border-color: #dee2e6;
}
}
.container-fluid, .container-sm, .container-md, .container-lg, .container-xl {
padding-right: 50px;
padding-left: 50px;
}

BIN
public/image/default/banner-2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 788 KiB

BIN
public/image/default/zhanweitu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.0 KiB

BIN
public/vendor/iconfont/iconfont.ttf vendored
View File

Binary file not shown.

BIN
public/vendor/iconfont/iconfont.woff vendored
View File

Binary file not shown.

BIN
public/vendor/iconfont/iconfont.woff2 vendored
View File

Binary file not shown.

9
resources/beike/shop/default/app.scss vendored
View File

@ -1,4 +1,11 @@
@charset "UTF-8";
$primary: #fd560f;
@import './iconfont';
@import './global';
@import './header';
@import './iconfont';
@import './module-image-plus';
@import './product-style';
@import './module-brand';

5
resources/beike/shop/default/bootstrap/bootstrap.scss vendored
View File

@ -12,3 +12,8 @@ $primary: #fd560f;
$font-size-base: 0.8rem;
@import 'node_modules/bootstrap/scss/bootstrap';
.container-fluid {
padding-right: 50px;
padding-left: 50px;
}

21
resources/beike/shop/default/global.scss vendored Normal file
View File

@ -0,0 +1,21 @@
@charset "UTF-8";
.module-title {
font-size: 1.5rem;
text-align: center;
font-weight: bold;
position: relative;
padding-bottom: 10px;
margin-bottom: 2rem;
&:after {
position: absolute;
bottom: 0;
transform:translateX(-50%);
left: 50%;
content: '';
width: 100px;
height: 1px;
background: #FD560F;
}
}

7
resources/beike/shop/default/module-brand.scss vendored Normal file
View File

@ -0,0 +1,7 @@
@charset "UTF-8";
.module-brand {
.brand-item {
margin-bottom: 20px;
}
}

10
resources/beike/shop/default/module-image-plus.scss vendored
View File

@ -1,5 +1,15 @@
@charset "UTF-8";
.module-image-plus {
.module-image-plus-top {
display: flex;
.right {
margin-left: 20px;
}
}
.module-image-plus-bottom {
margin-top: 20px;
}
}

9
resources/beike/shop/default/module-tab-product.scss vendored Normal file
View File

@ -0,0 +1,9 @@
@charset "UTF-8";
.module-tab-product {
.nav {
.nav-link {
color: #333;
}
}
}

27
resources/beike/shop/default/product-style.scss vendored Normal file
View File

@ -0,0 +1,27 @@
@charset "UTF-8";
.product-wrap {
margin-bottom: 26px;
text-align: center;
.image {
margin-bottom: 10px;
}
.product-name {
margin-bottom: 6px;
}
.product-price {
.price-new {
color: $primary;
font-weight: bold;
}
.price-lod {
color: #aaa;
margin-left: 4px;
text-decoration: line-through;
}
}
}

68
themes/default/home.blade.php
View File

@ -1,18 +1,66 @@
@extends('layout.master')
@section('content')
<div class="banner-wrap"><img src="{{ asset('image/default/banner.png') }}" class="img-fluid"></div>
<div class="module-image-plus">
<section class="module-wrap mb-5"><img src="{{ asset('image/default/banner.png') }}" class="img-fluid"></section>
{{-- @foreach ($categories as $category)
<a href="{{ shop_route('categories.show', $category) }}">{{ $category->description->name }}</a>
@endforeach --}}
<section class="module-image-plus mb-5">
<div class="container">
<div class="col-6"><img src="{{ asset('image/default/image_plus_1.png') }}" class="img-fluid"></div>
<div class="col-6">
<div class="module-image-plus-top">
<a href=""><img src="{{ asset('image/default/image_plus_2.png') }}" class="img-fluid"></a>
<a href=""><img src="{{ asset('image/default/image_plus_3.png') }}" class="img-fluid"></a>
<div class="row">
<div class="col-6"><img src="{{ asset('image/default/image_plus_1.png') }}" class="img-fluid"></div>
<div class="col-6">
<div class="module-image-plus-top">
<a href=""><img src="{{ asset('image/default/image_plus_2.png') }}" class="img-fluid"></a>
<a href="" class="right"><img src="{{ asset('image/default/image_plus_3.png') }}" class="img-fluid"></a>
</div>
<div class="module-image-plus-bottom"><a href=""><img src="{{ asset('image/default/image_plus_4.png') }}" class="img-fluid"></a></div>
</div>
<div class="module-image-plus-bottom"><a href=""><img src="{{ asset('image/default/image_plus_4.png') }}" class="img-fluid"></a></div>
</div>
</div>
</div>
</section>
<section class="module-tab-product mb-4">
<div class="module-title">推荐商品模块</div>
<div class="container">
<div class="nav justify-content-center mb-3">
<a class="nav-link active" href="#tab-product-1" data-bs-toggle="tab">Women</a>
<a class="nav-link" href="#tab-product-2" data-bs-toggle="tab">Men</a>
<a class="nav-link" href="#tab-product-3" data-bs-toggle="tab">Kids</a>
</div>
<div class="tab-content">
<div class="tab-pane fade show active" id="tab-product-1">
<div class="row">
@for ($i = 0; $i < 10; $i++)
<div class="col-6 col-md-4 col-lg-3">
@include('layout.product')
</div>
@endfor
</div>
</div>
<div class="tab-pane fade" id="tab-product-2">
22222
</div>
<div class="tab-pane fade" id="tab-product-3">
33333
</div>
</div>
</div>
</section>
<section class="module-image-banner mb-5">
<img src="{{ asset('image/default/banner-2.png') }}" class="img-fluid">
</section>
<section class="module-brand mb-5">
<div class="module-title">推荐品牌模块</div>
<div class="container">
<div class="row">
@for ($i = 0; $i < 8; $i++)
<div class="col-6 col-md-4 col-lg-3">
<div class="brand-item"><img src="{{ asset('image/default/image_plus_4.png') }}" class="img-fluid"></div>
</div>
@endfor
</div>
</div>
</section>
@endsection

8
themes/default/layout/footer.blade.php Normal file
View File

@ -0,0 +1,8 @@
<footer>
<div class="top">
</div>
<div class="content">
</div>
</footer>

21
themes/default/layout/header.blade.php
View File

@ -39,24 +39,21 @@
<div class="logo"><a href="http://"><img src="{{ asset('image/logo.png') }}" class="img-fluid"></a></div>
<div class="menu-wrap">
<ul class="navbar-nav mx-auto">
@foreach ($categories as $category)
<li class="dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Home</a>
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">{{ $category['name'] }}</a>
@if ($category['children'])
<ul class="dropdown-menu">
<li><a href="" class="dropdown-item">sssss</a></li>
<li><a href="" class="dropdown-item">sssss</a></li>
<li><a href="" class="dropdown-item">sssss</a></li>
<li><a href="" class="dropdown-item">sssss</a></li>
@forelse ($category['children'] as $children)
<li><a href="" class="dropdown-item">{{ $children['name'] }}</a></li>
@endforeach
</ul>
@endif
</li>
<li><a class="nav-link" href="#">夏季新品</a></li>
<li><a class="nav-link" href="#">今日上心</a></li>
<li><a class="nav-link" href="#">今日上心</a></li>
<li><a class="nav-link" href="#">今日上心</a></li>
@endforeach
</ul>
@foreach ($categories as $category)
<a href="{{ shop_route('categories.show', $category) }}">{{ $category->description->name }}</a>
@endforeach
{{-- <a href="{{ shop_route('categories.show', $category) }}">{{ $category->description->name }}</a> --}}
</div>
<div class="right-btn">
<ul class="navbar-nav flex-row">

8
themes/default/layout/product.blade.php Normal file
View File

@ -0,0 +1,8 @@
<div class="product-wrap">
<div class="image"><img src="{{ asset('image/default/zhanweitu.png') }}" class="img-fluid"></div>
<div class="product-name">这是一个产品名称名称名称</div>
<div class="product-price">
<span class="price-new">$55.00</span>
<span class="price-lod">$125.00</span>
</div>
</div>