tieptk/admin_hura_8
2
1
Fork 0
Code Issues 1 Pull Requests Projects Releases Wiki Activity

up

Browse Source
This commit is contained in:
Tieptk
2025-02-08 22:55:01 +07:00
parent 7299751c83
commit 9bdd0e435a
4 changed files with 38 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
assets/script/pc_style.css
View File

@@ -173,16 +173,6 @@ a {
.admin-menu-container .menu-logo img { .admin-menu-container .menu-logo img {
height: 22px; 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 { .admin-menu-container details[open] svg {
transform: rotate(90deg); transform: rotate(90deg);
} }
@@ -198,42 +188,11 @@ a {
.admin-menu-container details[open] .fa-angle-right { .admin-menu-container details[open] .fa-angle-right {
transform: rotate(90deg); 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 { .admin-menu-container svg {
position: absolute; position: absolute;
right: 16px; right: 16px;
transition: 0.3s all; 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 { .admin-menu-container .item.active {
background: #22a2ff; background: #22a2ff;
} }
@@ -254,23 +213,6 @@ a {
height: 20px; height: 20px;
margin-right: 13px; 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 { .admin-menu-container .title-main {
width: 100%; width: 100%;
} }

2
assets/script/pc_style.css.map
View File

File diff suppressed because one or more lines are too long

56
assets/script/pc_style.scss
View File

@@ -151,15 +151,7 @@ a {
height: 22px; height: 22px;
} }
} }
.menu-list {
margin: 50px 5px;
}
details { details {
position: relative;
width: 100%;
.item {
background: #004e99;
}
&[open] { &[open] {
svg { svg {
transform: rotate(90deg); 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 { svg {
position: absolute; position: absolute;
right: 16px; right: 16px;
transition: 0.3s all; transition: 0.3s all;
} }
.item { .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 { &.active {
background: #22a2ff; background: #22a2ff;
.icons { .icons {
@@ -237,24 +199,6 @@ a {
margin-right: 13px; 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 { .title-main {
width: 100%; width: 100%;
} }

71
template/theme.html
View File

@@ -34,8 +34,9 @@
<img src="{{ 'logo.png' | asset_url }}" /> <img src="{{ 'logo.png' | asset_url }}" />
</a> </a>
<div class="menu-list"> <div class="menu-list m-[50px_5px]">
<a href="/" class="item {% if global.module == 'home' %} active {% endif %}"> <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> <i class="icons icon-home"></i>
<span class="title"> Home </span> <span class="title"> Home </span>
</a> </a>
@@ -44,23 +45,29 @@
{% assign _type = _category[0] %} {% assign _type = _category[0] %}
{% assign _menuArray = _category[1].menu %} {% assign _menuArray = _category[1].menu %}
{% if _category[1].enable == 1 %} {% if _category[1].enable == 1 %}
<details class="dropdown dropdown-hover" {% if _type==global.module %} open {% endif %}> <details class="relative w-[100%]" {% if _type==global.module %} open {% endif %}>
<summary class="item {% if _type == global.module %} active {% endif %}" tabindex="{{_type}}" <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]
role="button"> {% if _type == global.module %} active {% endif %}">
<div class="flex items-center"> <div class="flex items-center">
{% if _type == 'order' %} <i class="icons w-[20px] h-[20px] mr-[13px] icon-order"></i>
{% if _type == 'order' %} <i class="icons icon-order"></i> {% elsif _type == 'product' %} <i
{% elsif _type == 'product' %} <i class="icons icon-product"></i> class="icons w-[20px] h-[20px] mr-[13px] icon-product"></i>
{% elsif _type == 'customer' %}<i class="icons icon-customer"></i> {% elsif _type == 'customer' %}<i
{% elsif _type == 'marketing' %}<i class="icons icon-marketing"></i> class="icons w-[20px] h-[20px] mr-[13px] icon-customer"></i>
{% elsif _type == 'investor_relation' %} <i class="icons icon-investor_relation"></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 == 'article' %} <i class="icons icon-content"></i>
{% elsif _type == 'job' %} <i class="icons icon-job"></i> {% elsif _type == 'job' %} <i class="icons w-[20px] h-[20px] mr-[13px] icon-job"></i>
{% elsif _type == 'pcbuilder' %} <i class="icons icon-pcbuilder"></i> {% elsif _type == 'pcbuilder' %} <i
{% elsif _type == 'payinstall' %} <i class="icons icon-payinstall"></i> class="icons w-[20px] h-[20px] mr-[13px] icon-pcbuilder"></i>
{% elsif _type == 'distributor' %} <i class="icons icon-distributor"></i> {% elsif _type == 'payinstall' %} <i
{% elsif _type == 'report' %}<i class="icons icon-stats"></i> class="icons w-[20px] h-[20px] mr-[13px] icon-payinstall"></i>
{% elsif _type == 'system' %}<i class="icons icon-system"></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 %} {% endif %}
<span class="title"> {{ _category[1].name }} </span> <span class="title"> {{ _category[1].name }} </span>
@@ -69,18 +76,10 @@
<i class="fa-solid fa-chevron-right"></i> <i class="fa-solid fa-chevron-right"></i>
</summary> </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"> <div class="sub-menu">
{% for _item in _menuArray %} {% for _item in _menuArray %}
<a href="{{ _item.url }}" <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> {{_item.name }} </a>
{% endfor %} {% endfor %}
</div> </div>
@@ -92,24 +91,28 @@
<div class="menu-list"> <div class="menu-list">
<p style="color: #81B5E4;margin: 0 0 10px;font-weight: 700;padding: 0 16px;">TÀI KHOẢN</p> <p style="color: #81B5E4;margin: 0 0 10px;font-weight: 700;padding: 0 16px;">TÀI KHOẢN</p>
<a href="" class="item"> <a href=""
<i class="icons icon-settings"></i> 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> <span class="title"> Cài đặt </span>
</a> </a>
<a href="" class="item"> <a href=""
<i class="icons icon-support"></i> 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> <span class="title"> Hỗ trợ </span>
</a> </a>
<a href="" class="item"> <a href=""
<i class="icons icon-account"></i> 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> <span class="title"> Quản lý tài khoản </span>
</a> </a>
</div> </div>
<a href="" class="item"> <a href=""
<i class="icons icon-logout"></i> 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> <span class="title"> Thoát quản trị </span>
</a> </a>
</div> </div>