aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--vnext/src/style/main.css111
1 files changed, 59 insertions, 52 deletions
diff --git a/vnext/src/style/main.css b/vnext/src/style/main.css
index c09d7e88..f1a84ceb 100644
--- a/vnext/src/style/main.css
+++ b/vnext/src/style/main.css
@@ -66,7 +66,7 @@ pre::-moz-selection {
/* #region overall layout */
html {
- background: #eaeadf;
+ background: #f8f8f8;
color: #222;
}
#wrapper {
@@ -88,7 +88,7 @@ html {
}
body > header {
box-shadow: 0 0 3px rgba(0, 0, 0, 0.28);
- background: #f2f2ec;
+ background: #fff;
position: fixed;
top: 0;
width: 100%;
@@ -141,10 +141,6 @@ body > header {
/* #region header internals */
-body > header a {
- color: #069;
- font-size: 13pt;
-}
#logo {
height: 36px;
margin: 7px 25px 0 20px;
@@ -163,10 +159,23 @@ body > header a {
}
#global {
flex-grow: 1;
+ display: flex;
+}
+#global a {
+ color: #888;
+ display: inline-block;
+ font-size: 13pt;
+ padding: 14px 6px;
}
#global li {
display: inline-block;
- margin: 14px 12px 0 0;
+}
+#global li:hover,
+.l a:hover {
+ background-color: #fff;
+ box-shadow: 0 0 3px rgba(0, 0, 0, 0.16);
+ cursor: pointer;
+ transition: box-shadow 0.2s ease-in;
}
#search {
margin: 12px 20px 12px 0;
@@ -174,31 +183,13 @@ body > header a {
#search input {
background: #FFF;
border: 1px solid #DDDDD5;
+ outline: none !important;
padding: 4px;
}
-body > header nav li:after {
- color: #AAA;
- content: "|";
- display: inline-block;
- margin-left: 12px;
-}
-body > header nav li:last-child:after {
- display: none;
-}
-
@media screen and (max-width: 850px) {
- body > header a {
- font-size: 12pt;
- }
#logo {
display: none;
}
- #global {
- margin-left: 10px;
- }
- #global li {
- margin-right: 10px;
- }
#search {
display: inline-block;
float: none;
@@ -225,7 +216,7 @@ body > header nav li:last-child:after {
padding: 6px;
}
#column li > a:hover {
- background-color: #f2f2ec;
+ background-color: #fff;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.16);
transition: background-color 0.2s ease-in;
}
@@ -240,10 +231,10 @@ body > header nav li:last-child:after {
text-align: justify;
}
#column .inp {
- background: #F5F5E9;
- border: 1px solid #CCC;
- border-radius: 3px;
- padding: 3px;
+ background: #fff;
+ border: 1px solid #ddddd5;
+ outline: none !important;
+ padding: 4px;
width: 222px;
}
#ctitle {
@@ -279,11 +270,15 @@ body > header nav li:last-child:after {
margin: 1em 0;
}
.page {
- background: #f2f2ec;
+ background: #eee;
padding: 6px;
text-align: center;
}
+.page a {
+ color: #888;
+}
+
/* #endregion */
/* #region article, message internals */
@@ -317,7 +312,9 @@ article .ir img {
}
article > nav.l,
.msg-cont > nav.l {
+ border-top: 1px solid #eee;
display: flex;
+ justify-content: space-around;
font-size: 10pt;
}
article > nav.l a,
@@ -340,7 +337,8 @@ article .tags {
}
article .tags > a,
.msg-tags > a {
- box-shadow: 0 0 3px rgba(0, 0, 0, 0.16);
+ background: #eee;
+ border: 1px solid #eee;
color: #888;
display: inline-block;
font-size: 10pt;
@@ -348,6 +346,17 @@ article .tags > a,
margin-right: 5px;
padding: 0 10px;
}
+.l .msg-button {
+ align-items: center;
+ display: flex;
+ flex-basis: 0;
+ flex-direction: column;
+ flex-grow: 1;
+ padding-top: 12px;
+}
+.l .msg-button-icon {
+ font-weight: bold;
+}
.msgthread {
margin-bottom: 0;
}
@@ -420,7 +429,8 @@ article .tags > a,
.msg-comment textarea {
border: 0;
flex-grow: 1;
- padding: 2px;
+ outline: none !important;
+ padding: 4px;
resize: vertical;
vertical-align: top;
}
@@ -454,9 +464,10 @@ article .tags > a,
margin: 0;
}
.title2 {
- background: #DDDDD0;
+ background: #fff;
margin: 20px 0;
padding: 10px 20px;
+ width: 640px;
}
.title2-right {
float: right;
@@ -469,27 +480,18 @@ article .tags > a,
@media screen and (max-width: 850px) {
article {
- margin: 8px;
overflow: auto;
}
article p {
margin: 10px 0 8px 0;
}
- article > nav.l,
- .msg-cont > nav.l {
- flex-direction: column;
- }
- article > nav.l a,
- .msg-cont > nav.l a {
- padding: 6px;
- }
.msg,
.msg-cont {
min-width: 280px;
width: auto;
}
.msg-cont {
- margin: 8px;
+ margin: 8px 0;
}
.msg-media {
overflow: auto;
@@ -520,6 +522,7 @@ article .tags > a,
}
.title2 {
font-size: 11pt;
+ width: auto;
}
#content .title2 h2 {
font-size: 11pt;
@@ -537,7 +540,8 @@ q:before,
q:after {
content: "";
}
-q, blockquote {
+q,
+blockquote {
border-left: 3px solid #CCC;
color: #666;
display: block;
@@ -702,7 +706,7 @@ q, blockquote {
padding-right: 6px;
}
.dialoglogin {
- background: #EEEEE5;
+ background: #fff;
padding: 25px;
width: 300px;
}
@@ -736,13 +740,13 @@ q, blockquote {
width: 70px;
}
.dialogshare {
- background: #EEEEE5;
+ background: #fff;
min-width: 300px;
overflow: auto;
padding: 20px;
}
.dialogl {
- background: #F5F5E9;
+ background: #fff;
border: 1px solid #DDD;
margin: 3px 0 20px;
padding: 5px;
@@ -755,7 +759,7 @@ q, blockquote {
display: block;
}
.dialogtxt {
- background: #EEEEE5;
+ background: #fff;
padding: 20px;
}
@@ -790,15 +794,18 @@ q, blockquote {
margin-top: -2px;
vertical-align: middle;
}
+.icon--ei-link {
+ margin-top: -1px;
+}
.icon--ei-comment {
- margin-top: -3px;
+ margin-top: -5px;
}
.newmessage {
/* textarea on the /post page */
border: 1px solid #DDD;
padding: 2px;
resize: vertical;
- width: 695px;
+ width: 100%;
}
/* #endregion */