Merge pull request #35 from bmf-san/feature/update-design

Update design
bmf-san · May 21, 2022 · 0d5cdc7 · 0d5cdc7
2 parents 1c6a362 + 4e5705e
commit 0d5cdc7
Show file tree

Hide file tree

Showing 9 changed files with 22 additions and 18 deletions.
diff --git a/dist/sea.min.css b/dist/sea.min.css
diff --git a/docs/dist/sea.min.css b/docs/dist/sea.min.css
diff --git a/docs/top.html b/docs/top.html
@@ -142,8 +142,6 @@ <h1>Sticky footer</h1>
 			<div class="row text-align-center">
 				<div class="col">
 					<a class="color-text-reverse" href="#">RSS</a>
-				</div>
-				<div class="col">
 					<a class="color-text-reverse" href="#">Feed</a>
 				</div>
 			</div>

diff --git a/src/base/_container.css b/src/base/_container.css
@@ -2,7 +2,7 @@
   flex-grow: 1;
   flex-wrap: wrap;
   margin: 0 auto;
-  width: 80%;
+  width: 90%;
 }
 
 @media screen and (min-width: 770px) {
@@ -30,6 +30,8 @@
   margin: 0 auto;
   padding: 2rem 0;
   width: 100%;
+  min-height: 280px;
+  display: flex;
 }
 
 .row {

diff --git a/src/base/_element.css b/src/base/_element.css
@@ -95,13 +95,13 @@ b {
 }
 
 a {
-  color: var(--main-color);
+  color: var(--main-text-color);
   text-decoration: none;
 }
 
 a:hover {
-  color: var(--main-color);
-  text-decoration: underline;
+  color: var(--main-text-hover-color);
+  text-decoration: none;
   cursor: pointer;
 }
 

diff --git a/src/component/_footer.css b/src/component/_footer.css
@@ -1,5 +1,5 @@
 .sticky-footer {
-  background: var(--main-color);
+  background: var(--sub-color);
   color: var(--main-text-reverse-color);
   display: flex;
   width: 100%;
@@ -13,3 +13,7 @@
 .sticky-footer a {
   color: var(--main-text-reverse-color);
 }
+
+.sticky-footer a:hover {
+  color: var(--main-text-reverse-hover-color);
+}
diff --git a/src/component/_header.css b/src/component/_header.css
@@ -33,21 +33,14 @@
 .nav-link {
   display: flex;
   text-decoration: none;
-  color: var(--main-text-color);
   font-size: 2rem;
-  border-bottom: solid 0.2rem var(--border-color);
   margin-top: auto;
   margin-right: 4rem;
 }
 
-.nav-link:hover {
-  border-bottom: solid 0.2rem var(--main-color);
-}
-
 .nav-link-logo {
   display: flex;
   text-decoration: none;
-  color: var(--main-text-color);
   font-size: 2rem;
   margin-top: auto;
   margin-right: 4rem;

diff --git a/src/sea.css b/src/sea.css
@@ -31,7 +31,10 @@
   --main-hover-color: #1f8699;
   --main-text-highlight-color: #d2fa92;
   --main-text-color: #262424;
+  --main-text-hover-color: #647172;
   --main-text-reverse-color: #fff;
+  --main-text-reverse-hover-color: #647172;
+  --sub-color: #044a5d;
   --subpoint-color: #647172;
   --border-color: #c7dadd;
   --success-color: #a7f8cc;

diff --git a/src/util/_color.css b/src/util/_color.css
@@ -2,7 +2,7 @@
   color: var(--main-color);
 }
 
-.color-hover {
+.color-main-hover {
   color: var(--main-hover-color);
 }
 
@@ -14,6 +14,10 @@
   color: var(--main-text-color);
 }
 
+.color-text-hover {
+  color: var(--main-text-hover-color);
+}
+
 .color-text-reverse {
   color: var(--main-text-reverse-color);
 }
@@ -46,7 +50,7 @@
   background-color: var(--main-color);
 }
 
-.background-color-hover {
+.background-color-main-hover {
   background-color: var(--main-hover-color);
 }