diff --git a/source/less/_article.less b/source/less/_article.less index 977b07c..5181a21 100755 --- a/source/less/_article.less +++ b/source/less/_article.less @@ -43,7 +43,7 @@ margin-bottom: .6em; // text-align: justify; strong{ - color: @color_text_main; + // color: @color_text_main; // padding-left: 2px; // padding-right: 2px; } @@ -57,7 +57,7 @@ overflow: auto; .mjx-math{ font-family: @fontfamily_code; - background: fade(@theme_background, 50%); + background: @color_bg_mathjax; padding: @gap/2; border-radius: @border_radius_code_block; } @@ -321,7 +321,7 @@ font-size: @fontsize_small; line-height: @lineheight_base; margin-top: @gap; - background: darken(fade(@theme_background, 50%), 5%); + background: fade(darken(@theme_cardbg, 5%), 50%); &.article-tags { // padding-top: 2*@gap; // background: transparent; @@ -381,7 +381,7 @@ width: 100%; padding: @gap/2; color: fade(@color_text_main, 70%); - background-color: fade(@theme_background, 50%); + background-color: fade(darken(@theme_cardbg, 5%), 50%); border-radius: @border_radius; p{ font-size: @fontsize_base; @@ -438,6 +438,63 @@ } } + p btn { + a { + background: @color_text_link; + color: @color_text_in_header; + padding: 2px 5px 0px 5px; + margin: 2px; + border-radius: 2px; + .enable-trans(); + &:hover { + color: @color_text_in_header; + text-decoration: none; + background: @color_text_highlight; + } + } + &.small { + font-size: @fontsize_base * .9; + a { + padding: 2px 3px 0px 3px; + } + } + } + .large, .huge { + margin: 0; + } + .large { + font-size: 4em; + } + .huge { + font-size: 6em; + } + .bold { + font-weight: bold; + } + .left { + text-align: left; + } + .right { + text-align: right; + } + red, .red { + color: @color_mac_close; + } + green, .green { + color: @color_mac_maximize; + } + yellow, .yellow { + color: @color_mac_minimize; + } + blue, .blue { + color: @color_md_blue; + } + cyan, .cyan { + color: @color_mac_finder; + } + gray, .gray { + color: #AAA; + } } @@ -453,7 +510,7 @@ font-family:@fontfamily_code; line-height: @lineheight_base; border-radius: @border_radius_code_block; - border: 1px solid @color_border_code_block; + border: 1px solid darken(@theme_cardbg, 10%); .enable-trans(); figcaption{ padding: @gap/4 @gap/2; @@ -462,44 +519,45 @@ table{ td,th{ padding: 0; + border: none; } background-color: transparent; + border: none; tr{ + background-color: transparent; &:hover{ background-color: transparent; } } - } - .gutter{ - width: 24px; - padding: 0 12px; - text-align: right; - border-width: 0; - margin-left: 0; - background-color: darken(@color_bg_code_block, 3%); - pre{ - color: fade(@color_text_main, 80%); - } - &:hover{ - - } - } - .code{ - padding: @gap; - vertical-align: top; - border: 0px solid darken(@theme_background, 2%); - &:before{ - content: ""; - position: absolute; - top: 0; - right: 0; + .gutter{ + width: 24px; + padding: 0 12px; + text-align: right; + border-width: 0; + margin-left: 0; + background-color: darken(@color_bg_code_block, 3%); + pre{ color: fade(@color_text_main, 80%); - font-size: @fontsize_footnote; - padding: 4px 8px 0; - line-height: @lineheight_base; } + } + .code{ + padding: @gap; + vertical-align: top; + background-color: transparent; + &:before{ + content: ""; + position: absolute; + top: 0; + right: 0; + color: fade(@color_text_main, 80%); + font-size: @fontsize_footnote; + padding: 4px 8px 0; + line-height: @lineheight_base; + } + } } + &.html .code:before{ content: "HTML"; } diff --git a/source/less/_color.less b/source/less/_color.less index 9fc1d5e..c5b3b29 100755 --- a/source/less/_color.less +++ b/source/less/_color.less @@ -19,8 +19,9 @@ // 代码的背景色 @color_bg_code: #FFF8F0; // 代码块的背景色 -@color_bg_code_block: darken(@theme_cardbg, 2%); -@color_border_code_block: #ddd; +@color_bg_code_block: fade(darken(@theme_cardbg, 5%), 50%); +// 公式背景颜色 +@color_bg_mathjax: #FFF0; // 引用的颜色 @color_bg_quote: @theme_main; // 选中部分文字的背景颜色 diff --git a/source/less/_header.less b/source/less/_header.less index 392f4f5..b90faa1 100755 --- a/source/less/_header.less +++ b/source/less/_header.less @@ -206,7 +206,7 @@ padding-bottom: 8px; width: 100%; color: @color_text_main; - background: @theme_background; + background: fade(darken(@theme_cardbg, 5%), 75%); box-shadow: none; box-sizing: border-box; padding-left: @iconW + @iconMargin; diff --git a/source/less/_main.less b/source/less/_main.less index 4ca649e..25a9947 100755 --- a/source/less/_main.less +++ b/source/less/_main.less @@ -588,7 +588,7 @@ transform: translate(-50%,-50%); z-index: 99999; text-align: center; - padding: 24px 36px; + padding: 24px 36px 22px 36px; border-radius: @border_radius_code_block; box-shadow: @boxshadow_card_normal; font-family: @fontfamily_base; diff --git a/source/less/_normalize.less b/source/less/_normalize.less index 5270dd8..5bbbd7e 100755 --- a/source/less/_normalize.less +++ b/source/less/_normalize.less @@ -422,20 +422,21 @@ optgroup { table { border-collapse: collapse; width: 100%; - background-color: @theme_cardbg; + border: 2px solid darken(@theme_cardbg, 10%); th { - background-color: darken(@theme_cardbg, 5%); + background-color: fade(darken(@theme_cardbg, 12%), 50%); } td, th { text-align: justify; padding: 4px 8px; - border: 1px solid @theme_background; + border: 1px solid darken(@theme_cardbg, 10%); } tr { - // border-bottom: 2px solid #eee; + background-color: fade(darken(@theme_cardbg, 2%), 50%); + } + tbody>tr { .enable-trans(); - background-color: @theme_cardbg; &:hover{ background-color: darken(@theme_cardbg, 5%); } diff --git a/source/less/_side.less b/source/less/_side.less index 1ee3f17..a69c05a 100755 --- a/source/less/_side.less +++ b/source/less/_side.less @@ -322,6 +322,8 @@ flex-wrap: wrap; align-items: center; justify-content: space-around; + padding-left: @gap/2; + padding-right: @gap/2; img{ margin-bottom: 4px; }