Template:Top-card/style.css
阅读:66 更新:2023-5-4
来自柯南百科
.top-card {
padding: 12px 20px;
padding-bottom: 50px;
border: 1px solid #dcdcdc;
border-radius: 20px;
background-color: #fcfcfc;
box-shadow: 0 0 2px #ccc;
transition: box-shadow .5s cubic-bezier(0.22, 0.61, 0.36, 1);
color: #464646;
position: relative;
}
.top-card:hover {
box-shadow: 0 0 5px #bbb;
}
.border-wrap {
display: inline-block;
position: relative;
padding-bottom: 3.5px;
}
.wrap-green {
background: linear-gradient(to right, #64c172, rgba(169, 248, 188, 0.678), rgba(255, 255, 255, 0));
}
.wrap-blue {
background: linear-gradient(to right, #6a6cc7, rgba(97, 184, 221, 0.678), rgba(255, 255, 255, 0));
}
.wrap-red {
background: linear-gradient(to right, #e34e4e, rgba(199, 119, 119, 0.678), rgba(255, 255, 255, 0));
}
.wrap-yellow {
background: linear-gradient(to right, #ff8000, rgba(255, 80, 0, 0.37), rgba(255, 255, 255, 0));
}
.wrap-purple {
background: linear-gradient(to right, #a24b9d, rgba(179, 133, 177, 0.678), rgba(255, 255, 255, 0));
}
.wrap-black {
background: linear-gradient(to right, #2b2b2b, rgba(110, 110, 110, 0.678), rgba(255, 255, 255, 0));
}
.top-card-title {
display: inline-block;
padding-left: 2px;
background-color: #fcfcfc;
font-weight: bolder;
font-weight: 900;
font-size: 1.2em;
letter-spacing: 5px;
-webkit-user-select: none;
user-select: none;
}
.top-card-link {
height: 18px;
width: 21px;
line-height: 1em;
font-size: 1.2em;
overflow: hidden;
-webkit-user-select: none;
user-select: none;
position: absolute;
right: 18px;
top: 18px;
}
.top-card-link a {
color: #45494d;
text-decoration: none;
transition: all .3s linear;
}
.top-card-link a:hover {
color: #858585;
}
.top-card-content {
margin-top: 5px;
}
@media{
.top-card {
border: 1px solid #3c3c3c;
background-color: #313131;
box-shadow: 0 0 2px #5d5d5d;
color: #c4c4c4;
}
.top-card:hover {
box-shadow: 0 0 5px #535353;
}
.top-card-title {
background-color: #313131;
}
}