Skip to content

Commit

Permalink
fix: revise the color scheme
Browse files Browse the repository at this point in the history
  • Loading branch information
atsuyaw committed Nov 12, 2023
1 parent 96d2780 commit cafcacc
Show file tree
Hide file tree
Showing 7 changed files with 66 additions and 36 deletions.
21 changes: 13 additions & 8 deletions v4/assets/sass/_articles.scss
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ article {
content: "";
display: block;
border: 11px solid transparent;
border-right-color: #ddd;
border-right-color: $con-line-colorB;
position: absolute;
top: 49px;
left: -22px;
Expand All @@ -21,7 +21,7 @@ article {
content: "";
display: block;
border: 10px solid transparent;
border-right-color: #fff;
border-right-color: #con-line-colorA;
position: absolute;
top: 50px;
left: -20px;
Expand Down Expand Up @@ -151,7 +151,7 @@ article {
margin-top: 1.25em;

li {
border-bottom: 1px solid #eee;
border-bottom: 1px solid $footer-border-color;
padding-right: 10px;
}

Expand All @@ -170,19 +170,23 @@ article {

&:hover {
left: 10px;
color: $base-color;
color: $text-color;
text-decoration: none;
}
}
}
}
code {
background-color: rgba(150,150,160,0.2);
border: none;
}

blockquote {
background-color: #f6f6f6;
background-color: $blockquote-background-color;
font-family: $headline-font;
margin: 1.5em 0;
padding: 2em;
border-left: 0.5em solid #ededed;
border-left: 0.5em solid rgba(invert($blockquote-background-color),0.2);
font-size: 1.05em;

cite {
Expand Down Expand Up @@ -226,15 +230,15 @@ article {

li {
display: inherit;
color: $text-color;
color: $highlight-color;

a {
color: inherit;
text-align: left;
padding: 0;

&:hover {
color: $highlight-color;
color: $text-color;
background-color: transparent;
}
}
Expand Down Expand Up @@ -478,4 +482,5 @@ article {
#comments-container {
margin-left: 100px;
padding-bottom: 1.2em;
color: #fff;
}
15 changes: 10 additions & 5 deletions v4/assets/sass/_footer.scss
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,15 @@ footer {
text-transform: uppercase;
color: $footer-headline-color;
padding-bottom: 0.75em;
display: block;
}

a {
strong{
&:hover {
color: $highlight-color;
}
}
}

ul {
Expand All @@ -45,7 +54,7 @@ footer {

&:hover {
left: 10px;
color: $base-color;
color: $text-color;
}
}
}
Expand Down Expand Up @@ -113,10 +122,6 @@ footer {
width: 100%;
margin-left: 0;
}

strong {
display: block;
}
}
}
}
Expand Down
27 changes: 18 additions & 9 deletions v4/assets/sass/_header.scss
Original file line number Diff line number Diff line change
Expand Up @@ -95,15 +95,18 @@ header {
display: flex;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
button {
margin-top: 0;
margin-bottom: 0;
padding: 0.375em 0.75em;
font-size: 1.125em;
min-width: 2em;
border: transparent;
color: $header-text-color;
}
button {
margin-top: 0;
margin-bottom: 0;
padding: 0.375em 0.75em;
font-size: 1.125em;
min-width: 2em;
border: transparent;
color: $header-text-color;
&:hover {
color: $highlight-color;
}
}
}
.languages {
background-color: $special-color;
Expand All @@ -126,6 +129,9 @@ header {
content: " | ";
color: inherit;
}
&:hover {
color: $highlight-color;
}
}
}
}
Expand All @@ -144,5 +150,8 @@ header {
&.permanentTopNav {
display: none;
}
&:hover {
color: $highlight-color;
}
}
}
4 changes: 2 additions & 2 deletions v4/assets/sass/_main.scss
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
bottom: 50px;
width: 2px;
height: 100%;
background: rgba($logo-color, 0.1);
background: $con-line-colorA;
z-index: 1;
}

Expand All @@ -22,7 +22,7 @@
bottom: 32px;
height: 20px;
width: 20px;
background: darken($bubble-color,1);
background: $con-line-colorB;
border-radius: 999px;
z-index: 10;
}
Expand Down
21 changes: 13 additions & 8 deletions v4/assets/sass/_topnav.scss
Original file line number Diff line number Diff line change
Expand Up @@ -119,12 +119,17 @@ nav {
font-size: 0.75em;
text-align: right;
padding: 0.5em 1em;
background-color: $page-background-color;
border-radius: 0.5em;
background-color: rgba($page-background-color,0.6);

img {
width: 3.5em;
position: relative;
top: 0.1em;
// top: 0.1em;
display: inline-block;
vertical-align: middle;
padding: 0.5em;
background: rgba(#fff,0.5);
}
}
}
Expand All @@ -138,7 +143,7 @@ nav {

&:hover,
&:focus {
background-color: darken($algolia-search-box-background-color, 2);
background-color: darken($algolia-search-box-background-color, 5);
}

.title {
Expand Down Expand Up @@ -197,8 +202,8 @@ nav {
}

.aa-dropdown-menu {
background-color: #fff;
border: 1px solid rgba($algolia-border-color, 0.6);
background-color: $algolia-search-box-background-color;
border: 1px solid rgba($algolia-border-color, 0.2);
min-width: 300px;
margin-top: 10px;
box-sizing: border-box;
Expand All @@ -210,12 +215,12 @@ nav {
}

.aa-suggestion + .aa-suggestion {
border-top: 1px solid rgba($algolia-border-color, 0.6);
border-top: 1px solid rgba($algolia-border-color, 0.2);
}

.aa-suggestions-category {
border-bottom: 1px solid rgba($algolia-border-color, 0.6);
border-top: 1px solid rgba($algolia-border-color, 0.6);
border-bottom: 1px solid rgba($algolia-border-color, 0.2);
border-top: 1px solid rgba($algolia-border-color, 0.2);
padding: 6px 12px;
}
}
Expand Down
11 changes: 7 additions & 4 deletions v4/assets/sass/dark-theme.scss
Original file line number Diff line number Diff line change
Expand Up @@ -14,26 +14,29 @@ $base-color: {{ .Param "baseColor" | default "#1d1f38" }};
$special-color: {{ .Param "specialColor" | default "#2D3642" }};
$highlight-color: {{ .Param "highlightColor" | default "saturate(#5c8b59,20)" }};
$text-color: {{ .Param "textColor" | default "darken(invert(#222), 20)" }};
$blockquote-background-color: {{ .Param "blockquoteBackgroundColor" | default "rgba(99,110,110,0.2)" }};

$nav-background-color: {{ .Param "navBackgroundColor" | default "$special-color" }};
$nav-text-color: {{ .Param "navTextColor" | default "darken(#f1f1f1,20)" }};
$algolia-search-box-color: {{ .Param "algoliaSearchBoxColor" | default "#444" }};
$algolia-search-box-color: {{ .Param "algoliaSearchBoxColor" | default "$nav-text-color" }};
$algolia-search-box-icon-color: {{ .Param "algoliaSearchBoxIconColor" | default "#888" }};
$algolia-search-box-background-color: {{ .Param "algoliaSearchBoxBackgroundColor" | default "#fafafa" }};
$algolia-search-box-background-color: {{ .Param "algoliaSearchBoxBackgroundColor" | default "#222" }};
$algolia-border-color: {{ .Param "algoliaBorderColor" | default "#e4e4e4" }};

$header-text-color: {{ .Param "headerTextColor" | default "$nav-text-color" }};
$logo-color: {{ .Param "logoColor" | default "darken(#f1f1f1, 60)" }};
$bubble-color: {{ .Param "bubbleColor" | default "$logo-color" }};
$bubble-background-color: {{ .Param "bubbleBackgroundColor" | default "#373737" }};
$bubble-hover-color: {{ .Param "bubbleHoverColor" | default "$highlight-color" }};
$con-line-colorA: {{ .Param "conLineColorA" | default "rgba(invert(#000),0.05)" }};
$con-line-colorB: {{ .Param "conLineColorB" | default "#444" }};

$article-background-color: {{ .Param "articleBackgroundColor" | default "#252525" }};
$meta-text-color: {{ .Param "metaTextColor" | default "invert(#999)" }};
$meta-text-color: {{ .Param "metaTextColor" | default "darken(#f1f1f1,40)" }};
$meta-border-color: {{ .Param "metaBorderColor" | default "#545454" }};
$continue-reading-hover-color: {{ .Param "continueReadingHoverColor" | default "$meta-text-color" }};

$footer-border-color: {{ .Param "footerBorderColor" | default "#222" }};
$footer-border-color: {{ .Param "footerBorderColor" | default "#444" }};
$footer-background-color: {{ .Param "footerBackgroundColor" | default "invert(rgba(#ffffff, 80))" }};
$footer-headline-color: {{ .Param "footerHeadlineColor" | default "darken(invert(#444),5)" }};

Expand Down
3 changes: 3 additions & 0 deletions v4/assets/sass/theme.scss
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ $base-color: {{ .Param "baseColor" | default "#1d1f38" }};
$special-color: {{ .Param "specialColor" | default "#2D3642" }};
$highlight-color: {{ .Param "highlightColor" | default "#5c8b59" }};
$text-color: {{ .Param "textColor" | default "#222" }};
$blockquote-background-color: {{ .Param "blockquoteBackgroundColor" | default "#f6f6f6" }};

$nav-background-color: {{ .Param "navBackgroundColor" | default "$special-color" }};
$nav-text-color: {{ .Param "navTextColor" | default "$page-background-color" }};
Expand All @@ -27,6 +28,8 @@ $logo-color: {{ .Param "logoColor" | default "darken($page-background-color, 1)"
$bubble-color: {{ .Param "bubbleColor" | default "#fff" }};
$bubble-background-color: {{ .Param "bubbleBackgroundColor" | default "#ccc" }};
$bubble-hover-color: {{ .Param "bubbleHoverColor" | default "$highlight-color" }};
$con-line-colorA: {{ .Param "conLineColorA" | default "rgba(#000,0.05)" }};
$con-line-colorB: {{ .Param "conLineColorB" | default "#ddd" }};

$article-background-color: {{ .Param "articleBackgroundColor" | default "#fff" }};
$meta-text-color: {{ .Param "metaTextColor" | default "#999" }};
Expand Down

0 comments on commit cafcacc

Please sign in to comment.