From 936e54bd9612853c8758cecf1b5077708d8ef443 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@63.com>
Date: 星期四, 18 八月 2022 17:12:43 +0800
Subject: [PATCH] #
---
src/main/webapp/views/index.html | 17 ++++----
src/main/webapp/static/css/index.css | 95 +++++++++++++++++++++++++++++------------------
2 files changed, 67 insertions(+), 45 deletions(-)
diff --git a/src/main/webapp/static/css/index.css b/src/main/webapp/static/css/index.css
index 089ed6d..ff4b37e 100644
--- a/src/main/webapp/static/css/index.css
+++ b/src/main/webapp/static/css/index.css
@@ -5,54 +5,73 @@
html,body {
height: 100%;
}
-.nav {
- width: 100%;
- height: 90px;
- line-height: 90px;
- list-style: none;
- color: #fff;
- position: fixed;
- text-align: center;
- letter-spacing:3px;
-
-}
-.right {
- float: right;
- margin-right: 1%;
- margin-top: 1%;
-
-}
-#about {
- width: 47px;
- height: 47px;
- display: inline-block;
- background-image: url(../images/cancellation.png);
-}
.sidebar {
- width: 7%;
+ width: 8%;
height: 40%;
- line-height: 90px;
+ line-height: 5.625em;
position: fixed;
top: 50%;
transform: translateY(-50%);
-
-
}
-.sidebar ul {
+.nav ul {
+ font-size: 1.25em;
+ font-weight: 500;
+ padding-left: 5%;
+}
+.nav a {
+ position: relative;
+ text-decoration: none;
+ margin-left: 0.625em;
+ font-weight: 500;
+}
+.nav a:hover {
+ color: #fff;
+}
+/* Effect 4: bottom border enlarge */
+.cl-effect-4 a {
+ padding: 0 0 0.625em;
+}
+
+.cl-effect-4 a::after {
+ position: absolute;
+ top: 100%;
+ left: 0;
+ width: 100%;
+ height: 0.0625em;
+ background: #fff;
+ content: '';
+ opacity: 0;
+ -webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
+ -moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
+ transition: height 0.3s, opacity 0.3s, transform 0.3s;
+ -webkit-transform: translateY(-0.625em);
+ -moz-transform: translateY(-0.625em);
+ transform: translateY(-0.625em);
+}
+
+.cl-effect-4 a:hover::after,
+.cl-effect-4 a:focus::after {
+ height: 0.3125em;
+ opacity: 1;
+ -webkit-transform: translateY(0px);
+ -moz-transform: translateY(0px);
+ transform: translateY(0px);
+}
+/* Effect 4: bottom border enlarge */
+/* .sidebar ul {
font-size: 20px;
- font-weight: 5c00;
- padding-left: 15%;
+ font-weight: 500;
+ padding-left: 5%;
}
.sidebar a {
text-decoration: none;
- /*color: #cbcbcb;*/
}
.sidebar a:hover {
color: rgb(255, 148, 111);
-}
+} */
@@ -61,19 +80,19 @@
}
.nav-select {
font-weight: 900;
- color: rgb(255, 148, 111);
+ color: #fff;
}
-/* 涓讳綋 */
+/* 娑撹缍� */
iframe {
width: 100%;
height: 100%;
border-width: 0;
}
-/* 搴曢儴 */
+/* 鎼存洟鍎� */
footer {
/* border-top: 1px solid #e3e3e3; */
position: fixed;
@@ -84,11 +103,12 @@
font: 14px Helvetica Neue,Helvetica,PingFang SC,\5FAE\8F6F\96C5\9ED1,Tahoma,Arial,sans-serif;
box-shadow: 0 -1px 2px 0 rgba(0,0,0,.0);
box-sizing: border-box;
- background-color: rgba(255,255,255,.05);
+ background-color: rgb(108,167,168);
z-index: 999;
height: 20px;
font-size: 13px;
line-height: 20px;
+ background-color: #f1f1f1;
}
footer a {
color: #3573ab;
@@ -96,3 +116,6 @@
text-decoration: none;
cursor: pointer;
}
+
+
+
diff --git a/src/main/webapp/views/index.html b/src/main/webapp/views/index.html
index 3c4ebd6..a27a697 100644
--- a/src/main/webapp/views/index.html
+++ b/src/main/webapp/views/index.html
@@ -8,16 +8,15 @@
</head>
<body>
<!-- 瀵艰埅鏍� -->
-<!-- <div class="nav">-->
-<!-- <li class="right">娉ㄩ攢<a id="about" class="nav-unselect" onclick="logout()" href="#"></a></li>-->
-<!-- </div>-->
<div class="sidebar">
- <ul>
- <li><a id="console" onclick="nav(this.id)" class="nav-select" href="#">涓绘帶鍥�</a></li>
- <li><a id="pipeline" onclick="nav(this.id)" class="nav-unselect" href="#">杈撻�佽澶�</a></li>
- <li><a id="crn" onclick="nav(this.id)" class="nav-unselect" href="#">鍫嗗灈鏈�</a></li>
- <li><a id="car_vue" onclick="nav(this.id)" class="nav-unselect" href="#">绌挎杞�</a></li>
- </ul>
+ <div class="nav">
+ <ul class="cl-effect-4">
+ <li><a id="console" onclick="nav(this.id)" class="nav-select" href="#">1F涓绘帶鍥�</a></li>
+ <li><a id="console2F" onclick="nav(this.id)" class="nav-select" href="#">2F涓绘帶鍥�</a></li>
+ <li><a id="pipeline" onclick="nav(this.id)" class="nav-unselect" href="#">杈撻�佽澶�</a></li>
+ <li><a id="crn" onclick="nav(this.id)" class="nav-unselect" href="#">鍫嗗灈鏈�</a></li>
+ </ul>
+ </div>
</div>
<!-- 涓讳綋鍐呭 -->
<iframe id="content" src="console.html"></iframe>
--
Gitblit v1.9.1