mirror of https://github.com/4xmen/xshop.git
parent
e9595486f7
commit
8f0f9272d1
Binary file not shown.
|
After Width: | Height: | Size: 586 B |
@ -0,0 +1,18 @@
|
|||||||
|
window.addEventListener('load', function () {
|
||||||
|
try {
|
||||||
|
|
||||||
|
document.querySelectorAll('#panel-navbar a')?.forEach(function (el) {
|
||||||
|
el.addEventListener('click', function (e) {
|
||||||
|
const href = this.getAttribute('href');
|
||||||
|
if (href[0] === '#'){
|
||||||
|
e.preventDefault();
|
||||||
|
document.querySelector('#panel').classList.add('sided');
|
||||||
|
document.querySelector('#sidebar-panel').innerHTML = document.querySelector(href).outerHTML;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e.message);
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
@ -1,4 +1,29 @@
|
|||||||
.form-control:focus{
|
.form-control:focus,.form-check-input:focus{
|
||||||
box-shadow: 0 0 0 0.25rem rgba(133, 13, 253, 0.25);
|
box-shadow: 0 0 0 0.25rem rgba(133, 13, 253, 0.25);
|
||||||
border-color: #bc86fe;
|
border-color: #bc86fe;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.card{
|
||||||
|
background-color: rgba(var(--bs-body-bg),.5);
|
||||||
|
background-image: url("../images/pattern.png");
|
||||||
|
backdrop-filter: blur(4px);
|
||||||
|
box-shadow: -2px -2px 7px #560000, 2px 2px 7px #5e00b5;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.form-check-input:checked,.btn-primary{
|
||||||
|
background-color: #a60087;
|
||||||
|
border-color: #ff0067;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-primary:hover{
|
||||||
|
background-color: #ff0067;
|
||||||
|
}
|
||||||
|
|
||||||
|
a,a:visited{
|
||||||
|
color: #cb00a5;
|
||||||
|
&:hover{
|
||||||
|
color: #ff0067;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -0,0 +1,76 @@
|
|||||||
|
#panel-navbar {
|
||||||
|
background-color: #282c34;
|
||||||
|
background-image: url("../images/pattern.png");
|
||||||
|
height: calc(100vh - 55px);
|
||||||
|
overflow-y: auto;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
ul {
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
> ul {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
//border-right: 1px dashed gray;
|
||||||
|
//border-left: 1px dashed gray;
|
||||||
|
|
||||||
|
|
||||||
|
li {
|
||||||
|
i {
|
||||||
|
font-size: 28px;
|
||||||
|
}
|
||||||
|
ul{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a, a:visited {
|
||||||
|
padding: 5px 9px 5px 11px;
|
||||||
|
display: block;
|
||||||
|
color: white;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: $indigo;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar-panel {
|
||||||
|
overflow: hidden;
|
||||||
|
background: rgba(0, 0, 0, .1);
|
||||||
|
transition: .5s;
|
||||||
|
ul{
|
||||||
|
padding: 5px;
|
||||||
|
list-style: none;
|
||||||
|
li{
|
||||||
|
a{
|
||||||
|
display: flex;
|
||||||
|
padding: 7px ;
|
||||||
|
color: white;
|
||||||
|
transition: .7s;
|
||||||
|
border-radius: 5px;
|
||||||
|
align-items: center;
|
||||||
|
justify-self: center;
|
||||||
|
|
||||||
|
i{
|
||||||
|
font-size: 20px;
|
||||||
|
margin-right: 1rem;
|
||||||
|
margin-left: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover{
|
||||||
|
background: darkred;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@ -0,0 +1,218 @@
|
|||||||
|
<nav id="panel-navbar">
|
||||||
|
<ul>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("xShop")}}">
|
||||||
|
<a href="{{route('welcome')}}" target="_blank">
|
||||||
|
<i class="ri-home-smile-fill"></i>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Shopping card")}}">
|
||||||
|
<a href="#card">
|
||||||
|
<i class="ri-shopping-cart-line"></i>
|
||||||
|
</a>
|
||||||
|
<ul id="card">
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-team-fill"></i>
|
||||||
|
|
||||||
|
{{__('Customers')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-file-list-3-fill"></i>
|
||||||
|
{{__('Invoices')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-percent-fill"></i>
|
||||||
|
{{__('Discounts')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Catalog")}}">
|
||||||
|
<a href="#catalog">
|
||||||
|
<i class="ri-store-line"></i>
|
||||||
|
</a>
|
||||||
|
<ul id="catalog">
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-vip-diamond-fill"></i>
|
||||||
|
{{__('Products')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-box-3-fill"></i>
|
||||||
|
{{__('Product categories')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-file-list-3-fill"></i>
|
||||||
|
{{__("Properties meta")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-truck-fill"></i>
|
||||||
|
{{__('Transports')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-image-fill"></i>
|
||||||
|
{{__("Slider")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Contents")}}">
|
||||||
|
<a href="#contents">
|
||||||
|
<i class="ri-pages-line"></i>
|
||||||
|
</a>
|
||||||
|
<ul id="contents">
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-megaphone-fill"></i>
|
||||||
|
{{__('Post')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-book-3-fill"></i>
|
||||||
|
{{__('Groups')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-threads-line"></i>
|
||||||
|
{{__("Advertise")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-gallery-fill"></i>
|
||||||
|
{{__("Galleries")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-video-fill"></i>
|
||||||
|
{{__("Video clips")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-attachment-2"></i>
|
||||||
|
{{__("Attachments")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Theme")}}">
|
||||||
|
<a href="#themes">
|
||||||
|
<i class="ri-palette-line"></i>
|
||||||
|
</a>
|
||||||
|
<ul id="themes">
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-list-check"></i>
|
||||||
|
{{__("Menus")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-color-filter-line"></i>
|
||||||
|
{{__("Graphic")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-paint-brush-line"></i>
|
||||||
|
{{__("Design")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Interaction")}}">
|
||||||
|
<a href="#interaction">
|
||||||
|
<i class="ri-chat-1-line"></i>
|
||||||
|
</a>
|
||||||
|
<ul id="interaction">
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-question-mark"></i>
|
||||||
|
{{__('Questions')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-mail-fill"></i>
|
||||||
|
{{__('Tickets')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-chat-1-fill"></i>
|
||||||
|
{{__('Comments')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-mail-unread-fill"></i>
|
||||||
|
{{__("Contact us")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Managing")}}">
|
||||||
|
<a href="#manage">
|
||||||
|
<i class="ri-pie-chart-line"></i>
|
||||||
|
</a>
|
||||||
|
<ul id="manage">
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-folder-user-fill"></i>
|
||||||
|
{{__("Users")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-list-check-3"></i>
|
||||||
|
{{__('Logs')}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a>
|
||||||
|
<i class="ri-global-fill"></i>
|
||||||
|
{{__("Languages")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-bar-chart-2-line"></i>
|
||||||
|
{{__("Reports")}}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li data-bs-toggle="tooltip" data-bs-placement="auto" data-bs-custom-class="custom-tooltip"
|
||||||
|
data-bs-title="{{__("Setting")}}">
|
||||||
|
<a href="">
|
||||||
|
<i class="ri-settings-4-line"></i>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
Loading…
Reference in New Issue