@@ -1,163 +1,174 @@
html {
- scroll-behavior: smooth;
+ scroll-behavior: smooth;
}
body {
- font-family: Heliotrope;
- color: $dark;
- background: $light;
+ font-family: Heliotrope;
+ color: $dark;
+ background: $light;
}
hr {
- margin: 15px 0;
- border: 1px solid $dark;
+ margin: 15px 0;
+ border: 1px solid $dark;
}
code {
- background: $button-background;
- border-radius: 3px;
- padding: 0 4px;
+ background: $button-background;
+ border-radius: 3px;
+ padding: 0 4px;
}
-code, pre {
- font-size: 16px;
- font-family: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
- color: $dark;
+code,
+pre {
+ font-size: 16px;
+ font-family: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
+ color: $dark;
}
input {
- font-family: inherit;
- text-align: center;
- width: 100%;
- height: 35px;
- box-sizing: border-box;
- box-shadow: 0 1px 1px rgba(12,13,14,0.15),inset 0 1px 0 0 #fff;
- transition: .15s ease-out;
+ font-family: inherit;
+ text-align: center;
+ width: 100%;
+ height: 35px;
+ box-sizing: border-box;
+ box-shadow: 0 1px 1px rgba(12, 13, 14, 0.15), inset 0 1px 0 0 #fff;
+ transition: 0.15s ease-out;
}
-input[type=text] {
- font-size: inherit;
- color: $dark;
- text-decoration: italic;
- border: 1px solid #9fa6ad;
- border-radius: 3px;
+input[type="text"] {
+ font-size: inherit;
+ color: $dark;
+ text-decoration: italic;
+ border: 1px solid #9fa6ad;
+ border-radius: 3px;
}
-input[type=text]:focus {
+input[type="text"]:focus {
}
.wrapper {
- max-width: 600px;
- margin: 0 auto;
- font-size: 18px;
- line-height: 30px;
- overflow-wrap: break-word;
- word-wrap: break-word;
- word-break: break-word;
- -moz-hyphens: auto;
- hyphens: auto;
- text-align: left;
+ max-width: 600px;
+ margin: 0 auto;
+ font-size: 18px;
+ line-height: 30px;
+ overflow-wrap: break-word;
+ word-wrap: break-word;
+ word-break: break-word;
+ -moz-hyphens: auto;
+ hyphens: auto;
+ text-align: left;
}
.content {
- h2, p, li, td {
- a {
- color: $dark;
- text-decoration: none;
- background-image: linear-gradient(120deg,$gradient-right 0%,$gradient-left 100%);
- background-repeat: no-repeat;
- background-size: 0 0;
- background-position: 100% 21%;
- transition: .15s ease-out;
- &:hover {
- background-size: 100% 100%;
- color: $light;
- &:after {
- color: $gradient-right;
- }
- }
- &::after {
- position: relative;
- content: "\FEFF°";
- margin-left: 0.10em;
- font-size: 90%;
- top: -0.10em;
- color: $light-highlight;
- font-feature-settings: "caps";
- font-variant-numeric: normal;
- }
+ h2,
+ p,
+ li,
+ td {
+ a {
+ color: $dark;
+ text-decoration: none;
+ background-image: linear-gradient(
+ 120deg,
+ $gradient-right 0%,
+ $gradient-left 100%
+ );
+ background-repeat: no-repeat;
+ background-size: 0 0;
+ background-position: 100% 21%;
+ transition: 0.15s ease-out;
+ &:hover {
+ background-size: 100% 100%;
+ color: $light;
+ &:after {
+ color: $gradient-right;
}
- }
- .anchor-tag {
- font-size: 70%;
+ }
+ &::after {
position: relative;
- bottom: 2.6px;
- background-size: 100% 0;
- background-position: 0 150%;
- &::after {
- content: "";
- }
+ content: "\FEFF°";
+ margin-left: 0.1em;
+ font-size: 90%;
+ top: -0.1em;
+ color: $light-highlight;
+ font-feature-settings: "caps";
+ font-variant-numeric: normal;
+ }
}
- .footnote-ref {
- background-size: 100% 1.5px;
- background-position: 0 90%;
- &::after {
- content: "";
- }
- &:hover {
- background-size: 100% 100%;
- color: #fff;
- }
+ }
+ .anchor-tag {
+ font-size: 70%;
+ position: relative;
+ bottom: 2.6px;
+ background-size: 100% 0;
+ background-position: 0 150%;
+ &::after {
+ content: "";
}
- .footnote-backref {
- background-size: 100% 1.5px;
- background-position: 0 90%;
- &::after {
- content: "";
- }
- &:hover {
- background-size: 100% 100%;
- color: #fff;
- }
+ }
+ .footnote-ref {
+ background-size: 100% 1.5px;
+ background-position: 0 90%;
+ &::after {
+ content: "";
}
- .highlight {
- code {
- padding: 0px !important;
- }
- pre {
- overflow: auto;
- border-radius: 5px;
- padding: 12px;
- background: $button-background !important;
- }
- a {
- background-image: none;
- &::after {
- content: "";
- }
- }
+ &:hover {
+ background-size: 100% 100%;
+ color: #fff;
}
+ }
+ .footnote-backref {
+ background-size: 100% 1.5px;
+ background-position: 0 90%;
+ &::after {
+ content: "";
+ }
+ &:hover {
+ background-size: 100% 100%;
+ color: #fff;
+ }
+ }
+ .highlight {
+ code {
+ padding: 0px !important;
+ }
+ pre {
+ overflow: auto;
+ border-radius: 5px;
+ padding: 12px;
+ background: $button-background !important;
+ }
+ a {
+ background-image: none;
+ &::after {
+ content: "";
+ }
+ }
+ }
}
.button {
- font-family: inherit;
- font-style: normal !important;
- text-decoration: none !important;
- height: 25px;
- box-shadow: 0 1px 1px rgba(12,13,14,0.15),inset 0 1px 0 0 #fff;
- display: inline-block;
- color: $dark;
- text-shadow: 0 1px 0 #fff;
- background-color: #e4e6e8;
- border: 1px solid #9fa6ad;
- border-radius: 3px;
- cursor: pointer;
- padding: 0px 4px 4px;
+ font-family: inherit;
+ font-style: normal !important;
+ text-decoration: none !important;
+ height: 25px;
+ box-shadow: 0 1px 1px rgba(12, 13, 14, 0.15), inset 0 1px 0 0 #fff;
+ display: inline-block;
+ color: $dark;
+ text-shadow: 0 1px 0 #fff;
+ background-color: #e4e6e8;
+ border: 1px solid #9fa6ad;
+ border-radius: 3px;
+ cursor: pointer;
+ padding: 0px 4px 4px;
}
.footer {
- padding: 20px 0 20px 0;
- text-align: center;
- line-height: 30px;
- a:visited {
- color: $dark;
- }
- .ring {
- font-size: 20px;
- }
- .boring_stuff {
- font-style: italic;
- }
+ padding: 20px 0 20px 0;
+ text-align: center;
+ line-height: 30px;
+ a {
+ color: $dark;
+ }
+ a:visited {
+ color: $dark;
+ }
+ .ring {
+ font-size: 20px;
+ }
+ .boring_stuff {
+ font-style: italic;
+ }
}