From d3f92144c6e4781fa4882f5fbf3525698663d92f Mon Sep 17 00:00:00 2001
From: inleft <inleft@qq.com>
Date: Thu, 13 Jan 2022 01:51:03 +0800
Subject: [PATCH] 二次优化界面
---
src/components/layouts/box4.vue | 35 +++++++++++++++++++++++++----------
1 files changed, 25 insertions(+), 10 deletions(-)
diff --git a/src/components/layouts/box4.vue b/src/components/layouts/box4.vue
index a71c999..cf8763e 100644
--- a/src/components/layouts/box4.vue
+++ b/src/components/layouts/box4.vue
@@ -1,10 +1,10 @@
<template>
- <div class="blog-right-side-container">
+ <div class="blog-container ">
<div>
- <span class="blog-right-side-portion-title">{{title}}</span>
+ <span class="blog-right-side-portion-title title-remark">{{title}}</span>
</div>
- <div class="blog-right-side-scroll-portion">
- <div class="blog-right-side-meta" v-for="item in list">
+ <div class="blog-scroll show-line">
+ <div class="blog-right-side-meta " v-for="item in list">
<div>
<a href="#"> <span class="blog-display-hide-content">{{item.name}}</span></a>
</div>
@@ -22,7 +22,7 @@
},
data() {
return {
-
+
}
}
}
@@ -32,11 +32,26 @@
<style lang="less">
/*右边的部分*/
+
+ .blog-right-side-portion-title {
+ display: block;
+ font-size: 15px;
+ padding-bottom: 8px;
+
+ }
+
+ span.title-remark::after {
+ content: "(按字母索引)";
+ color: #999;
+ font-size: 10px;
+ }
+
.blog-right-side-meta span {
/*word-break: keep-all;*/
/*word-wrap: break-word;*/
color: #999;
font-size: 13px;
+ line-height: 17px;
display: block;
overflow: hidden;
text-overflow: ellipsis;
@@ -45,14 +60,14 @@
/* normal文本换行*/
word-break: keep-all;
- transition-property: background-color;
- transition-duration: .2s;
- transition-timing-function: ease-in-out;
- transition-delay: 0s;
+ // transition-property: background-color;
+ // transition-duration: .2s;
+ // transition-timing-function: ease-in-out;
+ // transition-delay: 0s;
}
div .blog-right-side-meta a span:hover {
- background: #5FB878;
+ background: #262a30;;
color: #fff;
white-space: normal;
word-break: break-word;
--
Gitblit v1.9.1