djangoadmin/djangoadmin-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化升级

Browse Source
This commit is contained in:
gitadmin
2026-09-18 11:18:05 +08:00
parent 00cfabb822
commit ac67684735
3 changed files with 187 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
xiaomayi-modules/xiaomayi-web/src/main/resources/static/assets/css/main.css
+68 -3
View File
@@ -1,10 +1,75 @@
body {
padding-top: 70px;
padding-top:110px;
color: #666;
background: #f4f7f7;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'
}
/* ========== 顶部公告横条 ========== */
.xm-top-bar {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 40px;
background: #000;
z-index: 1001;
display: flex;
align-items: center;
justify-content: center;
}
.xm-top-bar-inner {
display: flex;
align-items: center;
gap: 14px;
}
/* NEW 标签 */
.xm-top-bar-tag {
background: #165DFF;
color: #fff;
font-size: 12px;
font-weight: 700;
padding: 3px 14px;
border-radius: 20px;
letter-spacing: 1px;
}
/* 公告文字 */
.xm-top-bar-text {
color: #ccc;
font-size: 14px;
white-space: nowrap;
}
/* 了解详情 */
.xm-top-bar-link {
color: #165DFF !important;
font-size: 14px;
font-weight: 500;
text-decoration: none !important;
display: inline-flex;
align-items: center;
gap: 4px;
white-space: nowrap;
transition: color 0.2s;
}
.xm-top-bar-link:hover {
color: #4d8bff !important;
}
.xm-top-bar-arrow {
display: inline-block;
transition: transform 0.2s;
}
.xm-top-bar-link:hover .xm-top-bar-arrow {
transform: translateX(3px);
}
@media screen and (max-width: 768px) {
body { padding-top: 95px; }
.xm-top-bar { height: 36px; }
.xm-top-bar-text { font-size: 12px; }
.xm-top-bar-link { font-size: 12px; }
.xm-top-bar-tag { font-size: 11px; padding: 3px 10px; }
}
.section {
margin: 0
}
@@ -569,7 +634,7 @@ body .layui-util-face .layui-layer-content {
.ew-header {
position: fixed;
top: 0;
top:40px;
left: 0;
right: 0;
background-color: #fff;
@@ -710,7 +775,7 @@ body .layui-util-face .layui-layer-content {
@media screen and (max-width: 935px) {
body {
padding-top: 55px
padding-top:95px
}
.ew-header {
xiaomayi-modules/xiaomayi-web/src/main/resources/templates/index3.html
+108 -32
View File
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html lang="zh-CN">
<!-- 引入头部 -->
<header th:replace="~{./public/header :: header}"></header>
@@ -10,16 +10,13 @@
background: #fff;
color: #333;
position: relative;
margin-top: 15px;
}
.ew-banner:before {
display: none;
}
.ew-banner p {
color: #999;
}
.ew-banner img.shape {
-webkit-animation-duration: 5s;
animation-duration: 5s;
@@ -29,38 +26,116 @@
pointer-events: none;
}
/* ========== Hero 布局 ========== */
.xm-hero {
position: relative;
display: flex;
align-items: center;
min-height: 460px;
padding: 80px 0 100px;
}
.xm-hero-text {
flex: 1;
z-index: 2;
max-width: 600px;
text-align: left;
}
.xm-hero-badge {
display: inline-flex;
align-items: center;
gap: 6px;
background: #165DFF;
color: #fff;
font-size: 13px;
font-weight: 600;
padding: 5px 18px;
border-radius: 20px;
margin-bottom: 24px;
letter-spacing: 1px;
}
.xm-hero-badge .layui-icon {
font-size: 14px;
}
.xm-hero-title {
font-size: 42px;
font-weight: 700;
color: #0b1a33;
line-height: 1.3;
margin-bottom: 20px;
}
.xm-hero-desc {
font-size: 16px;
color: #5a6a85;
line-height: 1.8;
margin-bottom: 36px;
}
.xm-hero-actions {
display: flex;
gap: 14px;
align-items: center;
}
.xm-hero-btn {
height: 44px;
line-height: 44px;
padding: 0 28px;
font-size: 15px;
border-radius: 6px;
background-color: #165DFF !important;
border: none;
}
.xm-hero-visual {
flex: 1;
display: flex;
justify-content: flex-end;
z-index: 1;
}
.xm-hero-visual .shape-main {
width: 520px;
max-width: 100%;
}
@media screen and (max-width: 768px) {
img.shape-main {
width: 90% !important;
max-width: 370px !important;
right: 15px !important;
top: 30px !important;
.xm-hero {
flex-direction: column;
padding: 50px 0 60px;
min-height: auto;
align-items: flex-start;
}
.ew-banner > .layui-container {
padding-top: 320px;
padding-bottom: 20px !important;
padding-right: 20px !important;
.xm-hero-text {
max-width: 100%;
}
.xm-hero-title {
font-size: 26px;
}
.xm-hero-title br {
display: none;
}
.xm-hero-desc {
font-size: 14px;
}
.xm-hero-desc br {
display: none;
}
.xm-hero-visual {
margin-top: 30px;
}
.xm-hero-visual .shape-main {
width: 320px;
}
img.shape6 {
top: 510px !important;
}
img.shape4 {
left: 5px !important;
bottom: 300px !important;
}
.layui-logo > img {
top: 12px !important;
}
.ew-footer .img-group {
padding-left: 100px !important;
height: 103px !important;
}
.ew-footer .img-group > img {
width: 90px !important;
height: 90px !important;
@@ -295,19 +370,20 @@
<div th:replace="~{./public/common_header::common_header}"></div>
<!-- banner -->
<div class="ew-banner" style="margin-top: 15px;">
<div class="layui-container" style="text-align: left;padding-bottom: 80px;padding-left: 30px;">
<h1 style="margin-top: 25px;">小蚂蚁云企业级中台解决方案</h1>
<p style="margin-bottom: 10px;">基于 Python 语言的企业级Web应用敏捷开发框架。</p>
<p>为企业、政府及开发者提供从架构到部署的应用平台解决方案；</p>
<div class="ew-banner-btngroup" style="margin-top: 40px;">
<button class="layui-btn" nav-scroll="pricing">获取授权<i class="layui-icon" style="transform: rotate(-90deg);">&#xe601;</i>
</button>
<a href="/doc/" class="layui-btn" target="_blank" style="display: none;">更新日志<i
class="layui-icon">&#xe702;</i></a>
<div class="ew-banner">
<div class="layui-container xm-hero">
<div class="xm-hero-text">
<div class="xm-hero-badge"><i class="layui-icon layui-icon-diamond"></i> 企业级中台解决方案</div>
<h1 class="xm-hero-title">构建高安全、高效率、<br>易扩展的数据中台基座</h1>
<p class="xm-hero-desc">基于 Python 生态与 Vue3 技术栈，集成精细化权限管控、高效代码生成、全端自适应等企业级能力，<br>赋能企业数字化转型，加速业务价值交付。</p>
<div class="xm-hero-actions">
<button class="layui-btn xm-hero-btn" nav-scroll="pricing">获取授权 <i class="layui-icon" style="transform: rotate(-90deg);">&#xe601;</i></button>
<!-- <button class="layui-btn xm-hero-btn" nav-scroll="pricing">查看价格 <i class="layui-icon" style="transform: rotate(-90deg);">&#xe601;</i></button>-->
</div>
</div>
<div class="xm-hero-visual">
<img class="shape-main" th:src="@{/static/assets/images/b1.png}" />
</div>
<img class="shape-main" th:src="@{/static/assets/images/b1.png}"
style="width: 520px;position: absolute;top:5px;right: -60px;"/>
<img class="shape layui-anim-rotate layui-anim-loop" th:src="@{/static/assets/images/shape1.png}"
style="position: absolute;right: -120px;top: 260px;"/>
<img class="shape layui-anim-rotate layui-anim-loop" th:src="@{/static/assets/images/shape2.png}"
xiaomayi-modules/xiaomayi-web/src/main/resources/templates/public/common_header.html
+11 -1
View File
@@ -1,4 +1,13 @@
<div th:fragment="common_header" class="ew-header">
<!-- 顶部公告横条 -->
<div th:fragment="common_header">
<div class="xm-top-bar">
<div class="xm-top-bar-inner">
<span class="xm-top-bar-tag">NEW</span>
<span class="xm-top-bar-text">DjangoAdmin 前后端分离框架全新升级，ElementPlus / AntDesign / NaiveUI 三版本齐发</span>
<a href="/index#product" class="xm-top-bar-link">了解详情 <span class="xm-top-bar-arrow">→</span></a>
</div>
</div>
<div class="ew-header">
<a class="layui-logo" href="/" style="letter-spacing: 1.5px;position: relative;">
<img th:src="@{/static/assets/images/logo.png}" style="width: 32px;height: 32px;position: absolute;top: 19px;left: 0;">
<span>DjangoAdmin</span>
@@ -74,4 +83,5 @@
<li th:if="${userInfo == null}" class="layui-nav-item nav-btn-login"><a href="/register">注册</a></li>
</ul>
</div>
</div>
</div>