bookmark/css/app.css
caojiezi2003 883a42fa3b 更新为构建的静态文件
更改为静态文件,以便于在Cloudflare的Pages直接部署。
2023-10-25 14:31:21 +08:00

448 lines
8.8 KiB
CSS

.my-dialog[data-v-1232f72c] {
background: red
}
.my-dialog[data-v-1232f72c] .el-dialog__header {
border-bottom: 1px solid #eee !important
}
.my-dialog[data-v-1232f72c] .el-dialog__title {
font-size: 16px;
color: #e03b5d
}
.bg[data-v-08a9f3f2] {
z-index: -999;
position: fixed;
height: 100%;
width: 100%;
background: url(../img/bg.jpg)
}
.my-dialog[data-v-32ee5f5a] {
background: red
}
.my-dialog[data-v-32ee5f5a] .el-dialog__header {
border-bottom: 1px solid #eee !important
}
.my-dialog[data-v-32ee5f5a] .el-dialog__title {
font-size: 16px;
color: #e03b5d
}
.my-dialog[data-v-6f880459] {
background: red
}
.my-dialog[data-v-6f880459] .el-dialog__header {
border-bottom: 1px solid #eee !important
}
.my-dialog[data-v-6f880459] .el-dialog__title {
font-size: 16px;
color: #e03b5d
}
.granim-box[data-v-6f880459] {
height: 240px;
width: 100%;
border-radius: 12px;
overflow: hidden
}
.granim-box canvas[data-v-6f880459] {
height: 100%;
width: 100%;
-o-object-fit: cover;
object-fit: cover
}
.slelec[data-v-6f880459] {
height: 40px;
line-height: 40px
}
.opacity[data-v-6f880459] .el-form-item__content {
display: flex;
align-items: center
}
.opacity[data-v-6f880459] .el-form-item__content .el-input:first-child {
margin-right: 8px
}
#file[data-v-6f880459] {
height: 32px;
line-height: 16px
}
input[type=text][data-v-6f880459] {
color: red
}
#app[data-v-58ce68a6] {
position: relative;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
width: 100vw;
overflow: hidden
}
.bookmark[data-v-58ce68a6] {
position: relative;
margin-top: 8vh;
width: 1200px;
height: 75vh;
border: 1px solid hsla(0, 0%, 100%, .18);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, .2);
border-radius: 6px;
background: var(--35139428);
opacity: var(--1e5ee377)
}
.bookmark .left-box[data-v-58ce68a6] {
width: 200px;
height: 100%;
border: 1px solid hsla(0, 0%, 100%, .18);
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, .2);
position: relative;
padding: 8px 0
}
.bookmark .left-box img[data-v-58ce68a6] {
width: 20px;
height: auto;
margin-right: 5px;
cursor: pointer
}
.bookmark .left-box .active[data-v-58ce68a6] {
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, .2);
background: var(--88b6866a)
}
.bookmark .left-box .inactive[data-v-58ce68a6] {
box-shadow: none;
background: var(--35139428)
}
.bookmark .left-box .label[data-v-58ce68a6] {
font-size: 14px;
display: flex;
cursor: pointer;
border: none;
position: relative;
padding: 10px 15px
}
.bookmark .left-box .label[data-v-58ce68a6]:hover {
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, .2);
background: var(--88b6866a)
}
.bookmark .left-box .label .text-elipss[data-v-58ce68a6] {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.bookmark .right-box[data-v-58ce68a6] {
width: calc(100% - 200px)
}
.bookmark .right-box .card-s[data-v-58ce68a6] {
width: 100%;
padding-top: 10px;
max-height: calc(80vh - 49px);
display: flex;
flex-wrap: wrap;
overflow-x: hidden;
overflow-y: auto
}
.bookmark .right-box .card-s .card-item[data-v-58ce68a6] {
cursor: pointer;
width: calc(33% - 40px);
display: flex;
justify-content: flex-start;
align-items: center;
border: 1px solid hsla(0, 0%, 100%, .18);
box-shadow: 0 8px 18px 0 rgba(31, 38, 135, .2);
padding: 10px;
margin: 7px 20px 7px 20px;
position: relative;
border-radius: 8px;
max-height: 200px;
height: 72px !important
}
.bookmark .right-box .card-s .card-item[data-v-58ce68a6]:hover {
transform: scale(1.04);
animation-delay: .3ms;
animation: .3ms;
box-shadow: 0 8px 18px 0 rgba(31, 38, 135, .3);
background: var(--88b6866a)
}
.bookmark .right-box .card-s .card-item:hover .logo-box-tools[data-v-58ce68a6] {
opacity: .85
}
.tool-icon[data-v-58ce68a6] {
width: 20px;
height: 20px;
-o-object-fit: contain;
object-fit: contain;
display: inline-block;
margin-right: 12px;
cursor: pointer
}
.tool-icon[data-v-58ce68a6]:hover {
fill: "#3eaf7c"
}
.tool-bar[data-v-58ce68a6] {
height: 48px;
border-bottom: 1px solid var(--26f10f65);
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
background: var(--35139428)
}
.tool-bar .tool-logo[data-v-58ce68a6] {
margin: 0 15px
}
.tool-bar .tool-logo a[data-v-58ce68a6] {
color: #e03b5d;
display: flex;
align-items: center
}
.tool-bar .search-box[data-v-58ce68a6] {
display: inline-block;
position: relative;
margin-right: 1rem;
white-space: nowrap
}
.tool-bar .search-box img[data-v-58ce68a6] {
position: absolute;
top: 0;
bottom: 0;
z-index: 0;
left: .6rem;
margin: auto;
width: 20px;
height: auto
}
.tool-bar .search-box input[data-v-58ce68a6] {
text-align: initial;
text-indent: 0;
text-shadow: none;
text-transform: none;
word-spacing: normal;
letter-spacing: normal;
cursor: text;
width: 14rem;
height: 2rem;
color: #4e6e8e;
display: inline-block;
border: 1px solid var(--26f10f65);
border-radius: .25rem;
font-size: .9rem;
line-height: 2rem;
padding: 0 .5rem 0 2rem;
outline: none;
transition: all .2s ease;
background: transparent;
background-size: auto;
background-size: 1rem
}
[data-v-58ce68a6]::-webkit-scrollbar-thumb {
background-color: var(--5c838562);
background-clip: padding-box;
min-height: 28px;
border-radius: 10px
}
.box-m[data-v-58ce68a6] {
display: flex;
height: calc(100% - 50px)
}
.logo-img[data-v-58ce68a6] {
width: 62px;
height: 100%;
margin-right: 10px;
filter: drop-shadow(0 0 1px #888)
}
.logo-img img[data-v-58ce68a6] {
height: 100%;
width: 100%;
-o-object-fit: contain;
object-fit: contain;
display: block;
max-width: 70px;
width: 62px
}
.logo-box[data-v-58ce68a6] {
position: relative;
flex: 1
}
.logo-box .title[data-v-58ce68a6] {
max-width: 145px;
padding-top: 3px;
font-size: 16px;
font-weight: 700
}
.logo-box .subtitle[data-v-58ce68a6],
.logo-box .title[data-v-58ce68a6] {
width: 100%;
color: var(--1082daf8);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: block
}
.logo-box .subtitle[data-v-58ce68a6] {
position: relative;
max-width: 185px;
margin-top: 5px;
font-size: 13px;
opacity: .8
}
.list-complete-item[data-v-58ce68a6] {
transition: all .8s ease;
display: inline-block;
margin-right: 10px
}
.list-complete-enter-from[data-v-58ce68a6],
.list-complete-leave-to[data-v-58ce68a6] {
opacity: 0;
transform: translateY(30px)
}
.list-complete-leave-active[data-v-58ce68a6] {
position: absolute
}
.card-item-nodata[data-v-58ce68a6] {
height: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center
}
.card-item-nodata span[data-v-58ce68a6] {
display: block;
margin-top: 20px;
color: #999
}
.logo-box-tools[data-v-58ce68a6] {
position: absolute;
right: 0;
top: 0;
opacity: 0;
transition: opacity .4s
}
.logo-box-tools i[data-v-58ce68a6] {
padding: 4px;
display: inline-block
}
.logo-box-tools i[data-v-58ce68a6]:hover {
color: #e03b5d;
background: rgba(255, 0, 0, .12156862745098039);
border-radius: 5px
}
.import-tool[data-v-58ce68a6] {
position: absolute;
width: 100%;
background: var(--35139428);
height: 36px;
padding: 3px 10px;
display: flex;
align-items: center;
bottom: 0;
z-index: 99;
border-top: 1px solid var(--26f10f65)
}
.import-tool i[data-v-58ce68a6] {
font-size: 15px;
margin: 1px 2px;
padding: 3px;
cursor: pointer;
color: #e03b5d;
background: rgba(255, 0, 0, .12156862745098039);
border-radius: 5px;
opacity: .7
}
.import-tool i[data-v-58ce68a6]:hover {
color: #e03b5d;
background: rgba(200, 4, 4, .12156862745098039);
opacity: 1
}
.left-box-item[data-v-58ce68a6] {
height: 100%;
overflow-y: auto;
padding-bottom: 40px
}
.import-text[data-v-58ce68a6] {
font-size: 12px;
color: #999;
margin-right: 3px
}
.el-icon-upload2[data-v-58ce68a6] {
position: relative
}
.el-icon-upload2 input[data-v-58ce68a6] {
width: 1.46rem;
height: 100%;
z-index: 1;
opacity: 0;
position: absolute;
cursor: pointer
}
.login-status[data-v-58ce68a6] {
display: inline-block;
font-size: 12px;
padding-right: 8px;
color: #999;
cursor: pointer
}
.login-s .tool-icon[data-v-58ce68a6] {
margin-right: 5px
}
.login-s:hover .login-status[data-v-58ce68a6] {
color: #e03b5d
}