Skip to content

Instantly share code, notes, and snippets.

@SamEureka

SamEureka/index.html

Created October 24, 2017 17:38
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save SamEureka/6ab2e4d8fbf631c7ca906135eaab5c90 to your computer and use it in GitHub Desktop.
Save SamEureka/6ab2e4d8fbf631c7ca906135eaab5c90 to your computer and use it in GitHub Desktop.
Download ZIP
Crafty Server landing page
Raw
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>SamEureka's 'Crafty' - A Modded Minecraft Server!</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://use.typekit.net/mcq1pvw.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel='stylesheet' type='text/css'>
<link href='https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css' rel='stylesheet' type='text/css'>
<!-- commented out in favor of Typekit Fonts //Sam 5-16-2017
<link href='https://fonts.googleapis.com/css?family=Source+Code+Pro' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Source+Serif+Pro' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
-->
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<style>
.row-hl {
box-shadow: 0 0 0 rgba(0, 0, 0, 0.12), 0 0 0 rgba(0, 0, 0, 0.24);
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}
.row-hl:hover {
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.25), 0 5px 5px rgba(0, 0, 0, 0.22);
}
.bottom {
height: 20px;
}
.corner {
position: absolute;
top: 0;
right: 0;
height: 200px;
width: 30px;
padding: 10px;
}
.clip:hover {
color: orangered;
}
.clip:active {
color: orange;}
.red {
color: orangered;
font-size: 1.8rem;}
h1 {
font-family: "orgovan-rounded-web",sans-serif;
}
h4 {
font-family: "orgovan-rounded-web", sans-serif;
}
body {
list-style: none;
padding-top: 20px;
font-family: "junction", sans-serif;
font-size: 1.5rem;
background-color: #FFF;
color: #123;
display: flex;
justify-content: center;
width: 100vw;
height: 100vh;
}
.bigger {
font-size: 1.8rem;
}
</style>
</head>
<body>
<div class="container">
<div class="corner">
<a href="mailto:sam@sameureka.com?subject=Crafty%20Whitelist&body=Hi%20SamEureka%2C%20Please%20add%20me%20to%20your%20awesome%20server"><i title="eMail" class="pad fa fa-envelope-o fa-2x clip" ></i></a>
<a href="https://codepen.io/SamEureka/" target="_blank"><i title="CodePen" class="pad fa fa-codepen fa-2x clip"></i></a>
<a href="https://github.com/SamEureka/" target="_blank"><i title="GitHub" class="pad fa fa-github fa-2x clip"></i></a>
<a href="https://www.twitch.tv/sameureka" target="_blank"><i title="Twitch.tv" class="pad fa fa-twitch fa-2x clip"></i></a>
<a href="https://twitter.com/SamEureka/" target="_blank">
<i title="Twitter" class="pad fa fa-twitter fa-2x clip"></i></a>
</div>
<h1>Welcome to Crafty!</h1>
<div class="row">
<div class="eight columns">
<p>This is the server information page for the sameureka.com modded Minecraft server. Most of the mod pack instances running on this server are from <a href="https://www.feed-the-beast.com/" target="_blank">Feed The Beast</a> because they are pretty awesome. You are welcome to come play along with us!</p>
<p>So... all the servers are whitelisted. I'll add you if you ask nicely. But I might also ignore your email, I'm sorry if that happens. There are other ways to get put on the whitelist. Check out <a href="https://www.twitch.tv/arkhamprodigy"
target="_blank">ArkhamProdigy</a> on Twitch and give him lots of 'Twitch Bits' in chat, and let him know you want to be added. That is a solid way to get added to the whitelist. Probably the only way that actually works, if we are honest with each other.</p>
</div>
<div class="four columns u-pull-right"><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/194840/sameureka-walking.png"></div>
<div class="row">
<div class="eight columns">
<p>I wish there was a cool way to launch your Minecraft client from this page... but that would be super insecure and just plain crazy! The least I can do is copy the server URL and port to your clipboard... click on the <i class="fa fa-clipboard"></i> buttons to do this.
If there is a mod pack that you love, send me an email and I might add it. This isn't a super robust server so we can only have about 4-5 Minecraft instances running concurrently.</p>
</div>
</div>
</div>
<h4>Rules</h4>
<div class="row">
<div class="twelve columns">
<p>The only rules here... be <u class="red"><em>respectful</em></u> and <u class="red"><em> don't break shit </u></em>.
</p>
</div>
</div>
<h4>Server information</h4>
<div class="row">
<table class="u-full-width">
<thead>
<tr>
<th>Modpack</th>
<th>Version</th>
<th>Address</th>
<th></th>
</tr>
</thead>
<tbody>
<tr class="row-hl">
<td>FTB Presents: SkyFactory 3</td>
<td>3.0.8</td>
<td><code id="sky" class="code">crafty.sameureka.com:25565</code></td>
<td>
<i class="fa fa-clipboard fa-lg clip" data-clipboard-text="crafty.sameureka.com:25565" title="crafty.sameureka.com:25565" ></i>
</td>
</tr>
<tr class="row-hl">
<td>FTB Beyond</td>
<td>1.5.3</td>
<td><code id="beyond" class="code">crafty.sameureka.com:25568</code></td>
<td>
<i class="fa fa-clipboard fa-lg clip" data-clipboard-text="crafty.sameureka.com:25568" title="crafty.sameureka.com:25568" ></i>
</td>
</tr>
<tr class="row-hl">
<td>FTB Presents: SkyFactory Challenges</td>
<td>1.1.0</td>
<td><code id="challenge" class="code">crafty.sameureka.com:21337</code></td>
<td>
<i title="crafty.sameureka.com:21337" data-clipboard-text="crafty.sameureka.com:21337" class="fa fa-clipboard fa-lg clip"></i>
</td>
</tr>
</tbody>
</table>
</div>
<p>
<h4>ArkhamProdigy on Twitch</h4>
<div class="row">
<div class="seven columns">
<iframe
src="https://player.twitch.tv/?channel=ArkhamProdigy&muted=true"
height="315"
width="560"
frameborder="0"
scrolling="no"
allowfullscreen="true">
</iframe>
</div>
<div class="five columns">
<iframe frameborder="0"
scrolling="no"
id="chat_embed"
src="https://www.twitch.tv/arkhamprodigy/chat"
height="315"
width="400">
</iframe>
</div>
</div>
</div>
<div class="bottom">.</div>
<p></P>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.5.5/clipboard.min.js"></script>
<script>new Clipboard('.clip');</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment