|
|
|
|
@ -596,6 +596,134 @@ |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.rc-old .container-bars { |
|
|
|
|
position: relative; |
|
|
|
|
z-index: 2; |
|
|
|
|
|
|
|
|
|
display: none; |
|
|
|
|
visibility: hidden; |
|
|
|
|
overflow: hidden; |
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
|
margin: 5px 10px 0; |
|
|
|
|
|
|
|
|
|
transition: transform 0.4s ease, visibility 0.3s ease, opacity 0.3s ease; |
|
|
|
|
transform: translateY(-10px); |
|
|
|
|
|
|
|
|
|
opacity: 0; |
|
|
|
|
border-radius: var(--border-radius); |
|
|
|
|
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2), 0 2px 10px 0 rgba(0, 0, 0, 0.16); |
|
|
|
|
|
|
|
|
|
font-size: 1em; |
|
|
|
|
font-weight: bold; |
|
|
|
|
|
|
|
|
|
&.show { |
|
|
|
|
display: flex; |
|
|
|
|
visibility: visible; |
|
|
|
|
|
|
|
|
|
transform: translateY(0); |
|
|
|
|
|
|
|
|
|
opacity: 1; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
& > div { |
|
|
|
|
padding: 0 10px; |
|
|
|
|
|
|
|
|
|
line-height: 28px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
& .upload-progress { |
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
|
|
height: 28px; |
|
|
|
|
|
|
|
|
|
& .upload-progress-progress { |
|
|
|
|
position: absolute; |
|
|
|
|
z-index: 1; |
|
|
|
|
left: 0; |
|
|
|
|
|
|
|
|
|
width: 0%; |
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
transition: width, 1s, ease-out; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
& .upload-progress-text { |
|
|
|
|
z-index: 2; |
|
|
|
|
right: 0; |
|
|
|
|
left: 0; |
|
|
|
|
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
|
|
width: 50%; |
|
|
|
|
|
|
|
|
|
height: 100%; |
|
|
|
|
padding: 0 10px; |
|
|
|
|
|
|
|
|
|
white-space: nowrap; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
flex-grow: 1; |
|
|
|
|
|
|
|
|
|
& > a { |
|
|
|
|
float: right; |
|
|
|
|
|
|
|
|
|
cursor: pointer; |
|
|
|
|
text-transform: uppercase; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
& .upload-progress-close { |
|
|
|
|
position: relative; |
|
|
|
|
z-index: 3; |
|
|
|
|
|
|
|
|
|
float: right; |
|
|
|
|
|
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
|
|
font-weight: bold; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
& .unread-bar { |
|
|
|
|
text-align: center; |
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
|
|
& > button.mark-read { |
|
|
|
|
float: right; |
|
|
|
|
|
|
|
|
|
line-height: inherit; |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
cursor: pointer; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
& .unread-count { |
|
|
|
|
display: none; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
& > button.jump-to { |
|
|
|
|
float: left; |
|
|
|
|
|
|
|
|
|
line-height: inherit; |
|
|
|
|
|
|
|
|
|
& .jump-to-small { |
|
|
|
|
display: none; |
|
|
|
|
|
|
|
|
|
line-height: inherit; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
cursor: pointer; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.rc-old .flex-tab-main-content { |
|
|
|
|
position: relative; |
|
|
|
|
z-index: 1; |
|
|
|
|
|