Change blog.css to scss
This commit is contained in:
parent
1116396b23
commit
70c372b172
|
@ -1,89 +0,0 @@
|
|||
header {
|
||||
position: relative;
|
||||
margin: 0 auto -2rem;
|
||||
}
|
||||
header > h4 > a.orgicorn img {
|
||||
height: 1.5em;
|
||||
top: 0.25em;
|
||||
opacity: 0.85;
|
||||
position: relative;
|
||||
}
|
||||
@media (min-width: 1000px) {
|
||||
#content {
|
||||
margin: auto;
|
||||
}
|
||||
header > h4 > a.orgicorn img {
|
||||
position: absolute;
|
||||
top: -0.3em;
|
||||
transform: translateX(-100%) translateX(-0.8rem);
|
||||
}
|
||||
}
|
||||
header > h4 > a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
header > h4 > a.rss {
|
||||
float: right;
|
||||
}
|
||||
header > h4 > a.rss img {
|
||||
position: relative;
|
||||
top: -0.2em;
|
||||
filter: invert(0.6);
|
||||
}
|
||||
header > h4 > a.rss img:hover {
|
||||
opacity: 1;
|
||||
filter: invert(38%) sepia(98%) saturate(1640%) hue-rotate(11deg) contrast(98%);
|
||||
}
|
||||
#postamble {
|
||||
display: block;
|
||||
}
|
||||
footer {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 0.8rem;
|
||||
padding: 1rem 0;
|
||||
font-family: sans;
|
||||
color: #666;
|
||||
}
|
||||
footer a {
|
||||
color: #777;
|
||||
font-weight: bold;
|
||||
background-image: none !important;
|
||||
opacity: 0.65;
|
||||
}
|
||||
#content {
|
||||
min-height: calc(100vh - 10rem - 48px); /* because of the header */
|
||||
}
|
||||
.doom-one { /* make doom-one screenshots match the blog */
|
||||
filter: invert(5%) sepia(3%);
|
||||
}
|
||||
#theme-switch:checked ~ #page .doom-one {
|
||||
filter: invert(91.5%) hue-rotate(180deg) sepia(1%)
|
||||
}
|
||||
.underline { /* repurpose to show off contributors */
|
||||
color: var(--text-medium);
|
||||
border-radius: .8em;
|
||||
padding: .5em .4em .2em;
|
||||
height: 0;
|
||||
font-size: .9em;
|
||||
font-family: "Open Sans",sans;
|
||||
}
|
||||
.underline:last-child {
|
||||
float: right;
|
||||
white-space: break-spaces;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
/* click on a figure to enlarge it */
|
||||
figure:active {
|
||||
position: relative;
|
||||
left: #{"min(0px, 720px - 60vw)"};
|
||||
width: 80vw;
|
||||
transition-duration: 150ms;
|
||||
}
|
||||
figure {
|
||||
transition-property: left width;
|
||||
left: 0;
|
||||
width: 90%;
|
||||
transition-duration: 0ms;
|
||||
}
|
|
@ -0,0 +1,89 @@
|
|||
header {
|
||||
position: relative;
|
||||
margin: 0 auto -2rem;
|
||||
& > h4 > a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
&.orgicorn img {
|
||||
height: 1.5em;
|
||||
top: 0.25em;
|
||||
opacity: 0.85;
|
||||
position: relative;
|
||||
}
|
||||
&.rss {
|
||||
float: right;
|
||||
& img {
|
||||
position: relative;
|
||||
top: -0.2em;
|
||||
filter: invert(0.6);
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
filter: invert(38%) sepia(98%) saturate(1640%) hue-rotate(11deg) contrast(98%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (min-width: 1000px) {
|
||||
#content {
|
||||
margin: auto;
|
||||
}
|
||||
header > h4 > a.orgicorn img {
|
||||
position: absolute;
|
||||
top: -0.3em;
|
||||
transform: translateX(-100%) translateX(-0.8rem);
|
||||
}
|
||||
}
|
||||
#postamble {
|
||||
display: block;
|
||||
}
|
||||
footer {
|
||||
display: block;
|
||||
text-align: center;
|
||||
font-size: 0.8rem;
|
||||
padding: 1rem 0;
|
||||
font-family: sans;
|
||||
color: #666;
|
||||
& a {
|
||||
color: #777;
|
||||
font-weight: bold;
|
||||
background-image: none !important;
|
||||
opacity: 0.65;
|
||||
}
|
||||
}
|
||||
#content {
|
||||
min-height: calc(100vh - 10rem - 48px); /* because of the header */
|
||||
}
|
||||
.doom-one { /* make doom-one screenshots match the blog */
|
||||
filter: invert(5%) sepia(3%);
|
||||
}
|
||||
#theme-switch:checked ~ #page .doom-one {
|
||||
filter: invert(91.5%) hue-rotate(180deg) sepia(1%)
|
||||
}
|
||||
.underline { /* repurpose to show off contributors */
|
||||
color: var(--text-medium);
|
||||
border-radius: .8em;
|
||||
padding: .5em .4em .2em;
|
||||
height: 0;
|
||||
font-size: .9em;
|
||||
font-family: "Open Sans",sans;
|
||||
&:last-child {
|
||||
float: right;
|
||||
white-space: break-spaces;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* click on a figure to enlarge it */
|
||||
figure {
|
||||
transition-property: left width;
|
||||
left: 0;
|
||||
width: 90%;
|
||||
transition-duration: 0ms;
|
||||
&:active {
|
||||
position: relative;
|
||||
left: #{"min(0px, 720px - 60vw)"};
|
||||
width: 80vw;
|
||||
transition-duration: 150ms;
|
||||
}
|
||||
}
|
|
@ -96,8 +96,13 @@ Return output file name."
|
|||
(executable-find "csso"))
|
||||
(message "optimising %s with csso" (file-name-nondirectory filename))
|
||||
(call-process "csso" nil nil nil "-i" filename "-o" outfile))
|
||||
(t (copy-file filename outfile t))))
|
||||
outfile))
|
||||
((and (string= "scss" ext)
|
||||
(executable-find "sassc"))
|
||||
(message "converting %s to css with sassc" (file-name-nondirectory filename))
|
||||
(setq outfile (replace-regexp-in-string "\\.scss$" ".css" outfile))
|
||||
(call-process "sassc" nil nil nil "--style" "compressed" filename outfile))
|
||||
(t (copy-file filename outfile t)))
|
||||
outfile)))
|
||||
|
||||
;;; Use ascii colours to make output more informative
|
||||
|
||||
|
|
Loading…
Reference in New Issue