up
This commit is contained in:
@@ -173,16 +173,6 @@ a {
|
||||
.admin-menu-container .menu-logo img {
|
||||
height: 22px;
|
||||
}
|
||||
.admin-menu-container .menu-list {
|
||||
margin: 50px 5px;
|
||||
}
|
||||
.admin-menu-container details {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
.admin-menu-container details .item {
|
||||
background: #004e99;
|
||||
}
|
||||
.admin-menu-container details[open] svg {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
@@ -198,42 +188,11 @@ a {
|
||||
.admin-menu-container details[open] .fa-angle-right {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
.admin-menu-container .box-item {
|
||||
position: relative;
|
||||
}
|
||||
.admin-menu-container .box-item .item {
|
||||
background: #004e99;
|
||||
}
|
||||
.admin-menu-container summary {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
cursor: pointer;
|
||||
padding-right: 16px;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
transition: 0.3s all;
|
||||
}
|
||||
.admin-menu-container summary a {
|
||||
padding: 8px 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.admin-menu-container svg {
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
transition: 0.3s all;
|
||||
}
|
||||
.admin-menu-container .item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 12px;
|
||||
line-height: 36px;
|
||||
transition: 0.3s all;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 4px;
|
||||
position: relative;
|
||||
}
|
||||
.admin-menu-container .item.active {
|
||||
background: #22a2ff;
|
||||
}
|
||||
@@ -254,23 +213,6 @@ a {
|
||||
height: 20px;
|
||||
margin-right: 13px;
|
||||
}
|
||||
.admin-menu-container .sub-hover {
|
||||
display: none;
|
||||
position: absolute;
|
||||
left: 100%;
|
||||
top: 0;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
z-index: 1000;
|
||||
}
|
||||
.admin-menu-container .sub-hover a {
|
||||
display: block;
|
||||
padding: 10px 10px 10px 45px;
|
||||
position: relative;
|
||||
}
|
||||
.admin-menu-container .sub-hover a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.admin-menu-container .title-main {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -151,15 +151,7 @@ a {
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
.menu-list {
|
||||
margin: 50px 5px;
|
||||
}
|
||||
details {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
.item {
|
||||
background: #004e99;
|
||||
}
|
||||
&[open] {
|
||||
svg {
|
||||
transform: rotate(90deg);
|
||||
@@ -179,42 +171,12 @@ a {
|
||||
}
|
||||
}
|
||||
|
||||
.box-item {
|
||||
position: relative;
|
||||
.item {
|
||||
background: #004e99;
|
||||
}
|
||||
}
|
||||
|
||||
summary {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
cursor: pointer;
|
||||
padding-right: 16px;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
transition: 0.3s all;
|
||||
a {
|
||||
padding: 8px 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
svg {
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
transition: 0.3s all;
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 12px;
|
||||
line-height: 36px;
|
||||
transition: 0.3s all;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 4px;
|
||||
position: relative;
|
||||
&.active {
|
||||
background: #22a2ff;
|
||||
.icons {
|
||||
@@ -237,24 +199,6 @@ a {
|
||||
margin-right: 13px;
|
||||
}
|
||||
}
|
||||
.sub-hover {
|
||||
display: none; // Ẩn mặc định
|
||||
position: absolute;
|
||||
left: 100%;
|
||||
top: 0;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||||
z-index: 1000;
|
||||
a {
|
||||
display: block;
|
||||
padding: 10px 10px 10px 45px;
|
||||
position: relative;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.title-main {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@@ -34,8 +34,9 @@
|
||||
<img src="{{ 'logo.png' | asset_url }}" />
|
||||
</a>
|
||||
|
||||
<div class="menu-list">
|
||||
<a href="/" class="item {% if global.module == 'home' %} active {% endif %}">
|
||||
<div class="menu-list m-[50px_5px]">
|
||||
<a href="/"
|
||||
class="item flex items-center cursor-pointer p-[0_12px] rounded-[4px] relative delay-300 transition-all bg-[#004e99] mb-[4px] leading-[36px] {% if global.module == 'home' %} active {% endif %}">
|
||||
<i class="icons icon-home"></i>
|
||||
<span class="title"> Home </span>
|
||||
</a>
|
||||
@@ -44,23 +45,29 @@
|
||||
{% assign _type = _category[0] %}
|
||||
{% assign _menuArray = _category[1].menu %}
|
||||
{% if _category[1].enable == 1 %}
|
||||
<details class="dropdown dropdown-hover" {% if _type==global.module %} open {% endif %}>
|
||||
<summary class="item {% if _type == global.module %} active {% endif %}" tabindex="{{_type}}"
|
||||
role="button">
|
||||
<details class="relative w-[100%]" {% if _type==global.module %} open {% endif %}>
|
||||
<summary class="item flex items-center justify-between cursor-pointer p-[0_12px] rounded-[4px] relative delay-300 transition-all bg-[#004e99] mb-[4px] leading-[36px]
|
||||
{% if _type == global.module %} active {% endif %}">
|
||||
<div class="flex items-center">
|
||||
|
||||
{% if _type == 'order' %} <i class="icons icon-order"></i>
|
||||
{% elsif _type == 'product' %} <i class="icons icon-product"></i>
|
||||
{% elsif _type == 'customer' %}<i class="icons icon-customer"></i>
|
||||
{% elsif _type == 'marketing' %}<i class="icons icon-marketing"></i>
|
||||
{% elsif _type == 'investor_relation' %} <i class="icons icon-investor_relation"></i>
|
||||
{% if _type == 'order' %} <i class="icons w-[20px] h-[20px] mr-[13px] icon-order"></i>
|
||||
{% elsif _type == 'product' %} <i
|
||||
class="icons w-[20px] h-[20px] mr-[13px] icon-product"></i>
|
||||
{% elsif _type == 'customer' %}<i
|
||||
class="icons w-[20px] h-[20px] mr-[13px] icon-customer"></i>
|
||||
{% elsif _type == 'marketing' %}<i
|
||||
class="icons w-[20px] h-[20px] mr-[13px] icon-marketing"></i>
|
||||
{% elsif _type == 'investor_relation' %} <i
|
||||
class="icons w-[20px] h-[20px] mr-[13px] icon-investor_relation"></i>
|
||||
{% elsif _type == 'article' %} <i class="icons icon-content"></i>
|
||||
{% elsif _type == 'job' %} <i class="icons icon-job"></i>
|
||||
{% elsif _type == 'pcbuilder' %} <i class="icons icon-pcbuilder"></i>
|
||||
{% elsif _type == 'payinstall' %} <i class="icons icon-payinstall"></i>
|
||||
{% elsif _type == 'distributor' %} <i class="icons icon-distributor"></i>
|
||||
{% elsif _type == 'report' %}<i class="icons icon-stats"></i>
|
||||
{% elsif _type == 'system' %}<i class="icons icon-system"></i>
|
||||
{% elsif _type == 'job' %} <i class="icons w-[20px] h-[20px] mr-[13px] icon-job"></i>
|
||||
{% elsif _type == 'pcbuilder' %} <i
|
||||
class="icons w-[20px] h-[20px] mr-[13px] icon-pcbuilder"></i>
|
||||
{% elsif _type == 'payinstall' %} <i
|
||||
class="icons w-[20px] h-[20px] mr-[13px] icon-payinstall"></i>
|
||||
{% elsif _type == 'distributor' %} <i
|
||||
class="icons w-[20px] h-[20px] mr-[13px] icon-distributor"></i>
|
||||
{% elsif _type == 'report' %}<i class="icons w-[20px] h-[20px] mr-[13px] icon-stats"></i>
|
||||
{% elsif _type == 'system' %}<i class="icons w-[20px] h-[20px] mr-[13px] icon-system"></i>
|
||||
{% endif %}
|
||||
|
||||
<span class="title"> {{ _category[1].name }} </span>
|
||||
@@ -69,18 +76,10 @@
|
||||
<i class="fa-solid fa-chevron-right"></i>
|
||||
</summary>
|
||||
|
||||
<div class="sub-hover dropdown-content" tabindex="{{_type}}">
|
||||
{% for _item in _menuArray %}
|
||||
<a href="{{ _item.url }}"
|
||||
class="{% if _item.view == global.view and _item.module == global.module %}current {% endif %}">
|
||||
{{_item.name }} </a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="sub-menu">
|
||||
{% for _item in _menuArray %}
|
||||
<a href="{{ _item.url }}"
|
||||
class="{% if _item.view == global.view and _item.module == global.module %}current {% endif %}">
|
||||
class="p-[8px_16px] flex items-center {% if _item.view == global.view and _item.module == global.module %}current {% endif %}">
|
||||
{{_item.name }} </a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@@ -92,24 +91,28 @@
|
||||
<div class="menu-list">
|
||||
<p style="color: #81B5E4;margin: 0 0 10px;font-weight: 700;padding: 0 16px;">TÀI KHOẢN</p>
|
||||
|
||||
<a href="" class="item">
|
||||
<i class="icons icon-settings"></i>
|
||||
<a href=""
|
||||
class="item flex items-center cursor-pointer p-[0_12px] rounded-[4px] relative delay-300 transition-all bg-[#004e99] mb-[4px] leading-[36px]">
|
||||
<i class="icons w-[20px] h-[20px] mr-[13px] icon-settings"></i>
|
||||
<span class="title"> Cài đặt </span>
|
||||
</a>
|
||||
|
||||
<a href="" class="item">
|
||||
<i class="icons icon-support"></i>
|
||||
<a href=""
|
||||
class="item flex items-center cursor-pointer p-[0_12px] rounded-[4px] relative delay-300 transition-all bg-[#004e99] mb-[4px] leading-[36px]">
|
||||
<i class="icons w-[20px] h-[20px] mr-[13px] icon-support"></i>
|
||||
<span class="title"> Hỗ trợ </span>
|
||||
</a>
|
||||
|
||||
<a href="" class="item">
|
||||
<i class="icons icon-account"></i>
|
||||
<a href=""
|
||||
class="item flex items-center cursor-pointer p-[0_12px] rounded-[4px] relative delay-300 transition-all bg-[#004e99] mb-[4px] leading-[36px]">
|
||||
<i class="icons w-[20px] h-[20px] mr-[13px] icon-account"></i>
|
||||
<span class="title"> Quản lý tài khoản </span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<a href="" class="item">
|
||||
<i class="icons icon-logout"></i>
|
||||
<a href=""
|
||||
class="item flex items-center cursor-pointer p-[0_12px] rounded-[4px] relative delay-300 transition-all bg-[#004e99] mb-[4px] leading-[36px]">
|
||||
<i class="icons w-[20px] h-[20px] mr-[13px] icon-logout"></i>
|
||||
<span class="title"> Thoát quản trị </span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user