mirror of
https://github.com/ZiuChen/ClipboardManager.git
synced 2025-09-27 05:43:21 +08:00
feat: 调整界面样式 增加动画效果
This commit is contained in:
@@ -3,16 +3,18 @@
|
||||
.clip-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border: 0px solid @bg-color;
|
||||
margin: 0px 5px;
|
||||
margin: 0px 2px;
|
||||
/* 占用px 但是不显示(与背景同色) */
|
||||
border-width: 1px 1px 1px 1px;
|
||||
border-color: @text-bg-color-lighter @bg-color @text-bg-color-lighter @bg-color;
|
||||
border-style: solid hidden hidden hidden;
|
||||
border-width: 1px 0px 0px 0px;
|
||||
border-color: @text-bg-color-lighter @bg-color @bg-color @bg-color;
|
||||
cursor: pointer;
|
||||
&.active {
|
||||
border: 0px solid @primary-color;
|
||||
border-width: 1px 1px 1px 1px;
|
||||
border-style: hidden hidden hidden solid;
|
||||
border-width: 1px 0px 0px 6px;
|
||||
border-color: @bg-color @bg-color @bg-color @primary-color;
|
||||
background-color: @text-bg-color-lighter;
|
||||
transition: all 0.15s;
|
||||
}
|
||||
.clip-info {
|
||||
display: flex;
|
||||
@@ -34,7 +36,7 @@
|
||||
background-color: @text-bg-color;
|
||||
border-radius: 5px;
|
||||
min-width: 50px;
|
||||
padding: 5px 10px 5px 10px;
|
||||
padding: 5px 7px 5px 7px;
|
||||
}
|
||||
}
|
||||
.clip-data {
|
||||
@@ -50,9 +52,7 @@
|
||||
// 此 class用于区分 file的 image
|
||||
max-height: 140px; // 比外框 max-height少一点 因为有 5px的边框
|
||||
max-width: 90%;
|
||||
padding: 5px;
|
||||
background-color: @bg-color;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0px 0px 3px @text-color;
|
||||
}
|
||||
.clip-data-status {
|
||||
position: absolute;
|
||||
@@ -60,11 +60,8 @@
|
||||
color: @text-color;
|
||||
background-color: @primary-color-lighter;
|
||||
border-radius: 5px;
|
||||
padding: 2px;
|
||||
padding: 5px;
|
||||
font-size: 13px;
|
||||
&.image {
|
||||
margin: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user