hexo-theme-keep/source/css/layout/common/basic.styl

116 lines
2.1 KiB
Stylus

@require 'variables.styl'
@require 'animated.styl'
@require 'magic-theme.styl'
// ============================
// scrollbar
// ============================
* {
&::-webkit-scrollbar {
width: 6px;
height: 6px;
}
&::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.32);
}
&::-webkit-scrollbar-track {
background: transparent;
}
}
// ============================
// html, body
// ============================
html, body {
margin: 0;
padding: 0;
color: var(--normal-text-color);
background: var(--background-color);
font-family: $default-font-family;
font-weight: $default-font-weight;
font-size: $default-font-size;
line-height: $default-font-line-height;
+ils-tablet() {
//font-size: 0.99em;
//line-height: $default-font-line-height - 2px;
font-size: $default-font-size * 0.95;
line-height: $default-font-line-height * 0.95;
}
+ils-mobile() {
//font-size: 0.98em;
//line-height: $default-font-line-height - 4px;
font-size: $default-font-size * 0.9;
line-height: $default-font-line-height * 0.9;
}
}
// ============================
// selection
// ============================
::selection {
background: var(--selection-color);
color: #fff;
}
// ============================
// ul, ol, li
// ============================
ul, ol, li {
padding: 0;
margin: 0;
list-style: none;
}
// ============================
// a
// ============================
a {
text-decoration: none;
color: var(--normal-text-color);
&:hover, &:active {
color: var(--primary-color);
}
}
// ============================
// button
// ============================
button {
padding: 0;
margin: 0;
border: 0;
outline: none;
cursor: pointer;
background: transparent;
}
.btn {
display: inline-block;
position: relative;
text-align: center;
cursor: pointer;
white-space: nowrap;
border-radius: 5px;
padding: 0.5em 1em;
background: var(--background-color);
hover-style(1.1, 1.1);
&:hover {
transition();
color: var(--background-color);
background: var(--primary-color);
}
}