diff options
Diffstat (limited to 'docs/index.css')
-rw-r--r-- | docs/index.css | 280 |
1 files changed, 0 insertions, 280 deletions
diff --git a/docs/index.css b/docs/index.css deleted file mode 100644 index e78af2305..000000000 --- a/docs/index.css +++ /dev/null @@ -1,280 +0,0 @@ - -h1 { - color: #010101; - font-size:81px; - letter-spacing: -0.055em; - line-height: 0.9em; - text-indent: -0.03em; - margin-bottom: 4rem; - margin-top: 10px; - font-weight: 740; -} -/* title scales as window shrinks */ -@media only screen and (max-width: 988px) { - h1 { font-size: calc(100vw / 12.2); } -} -@media only screen and (max-width: 900px) { - h1 { font-size: calc(100vw / 12.5); } -} -@media only screen and (max-width: 760px) { - h1 { font-size: calc(100vw / 12.8); } -} -@media only screen and (max-width: 660px) { - h1 { font-size: calc(100vw / 13.2); } -} - -@media only screen and (max-width: 565px) { - h1 { - font-size: 60px; - letter-spacing: -0.045em; - text-indent: -0.012em; - line-height: 1em; - } -} - -#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(--warm-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(--warm-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; - width: 100%; - margin: 3em 0 3em 0; -} - -#hidden-text-input { - position: absolute; - left:0; - top:0; - background: none; - border: none; - opacity: 0; - pointer-events: none; -} - -/* Dynamic metrics */ -.dynmet-calc { - font-weight: 440; - font-size: 1.2rem; - line-height: calc(var(--spacingv) * 2); - /*font-size: 1.5rem;*/ - /*line-height: 26px;*/ - user-select: text; -} - .dynmet-calc input { - border: none; - /*box-shadow: 0 0.125rem 0 0 rgba(0, 0, 0, 0.3);*/ - background: transparent; - font: inherit; - outline: none; - margin: 0 0.2em; - width: 40px; - text-align: center; - line-height: inherit; - color: var(--red); - user-select: text; - border-radius: 0.2rem; - } - .dynmet-calc input:hover { - box-shadow: 0 0 0 0.12rem rgba(0, 0, 0, 0.3); - } - .dynmet-calc input:focus { - /*box-shadow: 0 2px 0 0 var(--red);*/ - background: rgba(0, 0, 0, 0.07); - } - .dynmet-calc input[type=number] { - appearance: textfield; - } - .dynmet-calc input[type=number]::-webkit-inner-spin-button, - .dynmet-calc input[type=number]::-webkit-outer-spin-button { - -webkit-appearance: none; - margin: 0; - } - - .dynmet-calc .arrow { - margin: 0 0.5em; - } - - .dynmet-calc #dynmet-tracking { - box-shadow: none; - width: 57px; - margin-right: 0.1em; - color: var(--red); - } - .dynmet-calc #dynmet-tracking.percent { - width: 34px; - } - - .dynmet-calc #dynmet-unit:hover { - color: rgb(43, 139, 247); - } - .dynmet-calc #dynmet-unit:active { - color: white; - } - -@media only screen and (max-width: 565px) { - .dynmet-calc { font-size: 1rem; } - .dynmet-calc .arrow { margin: 0; } - .dynmet-calc input { width:32px; } -} - -#languages {} -.language-list { - column-count: 4; - column-gap: 32px; - column-fill: balance; -} -.language-list p { margin: 0; } -@media only screen and (max-width: 660px) { - .language-list { column-count: 3; } -} -@media only screen and (max-width: 540px) { - .language-list { column-count: 2; } -} - - - -/* Character set table (main css comes from _include) */ -.row.charset-title { padding-bottom: 0; } -.row.charset-title > h2 { text-align: center; } - @keyframes charset-flash { - 0% { background-color: black; color: white; } - 20% { background-color: black; color: white; } - 20.1% { background-color: white; color: inherit; } - 40% { background-color: white; color: inherit; } - - 40.1% { background-color: black; color: white; } - 60% { background-color: black; color: white; } - - 100% { background-color: white; color: inherit; } - } -.charset-table { - /*--gridColor: #559966;*/ - --gridColor: transparent; -} - .charset-table > a { - cursor: cell; - border-radius: 2px; - } - .charset-table > a:hover { - /*color: white; - background: black;*/ - color: black; - background: white; - } - .charset-table > a.flash { - animation: charset-flash 300ms 1; - animation-fill-mode: forwards; - animation-timing-function: ease-out; - } - - - -/* features */ -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; }*/ -.features h3 a q {padding-left: 0.5em; opacity:0.3; float:right; font-weight:400; } -.features h3 a:hover q { opacity:1; } - -boxes.features grid .sample { - word-break: break-word; - word-wrap: break-word; -} - -boxes.features grid .sample em { - font-style: inherit; - /*background: #e4fdef;*/ - background: var(--light-yellow); - color: black; -} - -.features box.feat-cvXX { - flex-basis: 100%; -} - - -/* FAQ */ -grid.faq { - grid-row-gap: calc(var(--spacingv) * 3); -} -.faq .q { - font-weight: 600; -} -.faq h4:target { - background: var(--yellow); -} - - -blockquote { - display:inline-block; - border-radius:4px; - background: var(--yellow); - color:black; - padding: 1rem 1.5rem; - margin-bottom: 2rem; - font-weight:500; -} |