loads
ada
10 months ago
parent
4e20a6bdfc
commit
078857a31c
@ -0,0 +1,95 @@
|
||||
body {
|
||||
font-family: 'trebuchet ms', sans-serif;
|
||||
color:#130149;
|
||||
}
|
||||
|
||||
.recipeName {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.recipeName:hover {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.letterBox {
|
||||
border: 3px solid black;
|
||||
display: inline-block;
|
||||
padding: 20px;
|
||||
width: 500px;
|
||||
z-index: 10;
|
||||
left: 50vw;
|
||||
top: 290px;
|
||||
margin-left:-270px;
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.letterContents {
|
||||
width: 90%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#closeButton {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
z-index: 10;
|
||||
top: 0px;
|
||||
background-image: url("../images/close.png");
|
||||
background-size: cover;
|
||||
text-align: justify;
|
||||
position: relative;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.line {
|
||||
left: 50vw;
|
||||
margin-left: -460px;
|
||||
margin-top: 50px;
|
||||
display: block;
|
||||
width: 900px;
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.cls-1 {
|
||||
fill: #130149;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.bottom-left {
|
||||
font-size: 30px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 50px;
|
||||
}
|
||||
|
||||
#info {
|
||||
width: 180px;
|
||||
padding: 20px;
|
||||
font-size: 20px;
|
||||
z-index: 5;
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color:#130149;
|
||||
}
|
||||
|
||||
#textbox {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 35vw;
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
|
||||
|
||||
ul {
|
||||
list-style-type:none;
|
||||
}
|
||||
|
||||
li {
|
||||
padding-top: 5px;
|
||||
}
|
||||
@ -0,0 +1,40 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>cheesecake intimacy</title>
|
||||
<link rel="stylesheet" href="cheesecake.css">
|
||||
<script src="jquery.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div id="letterBox" class="letterBox" style="display:none">
|
||||
<div id="closeButton" onClick='closeLetter()'></div>
|
||||
<p id = "letterContents">
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="info">
|
||||
<div onclick="openLetter()">✶ about</div>
|
||||
<div onclick="window.location.href = "ingredients.html"">✶ ingredients</div>
|
||||
</div>
|
||||
|
||||
<a href="recipes/boxed.html" id="boxed" class="recipeName" style="left: 200px; top: 160px;">boxed quark cheesecake</a>
|
||||
<a href="recipes/aglaia.html" id="aglaia" class="recipeName" style="left: 1090px; top: 590px;">aglaia's birthday cheesecake</a>
|
||||
|
||||
|
||||
<div class="bottom-left">
|
||||
<p class="bigger-text"> the cheesecake intimacy spectrum</p>
|
||||
</div>
|
||||
|
||||
<div class="line">
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 715.4 506.78">
|
||||
<path class="cls-1" d="m149.24,111.22c22.99-1.33,43.65,10.83,60.18,25.75s30.08,34.05,45.87,50.39c7.66,7.92,15.96,15.29,25.26,21.23,10.24,6.54,21.63,10.87,33.03,14.92,11.59,4.13,23.19,8.16,33.99,14.15,9.92,5.5,19.12,12.2,27.78,19.5,17.63,14.86,33.15,31.99,49.89,47.8s36.19,31.33,55.88,44.9c39.59,27.28,82.69,49.07,126.76,68.09,10.97,4.73,22.1,9.08,33.05,13.85s20.72,9.94,28.49,18.44c13.01,14.23,18.39,33.75,31.71,47.76,3.11,3.27,6.65,6.11,10.53,8.42,2.77,1.65,5.29-2.67,2.52-4.32-17-10.1-23.46-30.35-33.96-46-5.84-8.71-13.09-15.84-22.11-21.26-9.93-5.96-20.92-9.97-31.58-14.39-44.92-18.62-89.03-39.77-129.91-66.24-20.28-13.13-39.71-27.58-57.8-43.6-17.41-15.42-33.08-32.64-50.19-48.38s-35.5-29.05-57.16-37.51c-11.66-4.56-23.74-8.1-35.15-13.3s-20.54-11.6-29.32-19.61c-16.83-15.35-29.96-34.13-45.81-50.41-15.28-15.69-34.21-30.21-56.26-34.21-5.19-.94-10.45-1.28-15.72-.98-3.2.19-3.22,5.19,0,5h0Z"/>
|
||||
</svg>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,24 @@
|
||||
function closeLetter() {
|
||||
$('.letterBox').hide()
|
||||
}
|
||||
|
||||
|
||||
function openLetter() {
|
||||
$('#letterContents').html(` <p id = "letterContents">
|
||||
i have nothing to say here yet i guess. pls remind me if this is still empty and you think it's weird.
|
||||
<br><br>
|
||||
ada`)
|
||||
$('.letterBox').toggle()
|
||||
}
|
||||
|
||||
|
||||
for(var i=0; i<recipes.length; i++){
|
||||
$('<div />', {
|
||||
id: recipes[i].name,
|
||||
class: 'recipeName',
|
||||
click: function(){ window.location.href = 'recipes/' + (this.id) + '.html' },
|
||||
})
|
||||
.html(recipes[i].name.replace(/-/g, ' '))
|
||||
.css({left: 35*(recipes[i][xAxis[0]]+10), top: (690-35*(recipes[i][yAxis[0]]+10)) })
|
||||
.appendTo($('#canvasCover'))
|
||||
}
|
||||
@ -0,0 +1,125 @@
|
||||
@font-face {
|
||||
font-family: 'worksans';
|
||||
src: url('css/fonts/worksans/WorkSans-Regular.woff') format('opentype');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'worksans';
|
||||
src: url('./css/fonts/worksans/WorkSans-Bold.woff') format('opentype');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'worksans';
|
||||
src: url('./css/fonts/worksans/WorkSans-Italic.woff') format('opentype');
|
||||
font-weight: normal;
|
||||
font-style: oblique;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'worksans';
|
||||
src: url('./css/fonts/worksans/WorkSans-Bold.woff') format('opentype');
|
||||
font-weight: bold;
|
||||
font-style: oblique;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'worksans', sans-serif;
|
||||
color: #130149;
|
||||
min-height: 100vh;
|
||||
background-color: #ebebe6;
|
||||
margin-top: 0px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.image-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.link {
|
||||
margin-bottom: 30px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.box-container {
|
||||
display: none;
|
||||
color: #130149;
|
||||
border-radius: 6px;
|
||||
padding: 6px;
|
||||
margin-left: 20px;
|
||||
font-size: 18px;
|
||||
width: 65vw;
|
||||
position: absolute;
|
||||
top:70px;
|
||||
left: 100%;
|
||||
}
|
||||
|
||||
.text {
|
||||
background-color: #ebebe6;
|
||||
margin: 10px;
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.last-clicked .text-box {
|
||||
display: block;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.last-clicked .box-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#hut {
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
width: 100px;
|
||||
height: auto;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
details {
|
||||
padding-left: 1.5vw;
|
||||
padding-top: 10px;
|
||||
display: block;
|
||||
line-height: 2;
|
||||
max-width: 800px;
|
||||
}
|
||||
summary {
|
||||
cursor: se-resize;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
summary::after {
|
||||
content: '☜';
|
||||
font-size: 30px;
|
||||
float: right;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
summary::selection {
|
||||
color: #880808;
|
||||
}
|
||||
|
||||
@keyframes details-show {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
details[open] > summary::after {
|
||||
content: '☟';
|
||||
}
|
||||
|
||||
details[open] > *:not(summary) {
|
||||
animation: details-show 990ms;
|
||||
}
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
@ -0,0 +1,64 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
|
||||
<meta http-equiv="Content-Style-Type" content="text/css" />
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" href="css/style_summary.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div>
|
||||
<h1>
|
||||
<div id="imageContainer" class="image-container">
|
||||
<a href="index.html" target="_blank">
|
||||
<img id="hut" src="images/hut.png" alt="hut"> </a>
|
||||
</div>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<details>
|
||||
<summary>
|
||||
here is an open letter, written and sent
|
||||
</summary>
|
||||
<details>
|
||||
<summary> has a machine ever helped you be human?
|
||||
</summary>
|
||||
<details>
|
||||
<summary>
|
||||
if you took a picture of your guts and posted it online, what do you think people would say?
|
||||
</summary>
|
||||
<details>
|
||||
<summary>
|
||||
do you think anybody would hold them?
|
||||
</summary>
|
||||
</details>
|
||||
<br>
|
||||
<details>
|
||||
<summary>
|
||||
here what lud7 wrote in response
|
||||
</summary>
|
||||
</details>
|
||||
<details>
|
||||
<summary>
|
||||
they wouldn't. I got rid of my smartphone and television seven years ago and became a complete luddite. I kept my Linux Desktop PC to access the ar15.com forum, to sell and buy rifles. Nobody else comes this far into the woods. Machines are no vessel for love and I am much too old to believe in angels. My roots run deep in the forest soil, deeper than cables can. There is no emotional support to be found online, sorry to say.","lud7"
|
||||
</summary>
|
||||
<div>
|
||||
|
||||
My line is always open to all of you at any time",
|
||||
"IM me and I will call you to lend you an ear and a shoulder. Together, we can overcome a lot of difficulties and hard times.",
|
||||
"We have done it before and we can continue to do it. Do not despair and lose hope.",
|
||||
"We have had attempts in the past. Thank God, both were dealt with successfully. I am sure tc69 would get involved again to avert a tragedy like he did before.",
|
||||
"I'm IM-ing you my contact info. If someone's in my area that needs help, let me know."
|
||||
|
||||
</div>
|
||||
</details>
|
||||
|
||||
</details>
|
||||
</details>
|
||||
</details>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue