}
}
-main {
+main, footer {
margin: 0 4em;
padding: 1em;
- background: #fafaff;
max-width: 70em;
+}
+
+main {
+ position: relative;
+ background: #fafaff;
min-height: 70vh;
clip-path: polygon(0px 0px, 96.35% -24px, 101.99% 7.86%, 100.61% 103.56%, 10% 100%, 0% 100%, 0px 0px);
}
font-style: italic;
}
}
+ p {
+ line-height: 160%;
+ }
code,
pre.screen {
background: #111;
font-size: 60%;
}
}
+}
+
+.older.post-list {
+ margin: 5em 0 2em 0;
+ padding: 1em 0;
+ border-top: 0.1em dotted $link-color;
+ border-bottom: 0.1em dotted $link-color;
+ line-height: 200%;
+ li {
+ display: inline;
+ a {
+ padding-top: 0;
+ display: inline;
+ font-size: 120%;
+ }
+ }
+}
+footer {
+ p {
+ text-align: right;
+ font-size: 100%;
+ }
+}
+
+div[contenteditable=true]:focus-within {
+ outline: none;
+ box-shadow: inset 0 0 2px #333;
+}
+
+.style-popup {
+ background: white;
+ box-shadow: 0 0 5px #666;
+ input {
+ display: none;
+ padding: 3px;
+ border: 1px inset #ccc;
+ background: white;
+ width: 0px;
+ transition: width ease 2s;
+ &.shown {
+ display: inline-block;
+ width: 400px;
+ }
+ }
+ button {
+ padding: 0;
+ height: 2em;
+ text-align: center;
+ background: #eee;
+ border: 0px;
+ &:hover {
+ background: #ccc;
+ }
+ &[data-action=createLink] {
+ color: blue;
+ text-decoration: underline;
+ }
+ }
+ &.short button {
+ width: 2em;
+ }
}