You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
165 lines
2.9 KiB
165 lines
2.9 KiB
/** |
|
* 基础样式 |
|
* @author couy(couy69@gmail.com) |
|
*/ |
|
|
|
* { |
|
padding: 0; |
|
margin: 0; |
|
outline: 0; |
|
box-sizing: border-box !important; |
|
} |
|
|
|
li { |
|
list-style: none; |
|
} |
|
|
|
a { |
|
text-decoration: none; |
|
} |
|
|
|
i { |
|
font-style: normal; |
|
} |
|
|
|
html, |
|
body { |
|
width: 100%; |
|
height: 100%; |
|
overflow: hidden !important; |
|
font-size: 14px; |
|
} |
|
|
|
@font-face { |
|
font-family: 'sarasa'; |
|
src: url('../fonts/sarasa-ui-cl-regular.ttf') format('truetype'); |
|
font-weight: normal; |
|
font-style: normal; |
|
} |
|
@font-face { |
|
font-family: 'JetBrainsMono'; |
|
src: url('../fonts/JetBrainsMono-Regular.ttf') format('truetype'); |
|
font-weight: normal; |
|
font-style: normal; |
|
} |
|
#app { |
|
font-family: 'NotoSansSC', 'Noto Sans', 'Source Sans Pro', 'Avenir', Helvetica, Arial, sans-serif !important; |
|
} |
|
div, |
|
button, |
|
span, |
|
p, |
|
h1, |
|
h2, |
|
h3, |
|
h4, |
|
h5, |
|
b, |
|
input, |
|
textarea { |
|
font-family: 'sarasa', 'JetBrainsMono', 'NotoSansSC', 'Noto Sans', 'Source Sans Pro', 'Avenir', Helvetica, Arial, sans-serif !important; |
|
} |
|
|
|
input, |
|
textarea { |
|
border: 1px solid #ccc; |
|
border-radius: 4px; |
|
padding: 0.4rem; |
|
font-size: 1rem; |
|
background-color: #e0e8ea; |
|
} |
|
|
|
button { |
|
height: 2.4rem; |
|
line-height: 2.2rem; |
|
padding: 0 1rem; |
|
margin-left: 0.5rem; |
|
margin-right: 0.5rem; |
|
cursor: pointer; |
|
color: #fff; |
|
background: #000; |
|
border: 1px solid #fff; |
|
border-radius: 4px; |
|
width: fit-content; |
|
&:hover { |
|
// background: #222; |
|
border: 1px solid #ccc; |
|
text-shadow: 1px 1px 3px #ccc; |
|
} |
|
} |
|
|
|
/*使用选择器指定字体*/ |
|
.panel-title { |
|
font-family: 'MaShanZheng' !important; |
|
display: flex; |
|
align-items: center !important; |
|
justify-content: center; |
|
font-size: 0.22rem; |
|
padding: 0.2rem 0.1rem; |
|
color: #efb96e; |
|
} |
|
|
|
/* 滚动条 */ |
|
::-webkit-scrollbar-thumb:horizontal { |
|
/*水平滚动条的样式*/ |
|
width: 5px; |
|
background-color: #999; |
|
border-radius: 6px; |
|
} |
|
|
|
::-webkit-scrollbar-track-piece { |
|
background-color: transparent; |
|
/*滚动条的背景颜色*/ |
|
border-radius: 0; |
|
/*滚动条的圆角宽度*/ |
|
} |
|
|
|
::-webkit-scrollbar { |
|
width: 8px; |
|
/*滚动条的宽度*/ |
|
height: 8px; |
|
/*滚动条的高度*/ |
|
} |
|
|
|
::-webkit-scrollbar-thumb:vertical { |
|
/*垂直滚动条的样式*/ |
|
height: 20px; |
|
background-color: #999; |
|
border-radius: 4px; |
|
outline: 2px solid transparent; |
|
outline-offset: -2px; |
|
border: 2px solid transparent; |
|
} |
|
|
|
::-webkit-scrollbar-thumb:hover { |
|
/*滚动条的hover样式*/ |
|
height: 20px; |
|
background-color: #9f9f9f; |
|
border-radius: 4px; |
|
} |
|
|
|
.unique { |
|
background: linear-gradient(125deg, #c90e0d36, #5656d647, 40%, #867d1033, #2c846f4d) !important; |
|
} |
|
|
|
.fade-enter-active, |
|
.fade-leave-active { |
|
transition: 0.3s; |
|
} |
|
|
|
.fade-enter, |
|
.fade-leave-to { |
|
transform: translateX(100%); |
|
} |
|
.icon { |
|
display: inline-block; |
|
width: 0.25rem; |
|
height: 0.25rem; |
|
background-repeat: no-repeat; |
|
background-size: contain; |
|
padding: 2px; |
|
background-position: center; |
|
} |
|
.icon-setting { |
|
background-image: url(../icons/menu/setting.png); |
|
}
|
|
|