diff options
author | Rasmus Andersson <rasmus@notion.se> | 2019-08-05 05:35:36 +0300 |
---|---|---|
committer | Rasmus Andersson <rasmus@notion.se> | 2019-08-05 05:35:36 +0300 |
commit | ba49662904d5ba716802be57a48ea84cf89d3f10 (patch) | |
tree | b65881e04e169632dffc617269c56c50731d37f0 /docs/index.css | |
parent | 672ead9a6cf4f20772bccb217055d8b5d84fc6bc (diff) | |
download | inter-ba49662904d5ba716802be57a48ea84cf89d3f10.tar.xz |
release 3.8
Diffstat (limited to 'docs/index.css')
-rw-r--r-- | docs/index.css | 76 |
1 files changed, 71 insertions, 5 deletions
diff --git a/docs/index.css b/docs/index.css index bcac587df..2058c532f 100644 --- a/docs/index.css +++ b/docs/index.css @@ -32,6 +32,66 @@ h1 { } } +#subway-nav { + display: flex; + align-items: center; + justify-content: space-between; + /*--subwayHeight: 2.5rem;*/ + --subwayHeight: calc(100vw / 19); + height: var(--subwayHeight); +} +#subway-nav .dest { + flex: 0 0 31%; + display: flex; + cursor: pointer; + text-decoration:none; +} +#subway-nav .dest .disc { + flex: 0 0 auto; + width: var(--subwayHeight); + height: var(--subwayHeight); + color: black; + background: var(--yellow); + border-radius: var(--subwayHeight); + text-align: center; + line-height: var(--subwayHeight); + font-weight: 600; + font-size: calc(var(--subwayHeight) * 0.42); +} +#subway-nav .label { + flex: 1 1 auto; + line-height: var(--subwayHeight); + font-weight:700; + letter-spacing: -0.02em; + font-size: calc(var(--subwayHeight) * 0.6); + margin-left: calc(var(--subwayHeight) * 0.22); + white-space: nowrap; +} +#subway-nav .dest:hover { text-decoration:none; color:inherit; } +#subway-nav .dest:hover .disc { background:#222; color:white; } +#subway-nav .dest1 .disc { background:var(--green); font-size: calc(var(--subwayHeight) * 0.3); } +#subway-nav .dest2 .disc { background:var(--yellow); } +#subway-nav .dest3 .disc { background:var(--red); color: white; } +@media only screen and (min-width: 987px) { + #subway-nav { --subwayHeight: 3.2rem; } +} +@media only screen and (max-width: 600px) { + #subway-nav { + --subwayHeight: 2.4rem; + margin: -2rem 0; + align-items: flex-start; + flex-direction: column; + height: calc(var(--subwayHeight) * 4); + } + #subway-nav .label { font-weight:600; } +} + + +.row.features { + background:lightpink; +} + + .weights-and-styles { display: block; opacity: 0.98; @@ -79,9 +139,9 @@ h1 { /*box-shadow: 0 2px 0 0 var(--red);*/ background: rgba(0, 0, 0, 0.07); } - .dynmet-calc input[type=number]::-webkit-inner-spin-button, - .dynmet-calc input[type=number]::-webkit-outer-spin-button { - -webkit-appearance: none; + .dynmet-calc input[type=number]::-webkit-inner-spin-button, + .dynmet-calc input[type=number]::-webkit-outer-spin-button { + -webkit-appearance: none; margin: 0; } @@ -142,7 +202,7 @@ h1 { } .charset-table > c { flex: 0 0 auto; - + margin: 0; padding: 0; @@ -203,9 +263,14 @@ grid.faq { background: var(--yellow); } +boxes.features { + color:#111; +} boxes.features box h3 + p { margin-top:0.5em; } +.features h3 a q {padding-left: 0.5em; color: transparent; float:right; font-weight:400; } +.features h3 a:hover q { color: inherit; } boxes.features grid .sample { word-break: break-word; @@ -214,7 +279,8 @@ boxes.features grid .sample { boxes.features grid .sample em { font-style: inherit; - background: #e4fdef; + /*background: #e4fdef;*/ + background: var(--light-yellow); color: black; } |