mirror of
https://github.com/TotalFreedomMC/Website.git
synced 2024-12-22 16:25:12 +00:00
Fixed some bugs and changed to SCSS (half complete)
This commit is contained in:
parent
a9cd63ecc3
commit
065d16eeb2
11 changed files with 1036 additions and 286 deletions
353
css/main.css
353
css/main.css
|
@ -1,294 +1,307 @@
|
|||
.brand-logo,
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
|
||||
body {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
}
|
||||
font-weight: 100;
|
||||
color: #fff;
|
||||
background: #222 url(../images/cover-1.png) center no-repeat fixed;
|
||||
background-size: cover; }
|
||||
|
||||
#rules-title,
|
||||
.button {
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
-ms-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out;
|
||||
z-index: 100
|
||||
}
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
z-index: 100;
|
||||
padding: 10px 55px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
color: #c8c8c8; }
|
||||
#rules-title:hover,
|
||||
.button:hover {
|
||||
background: rgba(200, 200, 200, 0.2); }
|
||||
|
||||
#rules-title {
|
||||
border-radius: 0px; }
|
||||
|
||||
.admins ul,
|
||||
.cover-1,
|
||||
.cover-2,
|
||||
.cover-3 .section-title,
|
||||
.rank {
|
||||
text-align: center
|
||||
}
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
body {
|
||||
color: #fff;
|
||||
background: url(../images/cover-1.png) center no-repeat fixed #222;
|
||||
background-size: cover
|
||||
}
|
||||
text-align: center; }
|
||||
|
||||
.brand-logo {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px
|
||||
}
|
||||
margin-bottom: 5px; }
|
||||
|
||||
.button-collapse {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 10px
|
||||
}
|
||||
margin-bottom: 10px; }
|
||||
|
||||
.cover-1 {
|
||||
font-size: 1.5em;
|
||||
color: rgba(255, 255, 255, .4);
|
||||
height: 100vh
|
||||
}
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
height: 100vh; }
|
||||
|
||||
.cover-1 a,
|
||||
.cover-1 h3 {
|
||||
margin-top: 23%
|
||||
}
|
||||
.button {
|
||||
padding: 15px 55px;
|
||||
background: rgba(255, 255, 255, .1);
|
||||
border-radius: 5px;
|
||||
color: #c8c8c8;
|
||||
transition: all .2s ease-in-out
|
||||
}
|
||||
.button:hover {
|
||||
background: rgba(200, 200, 200, .2)
|
||||
}
|
||||
margin-top: 23%; }
|
||||
|
||||
.cover-2 {
|
||||
background: url(../images/cover-2.png) center fixed;
|
||||
background-size: cover;
|
||||
height: auto;
|
||||
padding-bottom: 40px
|
||||
}
|
||||
padding-bottom: 40px; }
|
||||
|
||||
.rule {
|
||||
z-index: 100;
|
||||
display: none;
|
||||
padding: 30px
|
||||
}
|
||||
padding: 30px; }
|
||||
|
||||
#rules-title,
|
||||
.admins > ul > a {
|
||||
padding: 10px;
|
||||
display: inline-block
|
||||
}
|
||||
display: inline-block; }
|
||||
|
||||
#rules-title {
|
||||
font-size: 2.2em;
|
||||
background: rgba(230, 230, 230, .1);
|
||||
background: rgba(230, 230, 230, 0.1);
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
transition: all .2s ease-in-out
|
||||
}
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease; }
|
||||
|
||||
#rules-title:hover {
|
||||
background: rgba(210, 210, 210, 0.2); }
|
||||
|
||||
.admins > ul > a,
|
||||
i.rules-icon {
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
-ms-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out
|
||||
}
|
||||
#rules-title:hover {
|
||||
background: rgba(210, 210, 210, .2)
|
||||
}
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease; }
|
||||
|
||||
i.rules-icon {
|
||||
position: relative;
|
||||
float: right;
|
||||
color: rgba(150, 150, 150, .3);
|
||||
transition: all .2s ease-in-out
|
||||
}
|
||||
color: rgba(150, 150, 150, 0.3);
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease; }
|
||||
i.rules-icon:hover {
|
||||
color: rgba(150, 150, 150, 1)
|
||||
}
|
||||
color: #969696; }
|
||||
|
||||
.cover-2 h2,
|
||||
.cover-2 p {
|
||||
width: 75%;
|
||||
margin: 0 auto
|
||||
}
|
||||
margin: 0 auto; }
|
||||
|
||||
.cover-2 p {
|
||||
font-size: 1.2em;
|
||||
height: auto
|
||||
}
|
||||
height: auto; }
|
||||
|
||||
.section-title {
|
||||
font-size: 4em;
|
||||
color: rgba(255, 255, 255, .9);
|
||||
z-index: 100
|
||||
}
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
z-index: 100; }
|
||||
|
||||
.cover-3 {
|
||||
background: url(../images/cover-3.png) no-repeat fixed;
|
||||
background-size: cover
|
||||
}
|
||||
background-size: cover; }
|
||||
|
||||
.admins > ul > a {
|
||||
margin: 5px;
|
||||
background: rgba(0, 0, 0, .3);
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
-ms-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
border-radius: 150px;
|
||||
z-index: 200;
|
||||
}
|
||||
z-index: 200; }
|
||||
|
||||
.admins > ul > a:hover {
|
||||
background: rgba(100, 100, 100, .3);
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
background: rgba(100, 100, 100, 0.3);
|
||||
transform: translateY(-4px); }
|
||||
|
||||
.admins ul {
|
||||
z-index: 101
|
||||
}
|
||||
z-index: 101; }
|
||||
|
||||
.admins a li {
|
||||
color: rgba(255, 255, 255, .5);
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
font-size: 1.2em;
|
||||
z-index: 102
|
||||
}
|
||||
z-index: 102; }
|
||||
|
||||
.rank {
|
||||
font-size: 2em;
|
||||
z-index: 103
|
||||
}
|
||||
z-index: 103; }
|
||||
|
||||
.rest > li > a,
|
||||
.useful a {
|
||||
padding: 10px;
|
||||
z-index: 100;
|
||||
text-align: center;
|
||||
}
|
||||
text-align: center; }
|
||||
|
||||
.cover-1,
|
||||
.cover-2,
|
||||
.cover-3 {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .2)
|
||||
}
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
|
||||
|
||||
.rest > li > a {
|
||||
font-size: 1.5em;
|
||||
color: rgba(255, 255, 255, .6);
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
border-radius: 50px;
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
-ms-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out;
|
||||
transition: all .2s ease-in-out
|
||||
}
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease; }
|
||||
|
||||
.rest > li > a:hover {
|
||||
background: rgba(255, 255, 255, .2);
|
||||
color: #fff
|
||||
}
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
color: #fff; }
|
||||
|
||||
.rest > li {
|
||||
margin-top: 50px;
|
||||
-webkit-transition: all .5s ease-in-out;
|
||||
-moz-transition: all .5s ease-in-out;
|
||||
-ms-transition: all .5s ease-in-out;
|
||||
-o-transition: all .5s ease-in-out;
|
||||
transition: all .5s ease-in-out
|
||||
}
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease; }
|
||||
|
||||
.rest > li:hover {
|
||||
transform: translateX(5px)
|
||||
}
|
||||
transform: translateX(5px); }
|
||||
|
||||
.useful a {
|
||||
display: inline-block;
|
||||
font-size: 1.2em;
|
||||
color: rgba(255, 255, 255, .6);
|
||||
border: 2px solid rgba(255, 255, 255, .6);
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
border: 2px solid rgba(255, 255, 255, 0.6);
|
||||
margin-right: 10px;
|
||||
border-radius: 50px;
|
||||
width: 200px;
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
-ms-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out;
|
||||
transition: all .2s ease-in-out;
|
||||
margin-bottom: 10px
|
||||
}
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
margin-bottom: 10px; }
|
||||
|
||||
.useful > a > li > i {
|
||||
font-size: 2em;
|
||||
margin-bottom: 10px
|
||||
}
|
||||
margin-bottom: 10px; }
|
||||
|
||||
.useful a:hover {
|
||||
background: rgba(255, 255, 255, .2);
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
color: #fff;
|
||||
transform: translateY(-5px)
|
||||
}
|
||||
transform: translateY(-5px); }
|
||||
|
||||
#note {
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
border-radius: 150px;
|
||||
padding: 15px;
|
||||
z-index: 1
|
||||
}
|
||||
z-index: 1; }
|
||||
|
||||
#note h5 {
|
||||
margin-bottom: -20px
|
||||
}
|
||||
margin-bottom: -20px; }
|
||||
|
||||
#note a {
|
||||
color: #c8c8c8;
|
||||
font-weight: 700
|
||||
}
|
||||
font-weight: 700; }
|
||||
|
||||
.nav-wrapper {
|
||||
background: rgba(0, 0, 0, .3)
|
||||
}
|
||||
background: rgba(0, 0, 0, 0.3); }
|
||||
|
||||
.cover-2 a {
|
||||
font-size: 1.3em;
|
||||
color: rgba(255, 255, 255, .3)
|
||||
}
|
||||
color: rgba(255, 255, 255, 0.3); }
|
||||
|
||||
.head-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
border-radius: 50%
|
||||
}
|
||||
border-radius: 50%; }
|
||||
|
||||
small {
|
||||
font-size: 0.9em; }
|
||||
|
||||
.modal {
|
||||
background: rgba(0, 0, 0, .5);
|
||||
color: #ccc
|
||||
}
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
color: #ccc; }
|
||||
|
||||
.modal a {
|
||||
color: #c8c8c8
|
||||
}
|
||||
color: #c8c8c8; }
|
||||
|
||||
.modal ul {
|
||||
display: inline-block;
|
||||
}
|
||||
display: inline-block; }
|
||||
|
||||
.modal li {
|
||||
display: inline-block;
|
||||
/* word-wrap: break-word;*/
|
||||
padding:5px 10px;
|
||||
padding: 10px;
|
||||
margin: 4px;
|
||||
background: rgba(150, 150, 150, .2);
|
||||
-webkit-transition: all .2s ease-in-out;
|
||||
-moz-transition: all .2s ease-in-out;
|
||||
-ms-transition: all .2s ease-in-out;
|
||||
-o-transition: all .2s ease-in-out;
|
||||
border-radius: 150px;
|
||||
}
|
||||
background: rgba(150, 150, 150, 0.3);
|
||||
-webkit-transition: all 0.2s ease;
|
||||
-moz-transition: all 0.2s ease;
|
||||
-ms-transition: all 0.2s ease;
|
||||
-o-transition: all 0.2s ease;
|
||||
transition: all 0.2s ease;
|
||||
border-radius: 150px; }
|
||||
|
||||
.modal li:hover {
|
||||
background: rgba(200, 200, 200, .3);
|
||||
}
|
||||
background: rgba(200, 200, 200, 0.3); }
|
||||
|
||||
.modal h4 {
|
||||
margin-bottom: 38px
|
||||
}
|
||||
margin-bottom: 38px; }
|
||||
|
||||
.modal > .modal-footer {
|
||||
background: rgba(50, 50, 50, .6)
|
||||
}
|
||||
background: rgba(50, 50, 50, 0.6); }
|
||||
|
||||
.waves-effect.waves-brown .waves-ripple {
|
||||
background-color: rgba(230, 230, 230, .3)
|
||||
}
|
||||
background-color: rgba(230, 230, 230, 0.3); }
|
||||
|
||||
.typed-cursor {
|
||||
display: none; }
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
.cover-2 h2,
|
||||
.cover-2 p {
|
||||
width: 100%
|
||||
}
|
||||
width: 100%; }
|
||||
|
||||
.online-part {
|
||||
padding: 25% .7%
|
||||
}
|
||||
padding: 25% 0.7%; }
|
||||
|
||||
.rule {
|
||||
padding: 15px
|
||||
}
|
||||
padding: 15px; }
|
||||
|
||||
.admins > ul > a {
|
||||
display: block;
|
||||
border-radius: 0
|
||||
}
|
||||
border-radius: 0; }
|
||||
|
||||
.head-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 0;
|
||||
float: left;
|
||||
border-radius: 50%
|
||||
}
|
||||
border-radius: 50%; }
|
||||
|
||||
.modal li {
|
||||
display: block;
|
||||
width:95%;
|
||||
}
|
||||
}
|
||||
width: 95%; } }
|
||||
|
||||
/*# sourceMappingURL=main.css.map */
|
||||
|
|
7
css/main.css.map
Normal file
7
css/main.css.map
Normal file
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"version": 3,
|
||||
"mappings": "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",
|
||||
"sources": ["../scss/main.scss","../scss/_mixins.scss"],
|
||||
"names": [],
|
||||
"file": "main.css"
|
||||
}
|
|
@ -1 +1 @@
|
|||
#note a,a{color:#c8c8c8}#note,.admins,.page-title,.rank{text-align:center}.brand-logo,h2{font-family: 'Raleway', sans-serif;}*{margin:0;padding:0}body{margin-bottom:50px;background:url(../images/staff-bg.png) center fixed #222;color:#ccc}.nav-wrapper{background:rgba(0,0,0,.2)}.admins{width:85%;margin:0 auto;background:rgba(100,100,100,.1);padding:15px;border-radius:10px}.admins li{display:inline-block;padding:10px;background:rgba(100,100,100,.2);margin:5px;border-radius:50px;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-ms-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.admins li:hover{background:rgba(100,100,100,.5)}h2{font-size:1.5em}#note h5{margin-bottom:-15px}#note a{font-weight:700}.page-title{font-size:3.8em;font-weight:300}.brand-logo{font-size:2em;font-weight:200}@media only screen and (max-width:768px){.admins{width:95%}.admins li{display:block;border-radius:0}}
|
||||
#note a,a{color:#c8c8c8}#note,.admins,.page-title,.rank{text-align:center}.brand-logo,h2{font-family:'Raleway', sans-serif;}*{margin:0;padding:0}body{margin-bottom:50px;background:url(../images/staff-bg.png) center fixed #222;color:#ccc}.nav-wrapper{background:rgba(0,0,0,.2)}.admins{width:85%;margin:0 auto;background:rgba(100,100,100,.1);padding:15px;border-radius:10px}.admins li{display:inline-block;padding:10px;background:rgba(100,100,100,.2);margin:5px;border-radius:50px;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-ms-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.admins li:hover{background:rgba(100,100,100,.5)}h2{font-size:1.5em}#note h5{margin-bottom:-15px}#note a{font-weight:700}.page-title{font-size:3.8em;font-weight:300}.brand-logo{font-size:2em;font-weight:200} .typed-cursor { display: none; } @media only screen and (max-width:768px){.admins{width:95%}.admins li{display:block;border-radius:0}}
|
|
@ -8,8 +8,8 @@
|
|||
<meta name="author" content="aggelosQQ, markbyron, DarthSalamon, Madgeek1450, TotalFreedom">
|
||||
<meta name="keywords" content="TF,minecraft,totalfreedom,free op,server,worldedit,freebuild">
|
||||
<meta name="description" content="TotalFreedom is the first Free OP Minecraft server, which is up and running since 2010! play.totalfreedom.me">
|
||||
<link async rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
|
||||
<link async rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
|
||||
<link async rel="stylesheet" href="css/component.min.css">
|
||||
<link async rel="stylesheet" href="css/main.css">
|
||||
<link async rel="stylesheet" href="css/global.css">
|
||||
|
@ -214,8 +214,8 @@
|
|||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>
|
||||
<script src="js/typed.min.js"></script>
|
||||
<script src="https://use.fontawesome.com/cb2592f0cc.js"></script>
|
||||
<script src="js/typed.js"></script>
|
||||
<script src="js/moment.js"></script>
|
||||
<script src="js/jquery.cookies.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
|
|
10
js/main.js
10
js/main.js
|
@ -27,9 +27,9 @@ $(document).ready(function() {
|
|||
interval);
|
||||
|
||||
var refresh = function() {
|
||||
$.getJSON("http://us.mc-api.net/v3/server/info/play.totalfreedom.me:28965", function(json) {
|
||||
if (json.online !== true) {
|
||||
$("#online").html('<span style="color: firebrick; font-weight: bolder;"> Server is Offline</span>');
|
||||
$.getJSON("https://mcapi.ca/query/play.totalfreedom.me:28965/extensive", function(json) {
|
||||
if (json.status !== true) {
|
||||
$("#online").html('<span style="color: firebrick; font-weight: bolder;"> Server is Offline</span><br/><small style="font-size: .5em;">Check out our <a href="status">Associated Servers</a>!</small>');
|
||||
$(".button").hide();
|
||||
} else {
|
||||
$("#online").html('TotalFreedom has <font color="green">' + json.players.online + '</font> players online!<br/>');
|
||||
|
@ -42,13 +42,16 @@ $(document).ready(function() {
|
|||
refresh();
|
||||
});
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
$('.brand-logo').typed({
|
||||
strings: ['<small class="hide-on-med-and-down">play.</small>TotalFreedom<small class="hide-on-med-and-down">.me</small>'],
|
||||
typeSpeed: 30
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
(new Date).getFullYear();
|
||||
$("#curYear").text((new Date).getFullYear())
|
||||
});
|
||||
|
@ -113,6 +116,7 @@ $(document).ready(function(){
|
|||
});
|
||||
});
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
$("#top").click(function() {
|
||||
$('html, body').animate({
|
||||
|
|
438
js/typed.js
Normal file
438
js/typed.js
Normal file
|
@ -0,0 +1,438 @@
|
|||
// The MIT License (MIT)
|
||||
|
||||
// Typed.js | Copyright (c) 2016 Matt Boldt | www.mattboldt.com
|
||||
|
||||
// Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
// of this software and associated documentation files (the "Software"), to deal
|
||||
// in the Software without restriction, including without limitation the rights
|
||||
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
// copies of the Software, and to permit persons to whom the Software is
|
||||
// furnished to do so, subject to the following conditions:
|
||||
|
||||
// The above copyright notice and this permission notice shall be included in
|
||||
// all copies or substantial portions of the Software.
|
||||
|
||||
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
// THE SOFTWARE.
|
||||
|
||||
|
||||
|
||||
|
||||
! function($) {
|
||||
|
||||
"use strict";
|
||||
|
||||
var Typed = function(el, options) {
|
||||
|
||||
// chosen element to manipulate text
|
||||
this.el = $(el);
|
||||
|
||||
// options
|
||||
this.options = $.extend({}, $.fn.typed.defaults, options);
|
||||
|
||||
// attribute to type into
|
||||
this.isInput = this.el.is('input');
|
||||
this.attr = this.options.attr;
|
||||
|
||||
// show cursor
|
||||
this.showCursor = this.isInput ? false : this.options.showCursor;
|
||||
|
||||
// text content of element
|
||||
this.elContent = this.attr ? this.el.attr(this.attr) : this.el.text();
|
||||
|
||||
// html or plain text
|
||||
this.contentType = this.options.contentType;
|
||||
|
||||
// typing speed
|
||||
this.typeSpeed = this.options.typeSpeed;
|
||||
|
||||
// add a delay before typing starts
|
||||
this.startDelay = this.options.startDelay;
|
||||
|
||||
// backspacing speed
|
||||
this.backSpeed = this.options.backSpeed;
|
||||
|
||||
// amount of time to wait before backspacing
|
||||
this.backDelay = this.options.backDelay;
|
||||
|
||||
// div containing strings
|
||||
this.stringsElement = this.options.stringsElement;
|
||||
|
||||
// input strings of text
|
||||
this.strings = this.options.strings;
|
||||
|
||||
// character number position of current string
|
||||
this.strPos = 0;
|
||||
|
||||
// current array position
|
||||
this.arrayPos = 0;
|
||||
|
||||
// number to stop backspacing on.
|
||||
// default 0, can change depending on how many chars
|
||||
// you want to remove at the time
|
||||
this.stopNum = 0;
|
||||
|
||||
// Looping logic
|
||||
this.loop = this.options.loop;
|
||||
this.loopCount = this.options.loopCount;
|
||||
this.curLoop = 0;
|
||||
|
||||
// for stopping
|
||||
this.stop = false;
|
||||
|
||||
// custom cursor
|
||||
this.cursorChar = this.options.cursorChar;
|
||||
|
||||
// shuffle the strings
|
||||
this.shuffle = this.options.shuffle;
|
||||
// the order of strings
|
||||
this.sequence = [];
|
||||
|
||||
// All systems go!
|
||||
this.build();
|
||||
};
|
||||
|
||||
Typed.prototype = {
|
||||
|
||||
constructor: Typed,
|
||||
|
||||
init: function() {
|
||||
// begin the loop w/ first current string (global self.strings)
|
||||
// current string will be passed as an argument each time after this
|
||||
var self = this;
|
||||
self.timeout = setTimeout(function() {
|
||||
for (var i=0;i<self.strings.length;++i) self.sequence[i]=i;
|
||||
|
||||
// shuffle the array if true
|
||||
if(self.shuffle) self.sequence = self.shuffleArray(self.sequence);
|
||||
|
||||
// Start typing
|
||||
self.typewrite(self.strings[self.sequence[self.arrayPos]], self.strPos);
|
||||
}, self.startDelay);
|
||||
},
|
||||
|
||||
build: function() {
|
||||
var self = this;
|
||||
// Insert cursor
|
||||
if (this.showCursor === true) {
|
||||
this.cursor = $("<span class=\"typed-cursor\">" + this.cursorChar + "</span>");
|
||||
this.el.after(this.cursor);
|
||||
}
|
||||
if (this.stringsElement) {
|
||||
this.strings = [];
|
||||
this.stringsElement.hide();
|
||||
console.log(this.stringsElement.children());
|
||||
var strings = this.stringsElement.children();
|
||||
$.each(strings, function(key, value){
|
||||
self.strings.push($(value).html());
|
||||
});
|
||||
}
|
||||
this.init();
|
||||
},
|
||||
|
||||
// pass current string state to each function, types 1 char per call
|
||||
typewrite: function(curString, curStrPos) {
|
||||
// exit when stopped
|
||||
if (this.stop === true) {
|
||||
return;
|
||||
}
|
||||
|
||||
// varying values for setTimeout during typing
|
||||
// can't be global since number changes each time loop is executed
|
||||
var humanize = Math.round(Math.random() * (100 - 30)) + this.typeSpeed;
|
||||
var self = this;
|
||||
|
||||
// ------------- optional ------------- //
|
||||
// backpaces a certain string faster
|
||||
// ------------------------------------ //
|
||||
// if (self.arrayPos == 1){
|
||||
// self.backDelay = 50;
|
||||
// }
|
||||
// else{ self.backDelay = 500; }
|
||||
|
||||
// contain typing function in a timeout humanize'd delay
|
||||
self.timeout = setTimeout(function() {
|
||||
// check for an escape character before a pause value
|
||||
// format: \^\d+ .. eg: ^1000 .. should be able to print the ^ too using ^^
|
||||
// single ^ are removed from string
|
||||
var charPause = 0;
|
||||
var substr = curString.substr(curStrPos);
|
||||
if (substr.charAt(0) === '^') {
|
||||
var skip = 1; // skip atleast 1
|
||||
if (/^\^\d+/.test(substr)) {
|
||||
substr = /\d+/.exec(substr)[0];
|
||||
skip += substr.length;
|
||||
charPause = parseInt(substr);
|
||||
}
|
||||
|
||||
// strip out the escape character and pause value so they're not printed
|
||||
curString = curString.substring(0, curStrPos) + curString.substring(curStrPos + skip);
|
||||
}
|
||||
|
||||
if (self.contentType === 'html') {
|
||||
// skip over html tags while typing
|
||||
var curChar = curString.substr(curStrPos).charAt(0)
|
||||
if (curChar === '<' || curChar === '&') {
|
||||
var tag = '';
|
||||
var endTag = '';
|
||||
if (curChar === '<') {
|
||||
endTag = '>'
|
||||
}
|
||||
else {
|
||||
endTag = ';'
|
||||
}
|
||||
while (curString.substr(curStrPos + 1).charAt(0) !== endTag) {
|
||||
tag += curString.substr(curStrPos).charAt(0);
|
||||
curStrPos++;
|
||||
if (curStrPos + 1 > curString.length) { break; }
|
||||
}
|
||||
curStrPos++;
|
||||
tag += endTag;
|
||||
}
|
||||
}
|
||||
|
||||
// timeout for any pause after a character
|
||||
self.timeout = setTimeout(function() {
|
||||
if (curStrPos === curString.length) {
|
||||
// fires callback function
|
||||
self.options.onStringTyped(self.arrayPos);
|
||||
|
||||
// is this the final string
|
||||
if (self.arrayPos === self.strings.length - 1) {
|
||||
// animation that occurs on the last typed string
|
||||
self.options.callback();
|
||||
|
||||
self.curLoop++;
|
||||
|
||||
// quit if we wont loop back
|
||||
if (self.loop === false || self.curLoop === self.loopCount)
|
||||
return;
|
||||
}
|
||||
|
||||
self.timeout = setTimeout(function() {
|
||||
self.backspace(curString, curStrPos);
|
||||
}, self.backDelay);
|
||||
|
||||
} else {
|
||||
|
||||
/* call before functions if applicable */
|
||||
if (curStrPos === 0) {
|
||||
self.options.preStringTyped(self.arrayPos);
|
||||
}
|
||||
|
||||
// start typing each new char into existing string
|
||||
// curString: arg, self.el.html: original text inside element
|
||||
var nextString = curString.substr(0, curStrPos + 1);
|
||||
if (self.attr) {
|
||||
self.el.attr(self.attr, nextString);
|
||||
} else {
|
||||
if (self.isInput) {
|
||||
self.el.val(nextString);
|
||||
} else if (self.contentType === 'html') {
|
||||
self.el.html(nextString);
|
||||
} else {
|
||||
self.el.text(nextString);
|
||||
}
|
||||
}
|
||||
|
||||
// add characters one by one
|
||||
curStrPos++;
|
||||
// loop the function
|
||||
self.typewrite(curString, curStrPos);
|
||||
}
|
||||
// end of character pause
|
||||
}, charPause);
|
||||
|
||||
// humanized value for typing
|
||||
}, humanize);
|
||||
|
||||
},
|
||||
|
||||
backspace: function(curString, curStrPos) {
|
||||
// exit when stopped
|
||||
if (this.stop === true) {
|
||||
return;
|
||||
}
|
||||
|
||||
// varying values for setTimeout during typing
|
||||
// can't be global since number changes each time loop is executed
|
||||
var humanize = Math.round(Math.random() * (100 - 30)) + this.backSpeed;
|
||||
var self = this;
|
||||
|
||||
self.timeout = setTimeout(function() {
|
||||
|
||||
// ----- this part is optional ----- //
|
||||
// check string array position
|
||||
// on the first string, only delete one word
|
||||
// the stopNum actually represents the amount of chars to
|
||||
// keep in the current string. In my case it's 14.
|
||||
// if (self.arrayPos == 1){
|
||||
// self.stopNum = 14;
|
||||
// }
|
||||
//every other time, delete the whole typed string
|
||||
// else{
|
||||
// self.stopNum = 0;
|
||||
// }
|
||||
|
||||
if (self.contentType === 'html') {
|
||||
// skip over html tags while backspacing
|
||||
if (curString.substr(curStrPos).charAt(0) === '>') {
|
||||
var tag = '';
|
||||
while (curString.substr(curStrPos - 1).charAt(0) !== '<') {
|
||||
tag -= curString.substr(curStrPos).charAt(0);
|
||||
curStrPos--;
|
||||
if (curStrPos < 0) { break; }
|
||||
}
|
||||
curStrPos--;
|
||||
tag += '<';
|
||||
}
|
||||
}
|
||||
|
||||
// ----- continue important stuff ----- //
|
||||
// replace text with base text + typed characters
|
||||
var nextString = curString.substr(0, curStrPos);
|
||||
if (self.attr) {
|
||||
self.el.attr(self.attr, nextString);
|
||||
} else {
|
||||
if (self.isInput) {
|
||||
self.el.val(nextString);
|
||||
} else if (self.contentType === 'html') {
|
||||
self.el.html(nextString);
|
||||
} else {
|
||||
self.el.text(nextString);
|
||||
}
|
||||
}
|
||||
|
||||
// if the number (id of character in current string) is
|
||||
// less than the stop number, keep going
|
||||
if (curStrPos > self.stopNum) {
|
||||
// subtract characters one by one
|
||||
curStrPos--;
|
||||
// loop the function
|
||||
self.backspace(curString, curStrPos);
|
||||
}
|
||||
// if the stop number has been reached, increase
|
||||
// array position to next string
|
||||
else if (curStrPos <= self.stopNum) {
|
||||
self.arrayPos++;
|
||||
|
||||
if (self.arrayPos === self.strings.length) {
|
||||
self.arrayPos = 0;
|
||||
|
||||
// Shuffle sequence again
|
||||
if(self.shuffle) self.sequence = self.shuffleArray(self.sequence);
|
||||
|
||||
self.init();
|
||||
} else
|
||||
self.typewrite(self.strings[self.sequence[self.arrayPos]], curStrPos);
|
||||
}
|
||||
|
||||
// humanized value for typing
|
||||
}, humanize);
|
||||
|
||||
},
|
||||
/**
|
||||
* Shuffles the numbers in the given array.
|
||||
* @param {Array} array
|
||||
* @returns {Array}
|
||||
*/
|
||||
shuffleArray: function(array) {
|
||||
var tmp, current, top = array.length;
|
||||
if(top) while(--top) {
|
||||
current = Math.floor(Math.random() * (top + 1));
|
||||
tmp = array[current];
|
||||
array[current] = array[top];
|
||||
array[top] = tmp;
|
||||
}
|
||||
return array;
|
||||
},
|
||||
|
||||
// Start & Stop currently not working
|
||||
|
||||
// , stop: function() {
|
||||
// var self = this;
|
||||
|
||||
// self.stop = true;
|
||||
// clearInterval(self.timeout);
|
||||
// }
|
||||
|
||||
// , start: function() {
|
||||
// var self = this;
|
||||
// if(self.stop === false)
|
||||
// return;
|
||||
|
||||
// this.stop = false;
|
||||
// this.init();
|
||||
// }
|
||||
|
||||
// Reset and rebuild the element
|
||||
reset: function() {
|
||||
var self = this;
|
||||
clearInterval(self.timeout);
|
||||
var id = this.el.attr('id');
|
||||
this.el.empty();
|
||||
if (typeof this.cursor !== 'undefined') {
|
||||
this.cursor.remove();
|
||||
}
|
||||
this.strPos = 0;
|
||||
this.arrayPos = 0;
|
||||
this.curLoop = 0;
|
||||
// Send the callback
|
||||
this.options.resetCallback();
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
$.fn.typed = function(option) {
|
||||
return this.each(function() {
|
||||
var $this = $(this),
|
||||
data = $this.data('typed'),
|
||||
options = typeof option == 'object' && option;
|
||||
if (data) { data.reset(); }
|
||||
$this.data('typed', (data = new Typed(this, options)));
|
||||
if (typeof option == 'string') data[option]();
|
||||
});
|
||||
};
|
||||
|
||||
$.fn.typed.defaults = {
|
||||
strings: ["These are the default values...", "You know what you should do?", "Use your own!", "Have a great day!"],
|
||||
stringsElement: null,
|
||||
// typing speed
|
||||
typeSpeed: 0,
|
||||
// time before typing starts
|
||||
startDelay: 0,
|
||||
// backspacing speed
|
||||
backSpeed: 0,
|
||||
// shuffle the strings
|
||||
shuffle: false,
|
||||
// time before backspacing
|
||||
backDelay: 500,
|
||||
// loop
|
||||
loop: false,
|
||||
// false = infinite
|
||||
loopCount: false,
|
||||
// show cursor
|
||||
showCursor: true,
|
||||
// character for cursor
|
||||
cursorChar: "|",
|
||||
// attribute to type (null == text)
|
||||
attr: null,
|
||||
// either html or text
|
||||
contentType: 'html',
|
||||
// call when done callback function
|
||||
callback: function() {},
|
||||
// starting callback function before each string
|
||||
preStringTyped: function() {},
|
||||
//callback for every typed string
|
||||
onStringTyped: function() {},
|
||||
// callback for reset
|
||||
resetCallback: function() {}
|
||||
};
|
||||
|
||||
|
||||
}(window.jQuery);
|
|
@ -13,7 +13,6 @@
|
|||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>
|
||||
<script src="https://use.fontawesome.com/cb2592f0cc.js"></script>
|
||||
<script src="../js/typed.min.js"></script>
|
||||
<script src="../js/main.js"></script>
|
||||
<script src="assets/js/builders.js"></script>
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css" rel="stylesheet">
|
||||
|
@ -63,13 +62,13 @@
|
|||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/xfilez/80.png">xfilez</li>
|
||||
</a>
|
||||
<a href="http://totalfreedom.boards.net/user/5537" target="_blank">
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/CubsWorldChamps/80.png">CubsWorldChamps</li>
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/adamvandyck/80.png">adamvandyck</li>
|
||||
</a>
|
||||
<a href="#" target="_blank">
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/Fluffasaurus_Rex/80.png">Fluffasaurus_Rex</li>
|
||||
</a>
|
||||
<a href="http://totalfreedom.boards.net/user/14724" target="_blank">
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/MousekatBLI/80.png">MousekatBLI</li>
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/AcetoneAlligator/80.png">AcetoneAlligator</li>
|
||||
</a>
|
||||
<a href="http://totalfreedom.boards.net/user/16464" target="_blank">
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/Dusty01/80.png">Dusty01</li>
|
||||
|
@ -81,7 +80,7 @@
|
|||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/FelixtheTrap/80.png">FelixtheTrap</li>
|
||||
</a>
|
||||
<a href="http://totalfreedom.boards.net/user/11618" target="_blank">
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/iHaveSkills/80.png">iHaveSkills</li>
|
||||
<li><img class="responsive-img head-icon" src="https://minotar.net/avatar/Exotivity/80.png">Exotivity</li>
|
||||
</a>
|
||||
</ul><br>
|
||||
<hr>
|
||||
|
|
14
scss/_mixins.scss
Normal file
14
scss/_mixins.scss
Normal file
|
@ -0,0 +1,14 @@
|
|||
@mixin transition($info) {
|
||||
-webkit-transition: $info;
|
||||
-moz-transition: $info;
|
||||
-ms-transition: $info;
|
||||
-o-transition: $info;
|
||||
transition: $info;
|
||||
}
|
||||
|
||||
@mixin userselect($info) {
|
||||
user-select: $info;
|
||||
-moz-user-select: $info;
|
||||
-webkit-user-select: $info;
|
||||
-ms-user-select: $info;
|
||||
}
|
273
scss/main.scss
Normal file
273
scss/main.scss
Normal file
|
@ -0,0 +1,273 @@
|
|||
@import 'mixins';
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
body {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-weight:100;
|
||||
color: #fff;
|
||||
background: #222 url(../images/cover-1.png) center no-repeat fixed;
|
||||
background-size: cover
|
||||
}
|
||||
#rules-title,
|
||||
.button {
|
||||
@include transition(all .2s ease);
|
||||
z-index: 100;
|
||||
padding: 10px 55px;
|
||||
background: rgba(255, 255, 255, .1);
|
||||
color: #c8c8c8;
|
||||
&:hover {
|
||||
background: rgba(200, 200, 200, .2)
|
||||
}
|
||||
}
|
||||
|
||||
#rules-title {
|
||||
border-radius: 0px;
|
||||
}
|
||||
.admins ul,
|
||||
.cover-1,
|
||||
.cover-2,
|
||||
.cover-3 .section-title,
|
||||
.rank {
|
||||
text-align: center
|
||||
}
|
||||
.brand-logo {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px
|
||||
}
|
||||
.button-collapse {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 10px
|
||||
}
|
||||
.cover-1 {
|
||||
font-size: 1.5em;
|
||||
color: rgba(255, 255, 255, .4);
|
||||
height: 100vh
|
||||
}
|
||||
.cover-1 a,
|
||||
.cover-1 h3 {
|
||||
margin-top: 23%
|
||||
}
|
||||
|
||||
.cover-2 {
|
||||
background: url(../images/cover-2.png) center fixed;
|
||||
background-size: cover;
|
||||
height: auto;
|
||||
padding-bottom: 40px
|
||||
}
|
||||
.rule {
|
||||
z-index: 100;
|
||||
display: none;
|
||||
padding: 30px
|
||||
}
|
||||
#rules-title,
|
||||
.admins>ul>a {
|
||||
padding: 10px;
|
||||
display: inline-block
|
||||
}
|
||||
#rules-title {
|
||||
font-size: 2.2em;
|
||||
background: rgba(230, 230, 230, .1);
|
||||
cursor: pointer;
|
||||
@include userselect(none);
|
||||
@include transition(all .2s ease);
|
||||
}
|
||||
#rules-title:hover {
|
||||
background: rgba(210, 210, 210, .2)
|
||||
}
|
||||
.admins>ul>a,
|
||||
i.rules-icon {
|
||||
@include transition(all .2s ease);
|
||||
}
|
||||
i.rules-icon {
|
||||
position: relative;
|
||||
float: right;
|
||||
color: rgba(150, 150, 150, .3);
|
||||
@include transition(all .2s ease);
|
||||
&:hover {
|
||||
color: rgba(150, 150, 150, 1)
|
||||
}
|
||||
}
|
||||
.cover-2 h2,
|
||||
.cover-2 p {
|
||||
width: 75%;
|
||||
margin: 0 auto
|
||||
}
|
||||
.cover-2 p {
|
||||
font-size: 1.2em;
|
||||
height: auto
|
||||
}
|
||||
.section-title {
|
||||
font-size: 4em;
|
||||
color: rgba(255, 255, 255, .9);
|
||||
z-index: 100
|
||||
}
|
||||
.cover-3 {
|
||||
background: url(../images/cover-3.png) no-repeat fixed;
|
||||
background-size: cover
|
||||
}
|
||||
.admins>ul>a {
|
||||
margin: 5px;
|
||||
background: rgba(0, 0, 0, .3);
|
||||
@include transition(all .2s ease);
|
||||
border-radius: 150px;
|
||||
z-index: 200;
|
||||
}
|
||||
.admins>ul>a:hover {
|
||||
background: rgba(100, 100, 100, .3);
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
.admins ul {
|
||||
z-index: 101
|
||||
}
|
||||
.admins a li {
|
||||
color: rgba(255, 255, 255, .5);
|
||||
font-size: 1.2em;
|
||||
z-index: 102
|
||||
}
|
||||
.rank {
|
||||
font-size: 2em;
|
||||
z-index: 103
|
||||
}
|
||||
.rest>li>a,
|
||||
.useful a {
|
||||
padding: 10px;
|
||||
z-index: 100;
|
||||
text-align: center
|
||||
}
|
||||
.cover-1,
|
||||
.cover-2,
|
||||
.cover-3 {
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .2)
|
||||
}
|
||||
.rest>li>a {
|
||||
font-size: 1.5em;
|
||||
color: rgba(255, 255, 255, .6);
|
||||
border-radius: 50px;
|
||||
@include transition(all .2s ease);
|
||||
}
|
||||
.rest>li>a:hover {
|
||||
background: rgba(255, 255, 255, .2);
|
||||
color: #fff
|
||||
}
|
||||
.rest>li {
|
||||
margin-top: 50px;
|
||||
@include transition(all .2s ease);
|
||||
}
|
||||
.rest>li:hover {
|
||||
transform: translateX(5px)
|
||||
}
|
||||
.useful a {
|
||||
display: inline-block;
|
||||
font-size: 1.2em;
|
||||
color: rgba(255, 255, 255, .6);
|
||||
border: 2px solid rgba(255, 255, 255, .6);
|
||||
margin-right: 10px;
|
||||
border-radius: 50px;
|
||||
width: 200px;
|
||||
@include transition(all .2s ease);
|
||||
margin-bottom: 10px
|
||||
}
|
||||
.useful>a>li>i {
|
||||
font-size: 2em;
|
||||
margin-bottom: 10px
|
||||
}
|
||||
.useful a:hover {
|
||||
background: rgba(255, 255, 255, .2);
|
||||
color: #fff;
|
||||
transform: translateY(-5px)
|
||||
}
|
||||
#note {
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
border-radius: 150px;
|
||||
padding: 15px;
|
||||
z-index: 1
|
||||
}
|
||||
#note h5 {
|
||||
margin-bottom: -20px
|
||||
}
|
||||
#note a {
|
||||
color: #c8c8c8;
|
||||
font-weight: 700
|
||||
}
|
||||
.nav-wrapper {
|
||||
background: rgba(0, 0, 0, .3)
|
||||
}
|
||||
.cover-2 a {
|
||||
font-size: 1.3em;
|
||||
color: rgba(255, 255, 255, .3)
|
||||
}
|
||||
.head-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
border-radius: 50%
|
||||
}
|
||||
|
||||
small {
|
||||
font-size:0.9em;
|
||||
}
|
||||
.modal {
|
||||
background: rgba(0, 0, 0, .5);
|
||||
color: #ccc
|
||||
}
|
||||
.modal a {
|
||||
color: #c8c8c8
|
||||
}
|
||||
.modal ul {
|
||||
display: inline-block;
|
||||
}
|
||||
.modal li {
|
||||
display: inline-block;
|
||||
/* word-wrap: break-word;*/
|
||||
padding:10px;
|
||||
margin:4px;
|
||||
background: rgba(150, 150, 150, .3);
|
||||
@include transition(all .2s ease);
|
||||
border-radius: 150px;
|
||||
}
|
||||
.modal li:hover {
|
||||
background: rgba(200, 200, 200, .3);
|
||||
}
|
||||
.modal h4 {
|
||||
margin-bottom: 38px
|
||||
}
|
||||
.modal>.modal-footer {
|
||||
background: rgba(50, 50, 50, .6)
|
||||
}
|
||||
.waves-effect.waves-brown .waves-ripple {
|
||||
background-color: rgba(230, 230, 230, .3)
|
||||
}
|
||||
.typed-cursor { display: none; }
|
||||
|
||||
@media only screen and (max-width: 768px) {
|
||||
.cover-2 h2,
|
||||
.cover-2 p {
|
||||
width: 100%
|
||||
}
|
||||
.online-part {
|
||||
padding: 25% .7%
|
||||
}
|
||||
.rule {
|
||||
padding: 15px
|
||||
}
|
||||
.admins>ul>a {
|
||||
display: block;
|
||||
border-radius: 0
|
||||
}
|
||||
.head-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 0;
|
||||
float: left;
|
||||
border-radius: 50%
|
||||
}
|
||||
.modal li {
|
||||
display: block;
|
||||
width:95%;
|
||||
}
|
||||
}
|
47
staff.html
47
staff.html
|
@ -8,13 +8,6 @@
|
|||
<meta name="author" content="aggelosQQ, markbyron, DarthSalamon, Madgeek1450, TotalFreedom">
|
||||
<meta name="kewords" content="TF,minecraft,totalfreedom,free op,server,worldedit,freebuild">
|
||||
<meta name="description" content="TotalFreedom is the first Free OP Minecraft server, which is up and running since 2012! play.totalfreedom.me">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>
|
||||
<script src="js/moment.js"></script>
|
||||
<script src="js/jquery.cookies.js"></script>
|
||||
<script src="js/functions.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
<script src="https://use.fontawesome.com/cb2592f0cc.js"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Catamaran:200" rel="stylesheet">
|
||||
<link rel="stylesheet" href="css/component.min.css">
|
||||
|
@ -22,27 +15,13 @@
|
|||
<link rel="stylesheet" href="css/staff.css">
|
||||
<link rel=”icon” href=”favicon.ico” type=”image/x-icon”>
|
||||
<link rel=”shortcut icon” href=”favicon.ico” type=”image/x-icon”>
|
||||
<script>
|
||||
// All Json content is loaded respectively into #(item)
|
||||
var jsonUrl = "http://madgeekonline.com/tfinfo/";
|
||||
var jsonContent = [
|
||||
"developers",
|
||||
"superadmins",
|
||||
"telnetadmins",
|
||||
"senioradmins"
|
||||
];
|
||||
|
||||
$(document).ready(function() {
|
||||
loadJson(jsonUrl, jsonContent);
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="load_screen" class="load_screen"><div id="loading">Loading TotalFreedom's Staff..<div class="progress"><div class="indeterminate"></div></div><br/><span class="skip">I don't want to wait!</span>
|
||||
</div></div>
|
||||
<nav class="transparent z-depth-0" id="menu">
|
||||
<div class="nav-wrapper z-depth-0">
|
||||
<a href="#header" class="brand-logo">TotalFreedom <span class="hide-on-med-and-down">Staff</span></small></a>
|
||||
<a href="#" id="brand-top" class="brand-logo"></a> <a href="#" data-activates="mobile" class="button-collapse"><i class="fa fa-bars"></i></a>
|
||||
<a href="#" data-activates="mobile" class="button-collapse"><i class="fa fa-bars"></i></a>
|
||||
<ul class="right hide-on-med-and-down cl-effect-14" id="cl-effect-14">
|
||||
<li><a href="index.html">Back to Home</a></li>
|
||||
|
@ -75,5 +54,29 @@
|
|||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/js/materialize.min.js"></script>
|
||||
<script src="js/typed.js"></script>
|
||||
<script src="js/moment.js"></script>
|
||||
<script src="js/jquery.cookies.js"></script>
|
||||
<script src="js/functions.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
<script src="https://use.fontawesome.com/cb2592f0cc.js"></script>
|
||||
|
||||
<script>
|
||||
// All Json content is loaded respectively into #(item)
|
||||
var jsonUrl = "http://madgeekonline.com/tfinfo/";
|
||||
var jsonContent = [
|
||||
"developers",
|
||||
"superadmins",
|
||||
"telnetadmins",
|
||||
"senioradmins"
|
||||
];
|
||||
|
||||
$(document).ready(function() {
|
||||
loadJson(jsonUrl, jsonContent);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1 +0,0 @@
|
|||
This file is not used for anything.
|
Loading…
Reference in a new issue