Improvements and updated pages
Before Width: | Height: | Size: 282 B |
Before Width: | Height: | Size: 1.7 MiB |
Before Width: | Height: | Size: 46 KiB |
After Width: | Height: | Size: 36 KiB |
After Width: | Height: | Size: 136 KiB |
Before Width: | Height: | Size: 92 KiB After Width: | Height: | Size: 414 KiB |
After Width: | Height: | Size: 92 KiB |
Before Width: | Height: | Size: 62 KiB After Width: | Height: | Size: 193 KiB |
After Width: | Height: | Size: 62 KiB |
Before Width: | Height: | Size: 25 KiB |
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 279 KiB |
Before Width: | Height: | Size: 8.4 KiB After Width: | Height: | Size: 7.9 KiB |
|
@ -0,0 +1,3 @@
|
|||
function copy(content) {
|
||||
navigator.clipboard.writeText(content);
|
||||
}
|
|
@ -4,18 +4,24 @@
|
|||
<title>About | Elatteria</title>
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
<!-- Open Graph Meta Tags -->
|
||||
<meta property="og:url" content="https://www.elatteria.com/about">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:title" content="About | Elatteria">
|
||||
<meta property="og:description" content="About us">
|
||||
<meta property="og:image" content="https://www.elatteria.com/Images/logo.png">
|
||||
<meta property="og:url" content="https://www.elatteria.com/about" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:title" content="About | Elatteria" />
|
||||
<meta property="og:description" content="About us" />
|
||||
<meta
|
||||
property="og:image"
|
||||
content="https://www.elatteria.com/Images/logo.png"
|
||||
/>
|
||||
<!-- Twitter Meta Tags -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta property="twitter:domain" content="elatteria.com">
|
||||
<meta property="twitter:url" content="https://www.elatteria.com/about">
|
||||
<meta name="twitter:title" content="About | Elatteria">
|
||||
<meta name="twitter:description" content="About us">
|
||||
<meta name="twitter:image" content="https://www.elatteria.com/Images/logo.png">
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta property="twitter:domain" content="elatteria.com" />
|
||||
<meta property="twitter:url" content="https://www.elatteria.com/about" />
|
||||
<meta name="twitter:title" content="About | Elatteria" />
|
||||
<meta name="twitter:description" content="About us" />
|
||||
<meta
|
||||
name="twitter:image"
|
||||
content="https://www.elatteria.com/Images/logo.png"
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
|
@ -24,25 +30,53 @@
|
|||
<li class="logo"><a href="/">Logo of Elatteria</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
<li class="active"><a href="/about">About</a></li>
|
||||
</ul>
|
||||
<ul class="mobile">
|
||||
<li class="logo"><a href="/">Home</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
<li class="active"><a href="/about">About</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<h1 class="title">About</h1>
|
||||
<h1 class="title underline">About</h1>
|
||||
|
||||
<div class="description">
|
||||
venenatis a condimentum vitae sapien
|
||||
pellentesque habitant morbi tristique
|
||||
senectus et netus et malesuada fames ac
|
||||
turpis egestas sed tempus urna et pharetra
|
||||
pharetra massa massa ultricies mi quis
|
||||
hendrerit
|
||||
<section class="description">
|
||||
Elatteria is a small group first started by Ebsku (<a
|
||||
class="link"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
href="https://github.com/Ebsku"
|
||||
>https://github.com/Ebsku</a
|
||||
>) and Jorvents (<a
|
||||
class="link"
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
href="https://github.com/Jorvents"
|
||||
>https://github.com/Jorvents</a
|
||||
>). Together we make projects like the E-Cafe Minecraft server.<br />
|
||||
<br />
|
||||
|
||||
We started Elatteria because we wanted to have a name for our group. Our
|
||||
goal is to make entartaining projects for everyone.
|
||||
|
||||
<div class="spacer" />
|
||||
|
||||
<h3 class="underline">Members</h3>
|
||||
<div class="list">
|
||||
<figure class="features">
|
||||
<img src="Images/Profiles/Ebsku.jpg" alt="Profile picture of Ebsku" />
|
||||
<figcaption>Ebsku</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="Images/Profiles/Jorvents.jpg"
|
||||
alt="Profile picture of Ebsku"
|
||||
/>
|
||||
<figcaption>Jorvents</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>E-Cafe | Elatteria</title>
|
||||
<link rel="stylesheet" href="../styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<ul class="desktop">
|
||||
<li class="logo"><a href="/">Logo of Elatteria</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
<ul class="mobile">
|
||||
<li class="logo"><a href="/">Home</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<h1 class="title underline">E-Cafe</h1>
|
||||
<div class="description">
|
||||
E-Cafe is our Minecraft server featuring multiple gamemodes. <br />
|
||||
<button><a href="/ecafe/playnow">Play now!</a></button>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,118 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Play now! | Elatteria</title>
|
||||
<link rel="stylesheet" href="../styles.css" />
|
||||
<script src="../Scripts/copy.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<ul class="desktop">
|
||||
<li class="logo"><a href="/">Logo of Elatteria</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
<ul class="mobile">
|
||||
<li class="logo"><a href="/">Home</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<h1 class="title underline">Play now!</h1>
|
||||
<div class="description">
|
||||
<figure class="container" onclick="copy('mc.elatteria.com')">
|
||||
<img
|
||||
src="../Images/Screenshots/ip.png"
|
||||
alt="Add E-Cafe Minecraft server"
|
||||
class="copyable"
|
||||
id="copyable"
|
||||
/>
|
||||
<div class="middle">Click here to copy</div>
|
||||
</figure>
|
||||
<figcaption class="description">
|
||||
1. Go to Multiplayer <br />
|
||||
2. Click add server <br />
|
||||
3. Type "mc.elatteria.com" in the "Server Adress" field
|
||||
</figcaption>
|
||||
<img
|
||||
src="../Images/Screenshots/serveradded.png"
|
||||
alt="E-Cafe Minecraft server added"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="spacer" />
|
||||
|
||||
<section class="description">
|
||||
<h1>Server made by</h1>
|
||||
<div class="list">
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/e670d4ab-a396-4c0d-bd6d-0fb8742e0a83?helm=true"
|
||||
alt="Minecraft head of Ebsku"
|
||||
/>
|
||||
<figcaption>Ebsku</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/e39e3289dbd4420c81975b5141c4837f?helm=true"
|
||||
alt="Minecraft head of Jorvents"
|
||||
/>
|
||||
<figcaption>Jorvents</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/f000e1fc-72d0-48fb-b583-bb6bfaa20c31?helm=true"
|
||||
alt="Minecraft head of yesyes"
|
||||
/>
|
||||
<figcaption>yesyes</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/95bd1dbc-360e-46ed-ae1a-53f6440271d1?helm=true"
|
||||
alt="Minecraft head of RobinOfGaming"
|
||||
/>
|
||||
<figcaption>RobinOfGaming</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/ef158c9d-2bd0-4890-8c3a-985c2c27906f?helm=true"
|
||||
alt="Minecraft head of GhdEst"
|
||||
/>
|
||||
<figcaption>GhdEst</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/b9decfb0-a3d2-45a1-ab64-5dc2e46481b1?helm=true"
|
||||
alt="Minecraft head of zani"
|
||||
/>
|
||||
<figcaption>zani</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/1b2a3b7c-31a8-4b45-8908-c6d63cc27b64?helm=true"
|
||||
alt="Minecraft head of coradoune"
|
||||
/>
|
||||
<figcaption>coradoune</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/fc3b8cc7-ab15-4690-a497-d1c900debfb0?helm=true"
|
||||
alt="Minecraft head of Raspberry"
|
||||
/>
|
||||
<figcaption>Raspberry</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/9956d7bf-8aa7-4cad-bc8d-40c77f84be63?helm=true"
|
||||
alt="Minecraft head of OkuBlock"
|
||||
/>
|
||||
<figcaption>OkuBlock</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
|
@ -36,31 +36,14 @@
|
|||
</nav>
|
||||
</header>
|
||||
<h1 class="title underline">Elatteria</h1>
|
||||
<div class="description">
|
||||
Welcome to E-Cafe!<br/>
|
||||
We're a small community on Discord.<br />
|
||||
<button type="button" onclick="scrollDown(0, 10000)">
|
||||
Learn More
|
||||
<section class="description">
|
||||
Elatteria is a small group of people<br>
|
||||
that are interested in programming<br>
|
||||
and creating different projects<br>
|
||||
<button type="button">
|
||||
<a href="/about">About us</a>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 1500px"></div>
|
||||
|
||||
<div class="description">
|
||||
<figure class="screenshots">
|
||||
<img
|
||||
src="Images/Screenshots/MinecraftBedwarsLobby.png"
|
||||
alt="Screenshot from E-Cafe Minecraft server"
|
||||
/>
|
||||
<br>
|
||||
</figure>
|
||||
<div class="spacer"/>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
||||
sed do eiusmod tempor incididunt ut labore et dolore magnam aliquam quaerat voluptatem.
|
||||
Ut enim medicorum scientiam non ipsius artis, sed bonae valetudinis causa probamus,
|
||||
et gubernatoris ars, quia bene navigandi rationem habet, utilitate, non arte laudatur,
|
||||
sic sapientia, quae ars vivendi.<br>
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
<script src="Scripts/scroll.js"></script>
|
||||
</html>
|
||||
|
|
|
@ -10,13 +10,13 @@
|
|||
<ul class="desktop">
|
||||
<li class="logo"><a href="/">Logo of Elatteria</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li class="active"><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
<ul class="mobile">
|
||||
<li class="logo"><a href="/">Home</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li class="active"><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
@ -37,7 +37,7 @@
|
|||
</figure>
|
||||
<figure class="features">
|
||||
<a
|
||||
href="playnow.html"
|
||||
href="ecafe/playnow.html"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
><img
|
||||
|
|
113
src/playnow.html
|
@ -1,113 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Play now! | Elatteria</title>
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<ul class="desktop">
|
||||
<li class="logo"><a href="/">Logo of Elatteria</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
<ul class="mobile">
|
||||
<li class="logo"><a href="/">Home</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<h1 class="title underline">Play now!</h1>
|
||||
<div class="description">
|
||||
<figure>
|
||||
<img src="Images/Screenshots/ip.png" alt="Add E-Cafe Minecraft server">
|
||||
<div>Click here to copy</div>
|
||||
<img/>
|
||||
</figure>
|
||||
<figcaption class="description">
|
||||
1. Go to Multiplayer <br>
|
||||
2. Click add server <br>
|
||||
3. Type "mc.elatteria.com" in the "Server Adress" field
|
||||
</figcaption>
|
||||
<img src="Images/Screenshots/serveradded.png" alt="E-Cafe Minecraft server added">
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 200px"/>
|
||||
|
||||
|
||||
<section class="description">
|
||||
<h1>Server made by</h1>
|
||||
<div class="list">
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/e670d4ab-a396-4c0d-bd6d-0fb8742e0a83?helm=true"
|
||||
alt="Minecraft head of Ebsku"
|
||||
/>
|
||||
<figcaption>Ebsku</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/e39e3289dbd4420c81975b5141c4837f?helm=true"
|
||||
alt="Minecraft head of Jorvents"
|
||||
/>
|
||||
<figcaption>Jorvents</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/f000e1fc-72d0-48fb-b583-bb6bfaa20c31?helm=true"
|
||||
alt="Minecraft head of yesyes"
|
||||
/>
|
||||
<figcaption>yesyes</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/95bd1dbc-360e-46ed-ae1a-53f6440271d1?helm=true"
|
||||
alt="Minecraft head of RobinOfGaming"
|
||||
/>
|
||||
<figcaption>RobinOfGaming</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/ef158c9d-2bd0-4890-8c3a-985c2c27906f?helm=true"
|
||||
alt="Minecraft head of GhdEst"
|
||||
/>
|
||||
<figcaption>GhdEst</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="list">
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/b9decfb0-a3d2-45a1-ab64-5dc2e46481b1?helm=true"
|
||||
alt="Minecraft head of zani"
|
||||
/>
|
||||
<figcaption>zani</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/1b2a3b7c-31a8-4b45-8908-c6d63cc27b64?helm=true"
|
||||
alt="Minecraft head of coradoune"
|
||||
/>
|
||||
<figcaption>coradoune</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/fc3b8cc7-ab15-4690-a497-d1c900debfb0?helm=true"
|
||||
alt="Minecraft head of Raspberry"
|
||||
/>
|
||||
<figcaption>Raspberry</figcaption>
|
||||
</figure>
|
||||
<figure class="features">
|
||||
<img
|
||||
src="https://crafatar.com/avatars/9956d7bf-8aa7-4cad-bc8d-40c77f84be63?helm=true"
|
||||
alt="Minecraft head of OkuBlock"
|
||||
/>
|
||||
<figcaption>OkuBlock</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
|
@ -14,13 +14,13 @@
|
|||
<nav>
|
||||
<ul class="desktop">
|
||||
<li class="logo"><a href="/">Logo of Elatteria</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li class="active"><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
<ul class="mobile">
|
||||
<li class="logo"><a href="/">Home</a></li>
|
||||
<li><a href="/projects">Projects</a></li>
|
||||
<li class="active"><a href="/projects">Projects</a></li>
|
||||
<li><a href="/links">Links</a></li>
|
||||
<li><a href="/about">About</a></li>
|
||||
</ul>
|
||||
|
@ -31,7 +31,7 @@
|
|||
<div class="list">
|
||||
<figure class="features">
|
||||
<a
|
||||
href="playnow.html"
|
||||
href="/ecafe"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
><img
|
||||
|
|
|
@ -21,6 +21,21 @@ html {
|
|||
margin-top: 500px;
|
||||
}
|
||||
|
||||
.middle {
|
||||
transition: 100ms ease;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.container {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
body {
|
||||
background-image: url("Images/backround.png");
|
||||
background-repeat: no-repeat;
|
||||
|
@ -35,11 +50,14 @@ body {
|
|||
|
||||
|
||||
header {
|
||||
background-color: #60a37c;
|
||||
margin: 0 auto;
|
||||
background-color: #4fa57a;
|
||||
background-position: top;
|
||||
text-align: center;
|
||||
top: 0px;
|
||||
height: 80px;
|
||||
width: 99%;
|
||||
margin-top: 0.5%;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
header .logo a {
|
||||
|
@ -66,8 +84,12 @@ li {
|
|||
float: left;
|
||||
}
|
||||
|
||||
.active {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
button {
|
||||
background: rgb(42, 50, 127);
|
||||
background: #4fa57a;
|
||||
color: white;
|
||||
transform: scale(4, 4);
|
||||
margin: 7%;
|
||||
|
@ -90,13 +112,30 @@ a {
|
|||
color: white;
|
||||
}
|
||||
|
||||
.link {
|
||||
color: lightskyblue;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
font: roboto;
|
||||
font-family: "Roboto";
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
a img:hover {
|
||||
border: 2px solid white;
|
||||
border: 3px solid white;
|
||||
}
|
||||
|
||||
img {
|
||||
border-radius: 10px;
|
||||
border: 1px solid white;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.copyable:hover {
|
||||
opacity: 0.85;
|
||||
}
|
||||
|
||||
.container:hover .middle {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.features img {
|
||||
|
@ -130,12 +169,14 @@ a img:hover {
|
|||
|
||||
.mobile {
|
||||
display: none;
|
||||
text-align: left;
|
||||
text-align: center;
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.mobile li {
|
||||
font-size: 30px;
|
||||
top: 50%;
|
||||
bottom: 50%;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1100px) {
|
||||
|
@ -152,6 +193,13 @@ a img:hover {
|
|||
|
||||
header .mobile {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
header .mobile .logo a {
|
||||
width: 225px;
|
||||
height: 75px;
|
||||
}
|
||||
|
||||
header .desktop {
|
||||
|
|