scss -> css: index.css

This commit is contained in:
marleyrae 2023-06-09 14:05:18 -07:00
parent 470954efb0
commit 0bda951b84
6 changed files with 133 additions and 119 deletions

4
.idea/watcherTasks.xml Normal file
View file

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectTasksOptions" suppressed-tasks="SCSS" />
</project>

View file

@ -4,7 +4,11 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Saudade / a petz & friends archive</title> <title>Saudade / a petz & friends archive</title>
<link rel="stylesheet" href="style/style.css"> <link rel="stylesheet" href="style/index.css">
<!-- fonts -->
<link rel="preconnect" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=playfair-display:800i" rel="stylesheet"/>
</head> </head>
<body> <body>
<div id="site"> <div id="site">
@ -48,7 +52,7 @@
<!--------------------------------------------- methodology ---------------------------------------------------> <!--------------------------------------------- methodology --------------------------------------------------->
<p><i><u>methodology:</u></i></p> <h3>methodology:</h3>
<p> <p>
For each site, I re-create each page by hand. Yes! This is tedious, especially for large sites. There are a For each site, I re-create each page by hand. Yes! This is tedious, especially for large sites. There are a
@ -89,7 +93,7 @@
<!----------------------------------------------- author ------------------------------------------------------> <!----------------------------------------------- author ------------------------------------------------------>
<p><i><u>about the author:</u></i></p> <h3>about the author:</h3>
<p> <p>
Hello! I'm marley, or mar @ epiphany on forums/Discord, or punkfairie various other places. I own Epiphany, Hello! I'm marley, or mar @ epiphany on forums/Discord, or punkfairie various other places. I own Epiphany,

122
style/index.css Normal file
View file

@ -0,0 +1,122 @@
@font-face {
font-family: "CascadiaCode";
src: url("fonts/CascadiaCode.woff2");
}
@font-face {
font-family: "CascadiaCode";
src: url("fonts/CascadiaCodeItalic.woff2");
font-style: italic;
}
html {
height: 100%;
width: 100%;
}
* {
box-sizing: border-box;
}
body {
height: 95%;
display: flex;
justify-content: center;
align-items: center;
align-content: center;
text-align: center;
font-family: 'CascadiaCode', sans-serif;
letter-spacing: 1px;
font-size: 13px;
background-image: url(bg.gif);
}
#site {
border: 1px solid #000;
width: 600px;
height: 600px;
background-color: #faefe4;
}
#header {
padding: 10px;
border-bottom: 2px dotted #000;
}
#header h1 {
font-family: 'Playfair Display', serif;
text-transform: lowercase;
font-size: 40px;
font-weight: normal;
font-style: italic;
display: table;
width: 70%;
margin: 0 auto;
text-align: left;
padding: 5px;
}
#header h2 {
font-weight: normal;
font-size: 13px;
display: table;
width: 70%;
margin: 0 auto;
text-align: right;
padding: 5px;
}
#nav {
padding: 10px;
border-bottom: 2px dotted #000;
}
#content {
padding: 10px;
overflow: auto;
height: 74%;
}
blockquote {
width: 70%;
border-left: 3px solid #808080;
padding-left: 10px;
margin: 20px auto 30px;
text-align: left;
}
p {
margin: 10px;
}
h3 {
text-decoration: underline;
font-style: italic;
font-weight: normal;
}
ol {
text-align: left;
}
ol li {
margin-bottom: 10px;
}
#heart {
display: table;
margin: 0 auto;
padding: 3px 7px;
border: 1px solid #000;
font-size: 16px;
font-family: sans-serif;
}
a { color: #4db3da; }
a:hover, a:visited { color: #268db5; }
a:hover { text-decoration: underline; text-decoration-style: wavy; }

View file

@ -1 +0,0 @@
@import"https://fonts.googleapis.com/css2?family=Imprima&family=Playfair+Display:ital,wght@0,800;1,800&display=swap";@font-face{font-family:"CascadiaCode";src:url("fonts/CascadiaCode.woff2")}@font-face{font-family:"CascadiaCode";src:url("fonts/CascadiaCodeItalic.woff2");font-style:italic}html{height:100%;width:100%}body{height:95%;display:flex;justify-content:center;align-items:center;align-content:center;text-align:center;font-family:"CascadiaCode",sans-serif;letter-spacing:1.1px;font-size:13px;background-image:url(bg.gif)}#site{border:1px solid #000;width:600px;height:600px;background-color:#faefe4}#header{padding:10px;border-bottom:2px dotted #000}#header h1{font-family:"Playfair Display",serif;text-transform:lowercase;font-size:40px;font-weight:normal;font-style:italic;display:table;width:70%;margin:0 auto;text-align:left;padding:5px}#header h2{font-weight:normal;font-size:13px;display:table;width:70%;margin:0 auto;text-align:right;padding:5px}#nav{padding:10px;border-bottom:2px dotted #000}#content{padding:10px;overflow:scroll;height:72%}blockquote{width:70%;border-left:3px solid gray;padding-left:10px;margin:20px auto;margin-bottom:30px;text-align:left}p{margin:10px}ol{text-align:left}ol li{margin-bottom:10px}#heart{display:table;margin:0 auto;padding:3px 7px;border:1px solid #000;font-size:16px;font-family:sans-serif}a{color:#4db3da}a:hover,a:visited{color:#268db5}a:hover{text-decoration:underline;text-decoration-style:wavy}/*# sourceMappingURL=style.css.map */

View file

@ -1 +0,0 @@
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAQ,qHAER,WACC,2BACA,oCAGD,WACC,2BACA,0CACA,kBAGD,KACC,YACA,WAGD,KACC,WACA,aACA,uBACA,mBACA,qBAEA,kBACA,sCACA,qBACA,eACA,6BAGD,MACC,sBACA,YACA,aACA,yBAGD,QACC,aACA,8BAGA,WACC,qCACA,yBACA,eACA,mBACA,kBAEA,cACA,UACA,cACA,gBACA,YAGD,WACC,mBACA,eAEA,cACA,UACA,cACA,iBACA,YAIF,KACC,aACA,8BAGD,SACC,aACA,gBACA,WAGD,WACC,UACA,2BACA,kBACA,iBACA,mBACA,gBAGD,EACC,YAGD,GACC,gBAEA,MACC,mBAIF,OACC,cACA,cACA,gBACA,sBACA,eACA,uBAGD,gBACA,gCACA","file":"style.css"}

View file

@ -1,114 +0,0 @@
@import url('https://fonts.googleapis.com/css2?family=Imprima&family=Playfair+Display:ital,wght@0,800;1,800&display=swap');
@font-face {
font-family: "CascadiaCode";
src: url("fonts/CascadiaCode.woff2");
}
@font-face {
font-family: "CascadiaCode";
src: url("fonts/CascadiaCodeItalic.woff2");
font-style: italic;
}
html {
height: 100%;
width: 100%;
}
body {
height: 95%;
display: flex;
justify-content: center;
align-items: center;
align-content: center;
text-align: center;
font-family: 'CascadiaCode', sans-serif;
letter-spacing: 1.1px;
font-size: 13px;
background-image: url(bg.gif);
}
#site {
border: 1px solid #000;
width: 600px;
height: 600px;
background-color: #faefe4;
}
#header {
padding: 10px;
border-bottom: 2px dotted #000;
h1 {
font-family: 'Playfair Display', serif;
text-transform: lowercase;
font-size: 40px;
font-weight: normal;
font-style: italic;
display: table;
width: 70%;
margin: 0 auto;
text-align: left;
padding: 5px;
}
h2 {
font-weight: normal;
font-size: 13px;
display: table;
width: 70%;
margin: 0 auto;
text-align: right;
padding: 5px;
}
}
#nav {
padding: 10px;
border-bottom: 2px dotted #000;
}
#content {
padding: 10px;
overflow: scroll;
height: 72%;
}
blockquote {
width: 70%;
border-left: 3px solid #808080;
padding-left: 10px;
margin: 20px auto;
margin-bottom: 30px;
text-align: left;
}
p {
margin: 10px;
}
ol {
text-align: left;
li {
margin-bottom: 10px;
}
}
#heart {
display: table;
margin: 0 auto;
padding: 3px 7px;
border: 1px solid #000;
font-size: 16px;
font-family: sans-serif;
}
a { color: #4db3da; }
a:hover, a:visited { color: #268db5; }
a:hover { text-decoration: underline; text-decoration-style: wavy; }