Anton Linus
4 years ago
7 changed files with 401 additions and 45 deletions
@ -0,0 +1,127 @@ |
|||
html, body, div |
|||
{ |
|||
padding:0; |
|||
margin: 0; |
|||
overflow: hidden; |
|||
} |
|||
body |
|||
{ |
|||
width:100%; |
|||
height:100%; |
|||
background-color: white; |
|||
} |
|||
|
|||
canvas |
|||
{ |
|||
background-color: white; |
|||
width:100%; |
|||
} |
|||
|
|||
#game |
|||
{ |
|||
width: 100; |
|||
height: 100; |
|||
margin: 0 auto; |
|||
} |
|||
|
|||
#inviteDiv { |
|||
z-index: 1000; |
|||
display: inline-flex; |
|||
flex-direction: column; |
|||
position: absolute; |
|||
pointer-events: none; |
|||
word-wrap: break-word; |
|||
width: 100%; |
|||
} |
|||
|
|||
#inviteDiv h1, h2 { |
|||
text-align: center; |
|||
font-family: monospace; |
|||
font-weight: bold; |
|||
white-space: pre; |
|||
max-width: 100%; |
|||
margin: 0; |
|||
word-wrap: break-word; |
|||
text-shadow: 3px 3px 1px rgba(75, 75, 75, 1); |
|||
color: #d152b8; |
|||
} |
|||
|
|||
#inviteDiv h1 { |
|||
padding-top: 5vh; |
|||
padding-left: 18vw; |
|||
font-size: 1vw; |
|||
} |
|||
|
|||
#inviteDiv h2 { |
|||
font-size: 0.4vw; |
|||
padding-left: 24vw; |
|||
} |
|||
|
|||
#invitetextDiv { |
|||
pointer-events: none; |
|||
position: absolute; |
|||
padding-top: 25vh; |
|||
word-wrap: break-word; |
|||
height: 100%; |
|||
width: 100%; |
|||
max-height: 100%; |
|||
max-width: 100%; |
|||
} |
|||
|
|||
#invitetextDiv p { |
|||
padding-top: 10vh; |
|||
font-family: Arial; |
|||
font-weight: bold; |
|||
flex-grow: 1; |
|||
font-size: 1.2vw; |
|||
color: #d152b8; |
|||
text-align: left; |
|||
margin-left: 27vw; |
|||
margin-right: 27vw; |
|||
} |
|||
|
|||
u { |
|||
color: blue; |
|||
} |
|||
|
|||
/* |
|||
#backgroundDiv { |
|||
width: 100%; |
|||
height: 100%; |
|||
z-index: 800; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
position: absolute; |
|||
pointer-events: none; |
|||
} |
|||
|
|||
#backgroundDiv h3 { |
|||
font-family: monospace; |
|||
white-space: pre; |
|||
font-size: 1.5vw; |
|||
color: lightgrey; |
|||
} |
|||
*/ |
|||
|
|||
@media only screen and (max-width: 768px) { |
|||
|
|||
#inviteDiv h1 { |
|||
padding-top: 5vh; |
|||
padding-left: 11vw; |
|||
font-size: 1.5vw; |
|||
} |
|||
|
|||
#inviteDiv h2 { |
|||
font-size: 0.8vw; |
|||
padding-left: 33vw; |
|||
} |
|||
#invitetextDiv p { |
|||
align-self: flex-start; |
|||
padding-top: 0vh; |
|||
font-size: 3vw; |
|||
color: #d152b8; |
|||
margin-left: 13vw; |
|||
margin-right: 13vw; |
|||
} |
|||
} |
Binary file not shown.
@ -0,0 +1,92 @@ |
|||
<!DOCTYPE html> |
|||
<html> |
|||
<head> |
|||
<title>OPENCOIL</title> |
|||
<meta charset="utf-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> |
|||
<link rel="stylesheet" type="text/css" href="main.css"> |
|||
</head> |
|||
<body> |
|||
<div id="inviteDiv"> |
|||
<h1> |
|||
_|_| _|_|_| _|_|_|_| _| _| _|_|_| _|_| _|_|_| _| |
|||
_| _| _| _| _| _|_| _| _| _| _| _| _| |
|||
_| _| _|_|_| _|_|_| _| _| _| _| _| _| _| _| |
|||
_| _| _| _| _| _|_| _| _| _| _| _| |
|||
_|_| _| _|_|_|_| _| _| _|_|_| _|_| _|_|_| _|_|_|_| |
|||
</h1> |
|||
<h2> |
|||
_ _ _ |
|||
(_) | | | | |
|||
__ _ _ __ ___ __ _ _ __ ___ _ _ __ __ _ ___ _ __ ___ ___ __| |___| |__ _____ __ |
|||
/ _` | | '__/ _ \ / _` | '_ ` _ \| | '_ \ / _` | / __| '_ \ / _ \/ _ \/ _` / __| '_ \ / _ \ \ /\ / / |
|||
| (_| | | | | (_) | (_| | | | | | | | | | | (_| | \__ \ |_) | __/ __/ (_| \__ \ | | | (_) \ V V / |
|||
\__,_| |_| \___/ \__,_|_| |_| |_|_|_| |_|\__, | |___/ .__/ \___|\___|\__,_|___/_| |_|\___/ \_/\_/ |
|||
__/ | | | |
|||
|___/ |_| |
|||
</h2> |
|||
</div> |
|||
<div id="invitetextDiv"> |
|||
<p> |
|||
<br> |
|||
Aram Bartholl<br> |
|||
Constant Dullart<br> |
|||
Dennis de Bel & Anton Jehle<br> |
|||
JODI<br> |
|||
Jonas Lund<br> |
|||
Martin Howse<br> |
|||
Mediengruppe Bitnik!<br> |
|||
Rosa Menkman<br> |
|||
Sarah Grant<br> |
|||
Sofya Aleynikova<br> |
|||
</p> |
|||
</div> |
|||
<div id="backgroundDiv"> |
|||
<h3> |
|||
__,aaPPPPPPPPaa,__ |
|||
|
|||
,adP"""' `""Yb,_ |
|||
|
|||
,adP' `"Yb, |
|||
|
|||
,dP' ,aadPP"""""YYba,_ `"Y, |
|||
|
|||
,P' ,aP"' `""Ya, "Y, |
|||
|
|||
,P' aP' _________ `"Ya `Yb, |
|||
|
|||
,P' d" ,adP""""""""Yba, `Y, "Y, |
|||
|
|||
,d' ,d' ,dP" `Yb, `Y, `Y, |
|||
|
|||
d' ,d' ,d' ,dP""Yb, `Y, `Y, `b |
|||
|
|||
8 d' d' ,d" "b, `Y, `8, Y, |
|||
|
|||
8 8 8 d' _ `Y, `8 `8 `b |
|||
|
|||
8 8 8 8 8 `8 8 8 8 |
|||
|
|||
8 Y, Y, `b, ,aP P 8 ,P 8 |
|||
|
|||
I, `Y, `Ya """" d' ,P d" ,P |
|||
|
|||
`Y, `8, `Ya ,8" ,P' ,P' d' |
|||
|
|||
`Y, `Ya, `Ya,,__,,d"' ,P' ,P" ,P |
|||
|
|||
`Y, `Ya, `""""' ,P' ,d" ,P' |
|||
|
|||
`Yb, `"Ya,_ ,d" ,P' ,P' |
|||
|
|||
`Yb, ""YbaaaaaadP" ,P' ,P' |
|||
|
|||
`Yba, ,d' ,dP' |
|||
|
|||
`"Yba,__ __,adP" dP" |
|||
|
|||
`"""""""""""""' |
|||
</h3> |
|||
</div> |
|||
</body> |
|||
</html> |
@ -0,0 +1,102 @@ |
|||
body { |
|||
height: 100%; |
|||
width: 100%; |
|||
max-width: 100%; |
|||
max-height: 100%; |
|||
overflow: hidden; |
|||
white-space: pre; |
|||
} |
|||
|
|||
#inviteDiv { |
|||
position: absolute; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
pointer-events: none; |
|||
word-wrap: break-word; |
|||
width: 100%; |
|||
} |
|||
|
|||
#inviteDiv h1, h2 { |
|||
text-align: center; |
|||
font-family: monospace; |
|||
max-width: 100%; |
|||
margin: 0; |
|||
word-wrap: break-word; |
|||
text-shadow: 3px 3px 1px rgba(75, 75, 75, 1); |
|||
color: #d152b8; |
|||
} |
|||
|
|||
#inviteDiv h1 { |
|||
font-size: 1vw; |
|||
padding-top: 5vh; |
|||
padding-left: 17vw; |
|||
} |
|||
|
|||
#inviteDiv h2 { |
|||
font-size: 0.4vw; |
|||
padding-left: 24vw; |
|||
} |
|||
|
|||
#invitetextDiv { |
|||
z-index: 500; |
|||
position: absolute; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
word-wrap: break-word; |
|||
height: 100%; |
|||
width: 100%; |
|||
max-height: 100%; |
|||
max-width: 100%; |
|||
} |
|||
|
|||
#invitetextDiv p { |
|||
font-family: Arial; |
|||
font-weight: bold; |
|||
flex-grow: 1; |
|||
font-size: 1.2vw; |
|||
color: #d152b8; |
|||
text-align: center; |
|||
margin-left: 27vw; |
|||
margin-right: 27vw; |
|||
} |
|||
|
|||
#backgroundDiv { |
|||
position: absolute; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
#backgroundDiv h3 { |
|||
font-family: monospace; |
|||
white-space: pre; |
|||
font-size: 0.8vw; |
|||
color: lightgrey; |
|||
} |
|||
|
|||
@media only screen and (max-width: 768px) { |
|||
|
|||
#inviteDiv h1 { |
|||
font-size: 1.5vw; |
|||
} |
|||
|
|||
#inviteDiv h2 { |
|||
font-size: 0.8vw; |
|||
} |
|||
|
|||
#invitetextDiv p { |
|||
font-size: 3vw; |
|||
color: #d152b8; |
|||
margin-left: 13vw; |
|||
margin-right: 13vw; |
|||
} |
|||
|
|||
#backgroundDiv h3 { |
|||
font-size: 1.8vw; |
|||
} |
|||
} |
Loading…
Reference in new issue