style: update magic-theme css
This commit is contained in:
parent
78edb2b978
commit
2406efdc5d
|
@ -1,4 +1,4 @@
|
||||||
<div class="article-content-container fade-in-down-animation">
|
<div class="article-content-container">
|
||||||
|
|
||||||
<div class="article-title">
|
<div class="article-title">
|
||||||
<h3><a class="title-hover-animation"><%= page.title %></a></h3>
|
<h3><a class="title-hover-animation"><%= page.title %></a></h3>
|
||||||
|
|
|
@ -12,7 +12,7 @@
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable') == true) {
|
||||||
magic-style(1.02);
|
magic-style(1.02, 1.02);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
|
|
||||||
position relative
|
position relative
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
magic-container(1.02, 20px);
|
magic-container(1.02, 1.02, 20px);
|
||||||
|
|
||||||
.category-label {
|
.category-label {
|
||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
|
|
||||||
position relative
|
position relative
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
magic-container(1.02, 20px);
|
magic-container(1.02, 1.02, 20px);
|
||||||
|
|
||||||
.tagcloud-label {
|
.tagcloud-label {
|
||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
position relative
|
position relative
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
magic-container(1.02, 20px);
|
magic-container(1.02, 1.02, 20px);
|
||||||
|
|
||||||
.tag-label {
|
.tag-label {
|
||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
|
|
|
@ -10,7 +10,7 @@
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable') && hexo-config('magic.sidebar.enable')) {
|
if (hexo-config('magic.enable') && hexo-config('magic.sidebar.enable')) {
|
||||||
magic-container(1.02, 20px);
|
magic-container(1.02, 1.02, 20px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-toc {
|
.post-toc {
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
magic-container(1.02, 20px);
|
magic-container(1.02, 1.02, 20px);
|
||||||
|
|
||||||
.justify-center {
|
.justify-center {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
@ -21,7 +21,7 @@ $li-margin-bottom = 12px;
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable') == true) {
|
||||||
magic-style(1.1);
|
magic-style(1.1, 1.1);
|
||||||
} else {
|
} else {
|
||||||
border: 1px solid var(--border-color);
|
border: 1px solid var(--border-color);
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
magic-container(1.01, 30px);
|
magic-container(1.005, 1.01, 30px);
|
||||||
|
|
||||||
.about-content {
|
.about-content {
|
||||||
|
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
.archive-container {
|
.archive-container {
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
magic-container(1.01, 30px);
|
magic-container(1.005, 1.01, 30px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -5,17 +5,8 @@
|
||||||
|
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable')) {
|
||||||
|
magic-container(1.008, 1.002, 30px);
|
||||||
box-shadow: 0 0 3px var(--border-color);
|
|
||||||
padding: 30px;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
border-radius: 2px;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
box-shadow: 0 0 8px var(--border-color);
|
|
||||||
transform: scaleX(1.008) scaleY(1.002);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -33,10 +24,12 @@
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.meta-info {
|
.meta-info {
|
||||||
margin: 10px 0 30px 0;
|
margin: 10px 0 30px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.article-content {
|
.article-content {
|
||||||
text-align: justify;
|
text-align: justify;
|
||||||
padding-bottom: 30px;
|
padding-bottom: 30px;
|
||||||
|
@ -76,7 +69,7 @@ if ((hexo-config('magic.enable') && !hexo-config('magic.sidebar.enable') && hexo
|
||||||
}
|
}
|
||||||
|
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable') == true) {
|
||||||
magic-container(1.02, 20px);
|
magic-container(1.02, 1.02, 20px);
|
||||||
} else {
|
} else {
|
||||||
transition();
|
transition();
|
||||||
border: 1px solid var(--border-color);
|
border: 1px solid var(--border-color);
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable')) {
|
if (hexo-config('magic.enable')) {
|
||||||
magic-container(1.02, 30px);
|
magic-container(1.02, 1.02, 30px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.category-name {
|
.category-name {
|
||||||
|
|
|
@ -59,7 +59,7 @@ button {
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable') == true) {
|
||||||
magic-style(1.1);
|
magic-style(1.1, 1.1);
|
||||||
} else {
|
} else {
|
||||||
border: 1px solid var(--border-color);
|
border: 1px solid var(--border-color);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
@require "animated.styl"
|
@require "animated.styl"
|
||||||
|
|
||||||
magic-style(scale) {
|
magic-style(scaleX, scaleY) {
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable') == true) {
|
||||||
|
|
||||||
box-shadow: 0 0 3px var(--border-color);
|
box-shadow: 0 0 3px var(--border-color);
|
||||||
|
@ -9,16 +9,14 @@ magic-style(scale) {
|
||||||
&:hover {
|
&:hover {
|
||||||
transition();
|
transition();
|
||||||
box-shadow: 0 0 8px var(--border-color);
|
box-shadow: 0 0 8px var(--border-color);
|
||||||
transform: scale(scale);
|
transform: scaleX(scaleX) scaleY(scaleY);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
magic-container(scale, padding) {
|
magic-container(scaleX, scaleY, padding) {
|
||||||
if (hexo-config('magic.enable') == true) {
|
magic-style(scaleX, scaleY);
|
||||||
magic-style(scale);
|
padding: padding;
|
||||||
padding: padding;
|
border-radius: 2px;
|
||||||
border-radius: 2px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -28,7 +28,6 @@ $component-interspace = 30px; // 组件/模块的间隔值(px)
|
||||||
$media-max-width = 760px; // 媒体查询最大宽度
|
$media-max-width = 760px; // 媒体查询最大宽度
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// ===============================
|
// ===============================
|
||||||
// z-index
|
// z-index
|
||||||
// ===============================
|
// ===============================
|
||||||
|
|
|
@ -11,7 +11,7 @@
|
||||||
|
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable') == true) {
|
||||||
|
|
||||||
magic-container(1.02, 30px);
|
magic-container(1.02, 1.02, 30px);
|
||||||
margin-bottom: $component-interspace;
|
margin-bottom: $component-interspace;
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
|
|
|
@ -100,7 +100,7 @@
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable') == true) {
|
if (hexo-config('magic.enable') == true) {
|
||||||
magic-style(1.1);
|
magic-style(1.1, 1.1);
|
||||||
} else {
|
} else {
|
||||||
border: 1px solid var(--third-text-color);
|
border: 1px solid var(--third-text-color);
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
background: var(--background-color);
|
background: var(--background-color);
|
||||||
|
|
||||||
if (hexo-config('magic.enable')) {
|
if (hexo-config('magic.enable')) {
|
||||||
magic-container(1.02, 30px);
|
magic-container(1.02, 1.02, 30px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.tag-name {
|
.tag-name {
|
||||||
|
|
Loading…
Reference in New Issue