导航菜单 -> 手机端响应式
This commit is contained in:
pushuo
Edward Yang
parent
3ddaec6960
commit
ff87b819fc
|
|
@ -582,3 +582,9 @@ function installed()
|
||||||
{
|
{
|
||||||
return file_exists(storage_path('installed'));
|
return file_exists(storage_path('installed'));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function isMobile()
|
||||||
|
{
|
||||||
|
return (new \Jenssegers\Agent\Agent())->isMobile();
|
||||||
|
}
|
||||||
|
|
@ -15,6 +15,7 @@
|
||||||
"intervention/image": "^2.7",
|
"intervention/image": "^2.7",
|
||||||
"laravel/framework": "^9.0",
|
"laravel/framework": "^9.0",
|
||||||
"laravel/tinker": "^2.7",
|
"laravel/tinker": "^2.7",
|
||||||
|
"jenssegers/agent": "^2.6",
|
||||||
"spatie/laravel-permission": "^5.5",
|
"spatie/laravel-permission": "^5.5",
|
||||||
"srmklive/paypal": "^3.0",
|
"srmklive/paypal": "^3.0",
|
||||||
"stripe/stripe-php": "^8.8",
|
"stripe/stripe-php": "^8.8",
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@
|
||||||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||||
"This file is @generated automatically"
|
"This file is @generated automatically"
|
||||||
],
|
],
|
||||||
"content-hash": "d291ec39fe19eebe5c5e98e9014cda39",
|
"content-hash": "638306dddcdd0d2164cdbc1d4272416a",
|
||||||
"packages": [
|
"packages": [
|
||||||
{
|
{
|
||||||
"name": "asm89/stack-cors",
|
"name": "asm89/stack-cors",
|
||||||
|
|
@ -1561,6 +1561,153 @@
|
||||||
],
|
],
|
||||||
"time": "2022-05-21T17:30:32+00:00"
|
"time": "2022-05-21T17:30:32+00:00"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"name": "jaybizzle/crawler-detect",
|
||||||
|
"version": "v1.2.111",
|
||||||
|
"source": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://github.com/JayBizzle/Crawler-Detect.git",
|
||||||
|
"reference": "d572ed4a65a70a2d2871dc5137c9c5b7e69745ab"
|
||||||
|
},
|
||||||
|
"dist": {
|
||||||
|
"type": "zip",
|
||||||
|
"url": "https://api.github.com/repos/JayBizzle/Crawler-Detect/zipball/d572ed4a65a70a2d2871dc5137c9c5b7e69745ab",
|
||||||
|
"reference": "d572ed4a65a70a2d2871dc5137c9c5b7e69745ab",
|
||||||
|
"shasum": "",
|
||||||
|
"mirrors": [
|
||||||
|
{
|
||||||
|
"url": "https://mirrors.aliyun.com/composer/dists/%package%/%reference%.%type%",
|
||||||
|
"preferred": true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"require": {
|
||||||
|
"php": ">=5.3.0"
|
||||||
|
},
|
||||||
|
"require-dev": {
|
||||||
|
"phpunit/phpunit": "^4.8|^5.5|^6.5|^9.4"
|
||||||
|
},
|
||||||
|
"type": "library",
|
||||||
|
"autoload": {
|
||||||
|
"psr-4": {
|
||||||
|
"Jaybizzle\\CrawlerDetect\\": "src/"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"notification-url": "https://packagist.org/downloads/",
|
||||||
|
"license": [
|
||||||
|
"MIT"
|
||||||
|
],
|
||||||
|
"authors": [
|
||||||
|
{
|
||||||
|
"name": "Mark Beech",
|
||||||
|
"email": "m@rkbee.ch",
|
||||||
|
"role": "Developer"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"description": "CrawlerDetect is a PHP class for detecting bots/crawlers/spiders via the user agent",
|
||||||
|
"homepage": "https://github.com/JayBizzle/Crawler-Detect/",
|
||||||
|
"keywords": [
|
||||||
|
"crawler",
|
||||||
|
"crawler detect",
|
||||||
|
"crawler detector",
|
||||||
|
"crawlerdetect",
|
||||||
|
"php crawler detect"
|
||||||
|
],
|
||||||
|
"support": {
|
||||||
|
"issues": "https://github.com/JayBizzle/Crawler-Detect/issues",
|
||||||
|
"source": "https://github.com/JayBizzle/Crawler-Detect/tree/v1.2.111"
|
||||||
|
},
|
||||||
|
"time": "2022-03-15T22:19:01+00:00"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "jenssegers/agent",
|
||||||
|
"version": "v2.6.4",
|
||||||
|
"source": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://github.com/jenssegers/agent.git",
|
||||||
|
"reference": "daa11c43729510b3700bc34d414664966b03bffe"
|
||||||
|
},
|
||||||
|
"dist": {
|
||||||
|
"type": "zip",
|
||||||
|
"url": "https://api.github.com/repos/jenssegers/agent/zipball/daa11c43729510b3700bc34d414664966b03bffe",
|
||||||
|
"reference": "daa11c43729510b3700bc34d414664966b03bffe",
|
||||||
|
"shasum": "",
|
||||||
|
"mirrors": [
|
||||||
|
{
|
||||||
|
"url": "https://mirrors.aliyun.com/composer/dists/%package%/%reference%.%type%",
|
||||||
|
"preferred": true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"require": {
|
||||||
|
"jaybizzle/crawler-detect": "^1.2",
|
||||||
|
"mobiledetect/mobiledetectlib": "^2.7.6",
|
||||||
|
"php": ">=5.6"
|
||||||
|
},
|
||||||
|
"require-dev": {
|
||||||
|
"php-coveralls/php-coveralls": "^2.1",
|
||||||
|
"phpunit/phpunit": "^5.0|^6.0|^7.0"
|
||||||
|
},
|
||||||
|
"suggest": {
|
||||||
|
"illuminate/support": "Required for laravel service providers"
|
||||||
|
},
|
||||||
|
"type": "library",
|
||||||
|
"extra": {
|
||||||
|
"branch-alias": {
|
||||||
|
"dev-master": "3.0-dev"
|
||||||
|
},
|
||||||
|
"laravel": {
|
||||||
|
"providers": [
|
||||||
|
"Jenssegers\\Agent\\AgentServiceProvider"
|
||||||
|
],
|
||||||
|
"aliases": {
|
||||||
|
"Agent": "Jenssegers\\Agent\\Facades\\Agent"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"autoload": {
|
||||||
|
"psr-4": {
|
||||||
|
"Jenssegers\\Agent\\": "src/"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"notification-url": "https://packagist.org/downloads/",
|
||||||
|
"license": [
|
||||||
|
"MIT"
|
||||||
|
],
|
||||||
|
"authors": [
|
||||||
|
{
|
||||||
|
"name": "Jens Segers",
|
||||||
|
"homepage": "https://jenssegers.com"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"description": "Desktop/mobile user agent parser with support for Laravel, based on Mobiledetect",
|
||||||
|
"homepage": "https://github.com/jenssegers/agent",
|
||||||
|
"keywords": [
|
||||||
|
"Agent",
|
||||||
|
"browser",
|
||||||
|
"desktop",
|
||||||
|
"laravel",
|
||||||
|
"mobile",
|
||||||
|
"platform",
|
||||||
|
"user agent",
|
||||||
|
"useragent"
|
||||||
|
],
|
||||||
|
"support": {
|
||||||
|
"issues": "https://github.com/jenssegers/agent/issues",
|
||||||
|
"source": "https://github.com/jenssegers/agent/tree/v2.6.4"
|
||||||
|
},
|
||||||
|
"funding": [
|
||||||
|
{
|
||||||
|
"url": "https://github.com/jenssegers",
|
||||||
|
"type": "github"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"url": "https://tidelift.com/funding/github/packagist/jenssegers/agent",
|
||||||
|
"type": "tidelift"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"time": "2020-06-13T08:05:20+00:00"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"name": "laravel/framework",
|
"name": "laravel/framework",
|
||||||
"version": "v9.22.1",
|
"version": "v9.22.1",
|
||||||
|
|
@ -2244,6 +2391,68 @@
|
||||||
],
|
],
|
||||||
"time": "2022-04-17T13:12:02+00:00"
|
"time": "2022-04-17T13:12:02+00:00"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"name": "mobiledetect/mobiledetectlib",
|
||||||
|
"version": "2.8.39",
|
||||||
|
"source": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://github.com/serbanghita/Mobile-Detect.git",
|
||||||
|
"reference": "0fd6753003fc870f6e229bae869cc1337c99bc45"
|
||||||
|
},
|
||||||
|
"dist": {
|
||||||
|
"type": "zip",
|
||||||
|
"url": "https://api.github.com/repos/serbanghita/Mobile-Detect/zipball/0fd6753003fc870f6e229bae869cc1337c99bc45",
|
||||||
|
"reference": "0fd6753003fc870f6e229bae869cc1337c99bc45",
|
||||||
|
"shasum": "",
|
||||||
|
"mirrors": [
|
||||||
|
{
|
||||||
|
"url": "https://mirrors.aliyun.com/composer/dists/%package%/%reference%.%type%",
|
||||||
|
"preferred": true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"require": {
|
||||||
|
"php": ">=5.0.0"
|
||||||
|
},
|
||||||
|
"require-dev": {
|
||||||
|
"phpunit/phpunit": "~4.8.35||~5.7"
|
||||||
|
},
|
||||||
|
"type": "library",
|
||||||
|
"autoload": {
|
||||||
|
"psr-0": {
|
||||||
|
"Detection": "namespaced/"
|
||||||
|
},
|
||||||
|
"classmap": [
|
||||||
|
"Mobile_Detect.php"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"notification-url": "https://packagist.org/downloads/",
|
||||||
|
"license": [
|
||||||
|
"MIT"
|
||||||
|
],
|
||||||
|
"authors": [
|
||||||
|
{
|
||||||
|
"name": "Serban Ghita",
|
||||||
|
"email": "serbanghita@gmail.com",
|
||||||
|
"homepage": "http://mobiledetect.net",
|
||||||
|
"role": "Developer"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"description": "Mobile_Detect is a lightweight PHP class for detecting mobile devices. It uses the User-Agent string combined with specific HTTP headers to detect the mobile environment.",
|
||||||
|
"homepage": "https://github.com/serbanghita/Mobile-Detect",
|
||||||
|
"keywords": [
|
||||||
|
"detect mobile devices",
|
||||||
|
"mobile",
|
||||||
|
"mobile detect",
|
||||||
|
"mobile detector",
|
||||||
|
"php mobile detect"
|
||||||
|
],
|
||||||
|
"support": {
|
||||||
|
"issues": "https://github.com/serbanghita/Mobile-Detect/issues",
|
||||||
|
"source": "https://github.com/serbanghita/Mobile-Detect/tree/2.8.39"
|
||||||
|
},
|
||||||
|
"time": "2022-02-17T19:24:25+00:00"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"name": "monolog/monolog",
|
"name": "monolog/monolog",
|
||||||
"version": "2.8.0",
|
"version": "2.8.0",
|
||||||
|
|
@ -9686,9 +9895,10 @@
|
||||||
"prefer-lowest": false,
|
"prefer-lowest": false,
|
||||||
"platform": {
|
"platform": {
|
||||||
"php": "^8.0.2",
|
"php": "^8.0.2",
|
||||||
|
"ext-iconv": "*",
|
||||||
"ext-json": "*",
|
"ext-json": "*",
|
||||||
"ext-zip": "*"
|
"ext-zip": "*"
|
||||||
},
|
},
|
||||||
"platform-dev": [],
|
"platform-dev": [],
|
||||||
"plugin-api-version": "2.3.0"
|
"plugin-api-version": "2.1.0"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -621,6 +621,9 @@ header .header-mobile .mobile-content {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
header .header-mobile .mobile-content .mobile-open-menu {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
header .header-mobile .mobile-content > div {
|
header .header-mobile .mobile-content > div {
|
||||||
width: 33.33%;
|
width: 33.33%;
|
||||||
}
|
}
|
||||||
|
|
@ -673,6 +676,77 @@ header .header-mobile .mobile-content .right .nav-link i {
|
||||||
color: #999;
|
color: #999;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#offcanvas-mobile-menu {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .offcanvas-header {
|
||||||
|
padding: 10px 20px 10px 10px;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion {
|
||||||
|
border-top: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item {
|
||||||
|
border-bottom: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text > a {
|
||||||
|
flex: 1;
|
||||||
|
height: 44px;
|
||||||
|
padding-left: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text > a .badge {
|
||||||
|
position: relative;
|
||||||
|
margin-left: 13px;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text > a .badge::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
right: 100%;
|
||||||
|
transform: translate(0, -50%);
|
||||||
|
border: 4px solid;
|
||||||
|
border-right-width: 7px;
|
||||||
|
border: 5px solid rgba(0, 0, 0, 0);
|
||||||
|
border-right-color: inherit;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text > span {
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
display: flex;
|
||||||
|
border-left: 1px solid #e5e5e5;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text > span:active {
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text > span[aria-expanded=true] {
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .nav-item-text > span[aria-expanded=true] i {
|
||||||
|
transform: rotate(180deg);
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .accordion-collapse {
|
||||||
|
padding: 10px;
|
||||||
|
border-top: 1px solid #e5e5e5;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .accordion-collapse .children-group .group-name {
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
#offcanvas-mobile-menu .mobile-menu-wrap #menu-accordion .accordion-item .accordion-collapse .children-group .nav a {
|
||||||
|
color: #777;
|
||||||
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
background: #fafafa;
|
background: #fafafa;
|
||||||
margin-top: 5rem;
|
margin-top: 5rem;
|
||||||
|
|
@ -934,6 +1008,11 @@ body.page-product .variables-wrap .variable-info > div:not(.selected).disabled {
|
||||||
color: #999;
|
color: #999;
|
||||||
font-weight: initial;
|
font-weight: initial;
|
||||||
}
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
body.page-product .peoduct-info h1 {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
body.page-product .peoduct-info .rating-wrap {
|
body.page-product .peoduct-info .rating-wrap {
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
@ -946,6 +1025,11 @@ body.page-product .peoduct-info .rating-wrap .rating i {
|
||||||
body.page-product .peoduct-info .price-wrap {
|
body.page-product .peoduct-info .price-wrap {
|
||||||
margin-bottom: 2.4rem;
|
margin-bottom: 2.4rem;
|
||||||
}
|
}
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
body.page-product .peoduct-info .quantity-btns {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
body.page-product .peoduct-info .quantity-btns .quantity-input {
|
body.page-product .peoduct-info .quantity-btns .quantity-input {
|
||||||
max-width: 5rem;
|
max-width: 5rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
@ -953,6 +1037,11 @@ body.page-product .peoduct-info .quantity-btns .quantity-input {
|
||||||
body.page-product .peoduct-info .quantity-btns .quantity-wrap {
|
body.page-product .peoduct-info .quantity-btns .quantity-wrap {
|
||||||
height: 43px;
|
height: 43px;
|
||||||
}
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
body.page-product .peoduct-info .quantity-btns .quantity-wrap {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
body.page-product .product-description .nav-tabs .nav-link {
|
body.page-product .product-description .nav-tabs .nav-link {
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2259,17 +2259,24 @@ __webpack_require__.r(__webpack_exports__);
|
||||||
|
|
||||||
// offcanvas-search-top
|
// offcanvas-search-top
|
||||||
$(function () {
|
$(function () {
|
||||||
var myOffcanvas = document.getElementById('offcanvas-search-top');
|
var myOffcanvas = document.getElementById("offcanvas-search-top");
|
||||||
if (!myOffcanvas) return;
|
|
||||||
myOffcanvas.addEventListener('shown.bs.offcanvas', function () {
|
if (myOffcanvas) {
|
||||||
$('#offcanvas-search-top input').focus();
|
myOffcanvas.addEventListener("shown.bs.offcanvas", function () {
|
||||||
$('#offcanvas-search-top input').keydown(function (e) {
|
$("#offcanvas-search-top input").focus();
|
||||||
if (e.keyCode == 13) {
|
$("#offcanvas-search-top input").keydown(function (e) {
|
||||||
if ($(this).val() != '') {
|
if (e.keyCode == 13) {
|
||||||
location.href = 'products/search?keyword=' + $(this).val();
|
if ($(this).val() != "") {
|
||||||
|
location.href = "products/search?keyword=" + $(this).val();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
});
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).on("click", ".mobile-open-menu", function () {
|
||||||
|
var offcanvasMobileMenu = new bootstrap.Offcanvas('#offcanvas-mobile-menu');
|
||||||
|
offcanvasMobileMenu.show();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -177,6 +177,11 @@ header {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.mobile-open-menu {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
> div {
|
> div {
|
||||||
width: 33.33%;
|
width: 33.33%;
|
||||||
}
|
}
|
||||||
|
|
@ -252,4 +257,93 @@ header {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#offcanvas-mobile-menu {
|
||||||
|
width: 80%;
|
||||||
|
|
||||||
|
.offcanvas-header {
|
||||||
|
padding: 10px 20px 10px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-menu-wrap {
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
#menu-accordion {
|
||||||
|
border-top: 1px solid #e5e5e5;
|
||||||
|
|
||||||
|
.accordion-item {
|
||||||
|
border-bottom: 1px solid #e5e5e5;
|
||||||
|
|
||||||
|
.nav-item-text {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
> a {
|
||||||
|
flex: 1;
|
||||||
|
height: 44px;
|
||||||
|
padding-left: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.badge {
|
||||||
|
position: relative;
|
||||||
|
margin-left: 13px;
|
||||||
|
// padding: 2px 4px;
|
||||||
|
font-weight: 400;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
right: 100%;
|
||||||
|
transform: translate(0, -50%);
|
||||||
|
border: 4px solid;
|
||||||
|
border-right-width: 7px;
|
||||||
|
border: 5px solid #0000;
|
||||||
|
border-right-color: inherit;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> span {
|
||||||
|
width: 44px;
|
||||||
|
height: 44px;
|
||||||
|
display: flex;
|
||||||
|
border-left: 1px solid #e5e5e5;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
&:active {
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
&[aria-expanded="true"] {
|
||||||
|
background-color: #eee;
|
||||||
|
i {
|
||||||
|
transform:rotate(180deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.accordion-collapse {
|
||||||
|
padding: 10px;
|
||||||
|
border-top: 1px solid #e5e5e5;
|
||||||
|
|
||||||
|
.children-group {
|
||||||
|
.group-name {
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav {
|
||||||
|
a {
|
||||||
|
color: #777;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -135,6 +135,11 @@ body.page-product {
|
||||||
}
|
}
|
||||||
|
|
||||||
.peoduct-info {
|
.peoduct-info {
|
||||||
|
h1 {
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
.rating-wrap {
|
.rating-wrap {
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
|
|
@ -151,6 +156,10 @@ body.page-product {
|
||||||
}
|
}
|
||||||
|
|
||||||
.quantity-btns {
|
.quantity-btns {
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
.quantity-input {
|
.quantity-input {
|
||||||
max-width: 5rem;
|
max-width: 5rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
@ -158,6 +167,9 @@ body.page-product {
|
||||||
|
|
||||||
.quantity-wrap {
|
.quantity-wrap {
|
||||||
height: 43px;
|
height: 43px;
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,16 +1,21 @@
|
||||||
// offcanvas-search-top
|
// offcanvas-search-top
|
||||||
$(function() {
|
$(function () {
|
||||||
var myOffcanvas = document.getElementById('offcanvas-search-top')
|
var myOffcanvas = document.getElementById("offcanvas-search-top");
|
||||||
if (!myOffcanvas) return;
|
if (myOffcanvas) {
|
||||||
|
myOffcanvas.addEventListener("shown.bs.offcanvas", function () {
|
||||||
myOffcanvas.addEventListener('shown.bs.offcanvas', function () {
|
$("#offcanvas-search-top input").focus();
|
||||||
$('#offcanvas-search-top input').focus();
|
$("#offcanvas-search-top input").keydown(function (e) {
|
||||||
$('#offcanvas-search-top input').keydown(function (e) {
|
if (e.keyCode == 13) {
|
||||||
if (e.keyCode == 13) {
|
if ($(this).val() != "") {
|
||||||
if ($(this).val() != '') {
|
location.href = "products/search?keyword=" + $(this).val();
|
||||||
location.href = 'products/search?keyword=' + $(this).val();
|
}
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
})
|
});
|
||||||
})
|
}
|
||||||
});
|
|
||||||
|
$(document).on("click", ".mobile-open-menu", function () {
|
||||||
|
const offcanvasMobileMenu = new bootstrap.Offcanvas('#offcanvas-mobile-menu')
|
||||||
|
offcanvasMobileMenu.show()
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
|
||||||
|
|
@ -64,6 +64,7 @@ return [
|
||||||
'language' => 'Language',
|
'language' => 'Language',
|
||||||
'select_all' => 'Select All',
|
'select_all' => 'Select All',
|
||||||
'sign_out' => 'Sign Out',
|
'sign_out' => 'Sign Out',
|
||||||
|
'menu' => 'Menu',
|
||||||
|
|
||||||
'id' => 'ID',
|
'id' => 'ID',
|
||||||
'created_at' => 'Created At',
|
'created_at' => 'Created At',
|
||||||
|
|
|
||||||
|
|
@ -63,6 +63,7 @@ return [
|
||||||
'language' => '语言',
|
'language' => '语言',
|
||||||
'select_all' => '全选',
|
'select_all' => '全选',
|
||||||
'sign_out' => '退出登录',
|
'sign_out' => '退出登录',
|
||||||
|
'menu' => '菜单',
|
||||||
|
|
||||||
'id' => 'ID',
|
'id' => 'ID',
|
||||||
'created_at' => '创建时间',
|
'created_at' => '创建时间',
|
||||||
|
|
|
||||||
|
|
@ -62,63 +62,9 @@
|
||||||
<img src="{{ image_origin(system_setting('base.logo')) }}" class="img-fluid"></a>
|
<img src="{{ image_origin(system_setting('base.logo')) }}" class="img-fluid"></a>
|
||||||
</div>
|
</div>
|
||||||
<div class="menu-wrap">
|
<div class="menu-wrap">
|
||||||
<ul class="navbar-nav mx-auto">
|
@if (!isMobile())
|
||||||
@foreach ($menu_content as $menu)
|
@include('shared.menu-pc')
|
||||||
<li
|
@endif
|
||||||
class="nav-item {{ isset($menu['children_group']) ? 'dropdown' : '' }} {{ isset($menu['isFull']) && $menu['isFull'] ? 'position-static' : '' }}">
|
|
||||||
<a class="nav-link fw-bold {{ isset($menu['children_group']) ? 'dropdown-toggle' : '' }}"
|
|
||||||
target="{{ isset($menu['new_window']) && $menu['new_window'] ? '_blank' : '_self' }}"
|
|
||||||
href="{{ $menu['link'] ?? '' }}">
|
|
||||||
{{ $menu['name'] }}
|
|
||||||
@if (isset($menu['badge']) && $menu['badge']['name'])
|
|
||||||
<span class="badge"
|
|
||||||
style="background-color: {{ $menu['badge']['bg_color'] }}; color: {{ $menu['badge']['text_color'] }}; border-color: {{ $menu['badge']['bg_color'] }}">
|
|
||||||
{{ $menu['badge']['name'] }}
|
|
||||||
</span>
|
|
||||||
@endif
|
|
||||||
</a>
|
|
||||||
@if (isset($menu['children_group']) && $menu['children_group'])
|
|
||||||
<div class="dropdown-menu {{ $menu['isFull'] ? 'w-100' : '' }}"
|
|
||||||
style="min-width: {{ count($menu['children_group']) * 200 }}px">
|
|
||||||
<div class="card card-lg">
|
|
||||||
<div class="card-body">
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
@forelse ($menu['children_group'] as $group)
|
|
||||||
<div class="col-6 col-md">
|
|
||||||
@if ($group['name'])
|
|
||||||
<div class="mb-3 fw-bold group-name">{{ $group['name'] }}</div>
|
|
||||||
@endif
|
|
||||||
@if ($group['type'] == 'image')
|
|
||||||
<a
|
|
||||||
target="{{ isset($group['image']['link']['new_window']) && $group['image']['link']['new_window'] ? '_blank' : '_self' }}"
|
|
||||||
href="{{ $group['image']['link'] }}"><img src="{{ $group['image']['image'] }}"
|
|
||||||
class="img-fluid"></a>
|
|
||||||
@else
|
|
||||||
<ul class="nav flex-column ul-children">
|
|
||||||
@foreach ($group['children'] as $children)
|
|
||||||
@if (!is_array($children['link']['text']))
|
|
||||||
<li class="nav-item">
|
|
||||||
<a
|
|
||||||
target="{{ isset($children['link']['new_window']) && $children['link']['new_window'] ? '_blank' : '_self' }}"
|
|
||||||
class="nav-link px-0"
|
|
||||||
href="{{ $children['link']['link'] }}">{{ $children['link']['text'] }}</a>
|
|
||||||
</li>
|
|
||||||
@endif
|
|
||||||
@endforeach
|
|
||||||
</ul>
|
|
||||||
@endif
|
|
||||||
</div>
|
|
||||||
@endforeach
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@endif
|
|
||||||
</li>
|
|
||||||
@endforeach
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="right-btn">
|
<div class="right-btn">
|
||||||
<ul class="navbar-nav flex-row">
|
<ul class="navbar-nav flex-row">
|
||||||
|
|
@ -168,7 +114,7 @@
|
||||||
|
|
||||||
<div class="header-mobile d-lg-none">
|
<div class="header-mobile d-lg-none">
|
||||||
<div class="mobile-content">
|
<div class="mobile-content">
|
||||||
<div class="left"><i class="bi bi-list"></i></div>
|
<div class="left mobile-open-menu"><i class="bi bi-list"></i></div>
|
||||||
<div class="center"><a href="{{ shop_route('home.index') }}">
|
<div class="center"><a href="{{ shop_route('home.index') }}">
|
||||||
<img src="{{ image_origin(system_setting('base.logo')) }}" class="img-fluid"></a>
|
<img src="{{ image_origin(system_setting('base.logo')) }}" class="img-fluid"></a>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -178,6 +124,19 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="offcanvas offcanvas-start" tabindex="-1" id="offcanvas-mobile-menu">
|
||||||
|
<div class="offcanvas-header">
|
||||||
|
<h5 class="offcanvas-title" id="offcanvasWithBothOptionsLabel">{{ __('common.menu') }}</h5>
|
||||||
|
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
<div class="offcanvas-body mobile-menu-wrap">
|
||||||
|
@if (isMobile())
|
||||||
|
@include('shared.menu-mobile')
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvas-right-cart"
|
<div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvas-right-cart"
|
||||||
aria-labelledby="offcanvasRightLabel"></div>
|
aria-labelledby="offcanvasRightLabel"></div>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -86,7 +86,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@if ($product['active'])
|
@if ($product['active'])
|
||||||
<div class="quantity-btns d-flex">
|
<div class="quantity-btns">
|
||||||
<div class="quantity-wrap">
|
<div class="quantity-wrap">
|
||||||
<input type="text" class="form-control" :disabled="!product.quantity" onkeyup="this.value=this.value.replace(/\D/g,'')" v-model="quantity" name="quantity">
|
<input type="text" class="form-control" :disabled="!product.quantity" onkeyup="this.value=this.value.replace(/\D/g,'')" v-model="quantity" name="quantity">
|
||||||
<div class="right">
|
<div class="right">
|
||||||
|
|
@ -95,7 +95,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<button
|
<button
|
||||||
class="btn btn-outline-dark ms-3 add-cart"
|
class="btn btn-outline-dark ms-md-3 add-cart"
|
||||||
:disabled="!product.quantity"
|
:disabled="!product.quantity"
|
||||||
@click="addCart(false, this)"
|
@click="addCart(false, this)"
|
||||||
><i class="bi bi-cart-fill me-1"></i>{{ __('shop/products.add_to_cart') }}
|
><i class="bi bi-cart-fill me-1"></i>{{ __('shop/products.add_to_cart') }}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,107 @@
|
||||||
|
{{-- <ul class="navbar-nav">
|
||||||
|
@foreach ($menu_content as $menu)
|
||||||
|
<li
|
||||||
|
class="nav-item">
|
||||||
|
<div class="nav-item-text">
|
||||||
|
<a class="nav-link"
|
||||||
|
target="{{ isset($menu['new_window']) && $menu['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
href="{{ $menu['link'] ?? '' }}">
|
||||||
|
{{ $menu['name'] }}
|
||||||
|
@if (isset($menu['badge']) && $menu['badge']['name'])
|
||||||
|
<span class="badge"
|
||||||
|
style="background-color: {{ $menu['badge']['bg_color'] }}; color: {{ $menu['badge']['text_color'] }}; border-color: {{ $menu['badge']['bg_color'] }}">
|
||||||
|
{{ $menu['badge']['name'] }}
|
||||||
|
</span>
|
||||||
|
@endif
|
||||||
|
</a>
|
||||||
|
@if (isset($menu['children_group']) && $menu['children_group'])
|
||||||
|
<span><i class="bi bi-chevron-right"></i></span>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
@if (isset($menu['children_group']) && $menu['children_group'])
|
||||||
|
<div class="dropdown-menu">
|
||||||
|
@forelse ($menu['children_group'] as $group)
|
||||||
|
<div class="children-group">
|
||||||
|
@if ($group['name'])
|
||||||
|
<div class="mb-3 fw-bold group-name">{{ $group['name'] }}</div>
|
||||||
|
@endif
|
||||||
|
@if ($group['type'] == 'image')
|
||||||
|
<a
|
||||||
|
target="{{ isset($group['image']['link']['new_window']) && $group['image']['link']['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
href="{{ $group['image']['link'] }}"><img src="{{ $group['image']['image'] }}"
|
||||||
|
class="img-fluid"></a>
|
||||||
|
@else
|
||||||
|
<ul class="nav flex-column ul-children">
|
||||||
|
@foreach ($group['children'] as $children)
|
||||||
|
@if (!is_array($children['link']['text']))
|
||||||
|
<li class="nav-item">
|
||||||
|
<a
|
||||||
|
target="{{ isset($children['link']['new_window']) && $children['link']['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
class="nav-link px-0"
|
||||||
|
href="{{ $children['link']['link'] }}">{{ $children['link']['text'] }}</a>
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul> --}}
|
||||||
|
|
||||||
|
|
||||||
|
<div class="accordion accordion-flush" id="menu-accordion">
|
||||||
|
@foreach ($menu_content as $key => $menu)
|
||||||
|
<div class="accordion-item">
|
||||||
|
<div class="nav-item-text">
|
||||||
|
<a class="nav-link"
|
||||||
|
target="{{ isset($menu['new_window']) && $menu['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
href="{{ $menu['link'] ?? '' }}">
|
||||||
|
{{ $menu['name'] }}
|
||||||
|
@if (isset($menu['badge']) && $menu['badge']['name'])
|
||||||
|
<span class="badge"
|
||||||
|
style="background-color: {{ $menu['badge']['bg_color'] }}; color: {{ $menu['badge']['text_color'] }}; border-color: {{ $menu['badge']['bg_color'] }}">
|
||||||
|
{{ $menu['badge']['name'] }}
|
||||||
|
</span>
|
||||||
|
@endif
|
||||||
|
</a>
|
||||||
|
@if (isset($menu['children_group']) && $menu['children_group'])
|
||||||
|
<span class="collapsed" data-bs-toggle="collapse" data-bs-target="#flush-menu-{{ $key }}"><i class="bi bi-chevron-down"></i></span>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
@if (isset($menu['children_group']) && $menu['children_group'])
|
||||||
|
<div class="accordion-collapse collapse" id="flush-menu-{{ $key }}" data-bs-parent="#menu-accordion">
|
||||||
|
@forelse ($menu['children_group'] as $group)
|
||||||
|
<div class="children-group mb-3">
|
||||||
|
@if ($group['name'])
|
||||||
|
<div class="group-name">{{ $group['name'] }}</div>
|
||||||
|
@endif
|
||||||
|
@if ($group['type'] == 'image')
|
||||||
|
<a
|
||||||
|
target="{{ isset($group['image']['link']['new_window']) && $group['image']['link']['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
href="{{ $group['image']['link'] }}"><img src="{{ $group['image']['image'] }}"
|
||||||
|
class="img-fluid"></a>
|
||||||
|
@else
|
||||||
|
<ul class="nav flex-column ul-children">
|
||||||
|
@foreach ($group['children'] as $children)
|
||||||
|
@if (!is_array($children['link']['text']))
|
||||||
|
<li class="nav-item">
|
||||||
|
<a
|
||||||
|
target="{{ isset($children['link']['new_window']) && $children['link']['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
class="nav-link px-0"
|
||||||
|
href="{{ $children['link']['link'] }}">{{ $children['link']['text'] }}</a>
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,57 @@
|
||||||
|
<ul class="navbar-nav mx-auto">
|
||||||
|
@foreach ($menu_content as $menu)
|
||||||
|
<li
|
||||||
|
class="nav-item {{ isset($menu['children_group']) ? 'dropdown' : '' }} {{ isset($menu['isFull']) && $menu['isFull'] ? 'position-static' : '' }}">
|
||||||
|
<a class="nav-link fw-bold {{ isset($menu['children_group']) ? 'dropdown-toggle' : '' }}"
|
||||||
|
target="{{ isset($menu['new_window']) && $menu['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
href="{{ $menu['link'] ?? '' }}">
|
||||||
|
{{ $menu['name'] }}
|
||||||
|
@if (isset($menu['badge']) && $menu['badge']['name'])
|
||||||
|
<span class="badge"
|
||||||
|
style="background-color: {{ $menu['badge']['bg_color'] }}; color: {{ $menu['badge']['text_color'] }}; border-color: {{ $menu['badge']['bg_color'] }}">
|
||||||
|
{{ $menu['badge']['name'] }}
|
||||||
|
</span>
|
||||||
|
@endif
|
||||||
|
</a>
|
||||||
|
@if (isset($menu['children_group']) && $menu['children_group'])
|
||||||
|
<div class="dropdown-menu {{ $menu['isFull'] ? 'w-100' : '' }}"
|
||||||
|
style="min-width: {{ count($menu['children_group']) * 200 }}px">
|
||||||
|
<div class="card card-lg">
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
@forelse ($menu['children_group'] as $group)
|
||||||
|
<div class="col-6 col-md">
|
||||||
|
@if ($group['name'])
|
||||||
|
<div class="mb-3 fw-bold group-name">{{ $group['name'] }}</div>
|
||||||
|
@endif
|
||||||
|
@if ($group['type'] == 'image')
|
||||||
|
<a
|
||||||
|
target="{{ isset($group['image']['link']['new_window']) && $group['image']['link']['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
href="{{ $group['image']['link'] }}"><img src="{{ $group['image']['image'] }}"
|
||||||
|
class="img-fluid"></a>
|
||||||
|
@else
|
||||||
|
<ul class="nav flex-column ul-children">
|
||||||
|
@foreach ($group['children'] as $children)
|
||||||
|
@if (!is_array($children['link']['text']))
|
||||||
|
<li class="nav-item">
|
||||||
|
<a
|
||||||
|
target="{{ isset($children['link']['new_window']) && $children['link']['new_window'] ? '_blank' : '_self' }}"
|
||||||
|
class="nav-link px-0"
|
||||||
|
href="{{ $children['link']['link'] }}">{{ $children['link']['text'] }}</a>
|
||||||
|
</li>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
@endif
|
||||||
|
</li>
|
||||||
|
@endforeach
|
||||||
|
</ul>
|
||||||
Loading…
Reference in New Issue