Many updates that beautified the page a lot

This commit is contained in:
aggelosQQ 2017-02-08 17:00:42 +02:00
parent f8fbae45a6
commit ef16cecf50
7 changed files with 849 additions and 350 deletions

View file

@ -1,308 +1,348 @@
* { * {
margin: 0; margin: 0;
padding: 0; } padding: 0; }
body { body {
font-family: 'Raleway', sans-serif; font-family: 'Raleway', sans-serif;
font-weight: 100; font-weight: 300;
color: #fff; color: #fff;
background: #222 url(../images/cover-1.png) center no-repeat fixed; background: #222 url(../images/cover-1.png) center no-repeat fixed;
background-size: cover; } background-size: cover; }
#rules-title, #rules-title,
.button { .button {
-webkit-transition: all 0.2s ease; -webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease; -moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease; -ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease; -o-transition: all 0.2s ease;
transition: all 0.2s ease; transition: all 0.2s ease;
z-index: 100; z-index: 100;
padding: 10px 55px; padding: 10px 55px;
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
color: #c8c8c8; } color: #c8c8c8; }
#rules-title:hover, #rules-title:hover,
.button:hover { .button:hover {
background: rgba(200, 200, 200, 0.2); } background: rgba(200, 200, 200, 0.2); }
#rules-title { #online {
border-radius: 0px; } font-weight: 200; }
.admins ul, #rules-title {
.cover-1, border-radius: 0px; }
.cover-2,
.cover-3 .section-title, .admins ul,
.rank { .cover-1,
text-align: center; .cover-2,
position: relative; } .cover-3 .section-title,
.rank {
.brand-logo { text-align: center;
margin-top: 5px; position: relative; }
margin-bottom: 5px; }
.brand-logo {
.button-collapse { margin-top: 5px;
margin-top: 5px; margin-bottom: 5px;
margin-bottom: 10px; } font-weight: 100; }
.cover-1 { .button-collapse {
font-size: 1.5em; margin-top: 5px;
color: rgba(255, 255, 255, 0.4); margin-bottom: 10px; }
height: 100vh; }
.cover-1 {
.cover-1 a, font-size: 1.5em;
.cover-1 h3 { color: rgba(255, 255, 255, 0.4);
margin-top: 23%; } height: 100vh; }
.cover-2 { .cover-1 a,
background: url(../images/cover-2.png) center fixed; .cover-1 h3 {
background-size: cover; margin-top: 23%; }
height: auto;
padding-bottom: 40px; } .cover-2 {
background: url(../images/cover-2.png) center fixed;
.rule { background-size: cover;
z-index: 100; height: auto;
display: none; padding-bottom: 40px; }
padding: 30px; }
.rule {
#rules-title, z-index: 100;
.admins > ul > a { display: none;
padding: 10px; padding: 30px; }
display: inline-block; }
#rules-title,
#rules-title { .admins > ul > a {
font-size: 2.2em; padding: 10px;
background: rgba(230, 230, 230, 0.1); display: inline-block; }
cursor: pointer;
user-select: none; #rules-title {
-moz-user-select: none; font-size: 1.9em;
-webkit-user-select: none; background: rgba(180, 180, 180, 0.1);
-ms-user-select: none; cursor: pointer;
-webkit-transition: all 0.2s ease; user-select: none;
-moz-transition: all 0.2s ease; -moz-user-select: none;
-ms-transition: all 0.2s ease; -webkit-user-select: none;
-o-transition: all 0.2s ease; -ms-user-select: none;
transition: all 0.2s ease; } -webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
#rules-title:hover { -ms-transition: all 0.2s ease;
background: rgba(210, 210, 210, 0.2); } -o-transition: all 0.2s ease;
transition: all 0.2s ease; }
.admins > ul > a,
i.rules-icon { #rules-title:hover {
-webkit-transition: all 0.2s ease; background: rgba(150, 150, 150, 0.2);
-moz-transition: all 0.2s ease; -webkit-transform: scale(1.03, 1.03);
-ms-transition: all 0.2s ease; -ms-transform: scale(1.03, 1.03);
-o-transition: all 0.2s ease; transform: scale(1.03, 1.03); }
transition: all 0.2s ease; }
.admins > ul > a,
i.rules-icon { i.rules-icon {
position: relative; -webkit-transition: all 0.2s ease;
float: right; -moz-transition: all 0.2s ease;
color: rgba(150, 150, 150, 0.3); -ms-transition: all 0.2s ease;
-webkit-transition: all 0.2s ease; -o-transition: all 0.2s ease;
-moz-transition: all 0.2s ease; transition: all 0.2s ease; }
-ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease; i.rules-icon {
transition: all 0.2s ease; } position: relative;
i.rules-icon:hover { float: right;
color: #969696; } color: rgba(150, 150, 150, 0.3);
-webkit-transition: all 0.2s ease;
.cover-2 h2, -moz-transition: all 0.2s ease;
.cover-2 p { -ms-transition: all 0.2s ease;
width: 75%; -o-transition: all 0.2s ease;
margin: 0 auto; } transition: all 0.2s ease; }
i.rules-icon:hover {
.cover-2 p { color: #969696; }
font-size: 1.2em;
height: auto; } .cover-2 h2,
.cover-2 p {
.section-title { width: 75%;
font-size: 4em; font-weight: 300;
color: rgba(255, 255, 255, 0.9); margin: 0 auto; }
z-index: 100; }
.cover-2 p {
.cover-3 { font-size: 1.2em;
background: url(../images/cover-3.png) no-repeat fixed; height: auto; }
background-size: cover; }
.section-title {
.admins > ul > a { font-size: 2.5em;
margin: 5px; color: white;
background: rgba(0, 0, 0, 0.3); z-index: 100;
-webkit-transition: all 0.2s ease; font-weight: 100; }
-moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease; .cover-3 {
-o-transition: all 0.2s ease; background: url(../images/cover-3.png) no-repeat fixed;
transition: all 0.2s ease; background-size: cover; }
border-radius: 150px;
z-index: 200; } .admins > ul > a {
margin: 5px;
.admins > ul > a:hover { background: rgba(0, 0, 0, 0.3);
background: rgba(100, 100, 100, 0.3); -webkit-transition: all 0.2s ease;
transform: translateY(-4px); } -moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
.admins ul { -o-transition: all 0.2s ease;
z-index: 101; } transition: all 0.2s ease;
border-radius: 5px;
.admins a li { z-index: 200;
color: rgba(255, 255, 255, 0.5); font-size: 0.9em; }
font-size: 1.2em;
z-index: 102; } .admins > ul > a:hover {
background: rgba(70, 70, 70, 0.15);
.rank { -webkit-transform: translateY(-3px);
font-size: 2em; -ms-transform: translateY(-3px);
z-index: 103; } transform: translateY(-3px); }
.rest > li > a, .admins ul {
.useful a { z-index: 101; }
padding: 10px;
z-index: 100; .admins a li {
text-align: center; } color: rgba(255, 255, 255, 0.5);
font-size: 1.1em;
.cover-1, z-index: 102;
.cover-2, font-weight: 300; }
.cover-3 {
border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .rank {
font-size: 1.6em;
.rest > li > a { z-index: 103;
font-size: 1.5em; font-weight: 200; }
color: rgba(255, 255, 255, 0.6);
border-radius: 50px; .rest > li > a,
-webkit-transition: all 0.2s ease; .useful a {
-moz-transition: all 0.2s ease; padding: 10px;
-ms-transition: all 0.2s ease; z-index: 100;
-o-transition: all 0.2s ease; text-align: center; }
transition: all 0.2s ease; }
.cover-1,
.rest > li > a:hover { .cover-2,
background: rgba(255, 255, 255, 0.2); .cover-3 {
color: #fff; } border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
.rest > li { .rest > li > a {
margin-top: 50px; font-size: 1.35em;
-webkit-transition: all 0.2s ease; font-weight: 300;
-moz-transition: all 0.2s ease; color: rgba(255, 255, 255, 0.6);
-ms-transition: all 0.2s ease; border-radius: 10px;
-o-transition: all 0.2s ease; -webkit-transition: all 0.2s ease;
transition: all 0.2s ease; } -moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
.rest > li:hover { -o-transition: all 0.2s ease;
transform: translateX(5px); } transition: all 0.2s ease;
display: inline-block; }
.useful a {
display: inline-block; .rest > li > a:hover {
font-size: 1.2em; background: rgba(100, 100, 100, 0.2);
color: rgba(255, 255, 255, 0.6); color: #fff; }
border: 2px solid rgba(255, 255, 255, 0.6);
margin-right: 10px; .rest > li {
border-radius: 50px; margin-top: 50px;
width: 200px; display: inline-block;
-webkit-transition: all 0.2s ease; -webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease; -moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease; -ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease; -o-transition: all 0.2s ease;
transition: all 0.2s ease; transition: all 0.2s ease; }
margin-bottom: 10px; }
.rest > li:hover {
.useful > a > li > i { -webkit-transform: translateX(5px);
font-size: 2em; -ms-transform: translateX(5px);
margin-bottom: 10px; } transform: translateX(5px); }
.useful a:hover { .useful a {
background: rgba(255, 255, 255, 0.2); display: inline-block;
color: #fff; font-size: 1.05em;
transform: translateY(-5px); } color: rgba(255, 255, 255, 0.6);
border: 2px solid rgba(200, 200, 200, 0.3);
#note { margin-right: 10px;
text-align: center; border-radius: 50px;
color: #ccc; width: 200px;
border-radius: 150px; -webkit-transition: all 0.2s ease;
padding: 15px; -moz-transition: all 0.2s ease;
z-index: 1; } -ms-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
#note h5 { transition: all 0.2s ease;
margin-bottom: -20px; } margin-bottom: 10px; }
#note a { .useful h3 {
color: #c8c8c8; font-weight: 100; }
font-weight: 700; }
.useful > a > li > i {
.nav-wrapper { font-size: 2em;
background: rgba(0, 0, 0, 0.3); } margin-bottom: 10px; }
.cover-2 a { .useful a:hover {
font-size: 1.3em; background: rgba(100, 100, 100, 0.1);
color: rgba(255, 255, 255, 0.3); } color: #fff;
-webkit-transform: translateY(-5px);
.head-icon { -ms-transform: translateY(-5px);
width: 20px; transform: translateY(-5px); }
height: 20px;
float: left; #note {
margin-right: 5px; text-align: center;
border-radius: 50%; } color: #ccc;
border-radius: 150px;
small { padding: 15px;
font-size: 0.9em; } z-index: 1; }
.modal { #note h5 {
background: rgba(0, 0, 0, 0.5); margin-bottom: -20px; }
color: #ccc; }
#note a {
.modal a { color: #c8c8c8;
color: #c8c8c8; } font-weight: 700; }
.modal ul { .nav-wrapper {
display: inline-block; } margin: -8px;
background: rgba(20, 20, 20, 0.5); }
.modal li { .nav-wrapper li > a {
display: inline-block; font-weight: 200;
/* word-wrap: break-word;*/ font-size: .9em; }
padding: 10px;
margin: 4px; .cover-2 a {
background: rgba(150, 150, 150, 0.3); font-size: 1.17em;
-webkit-transition: all 0.2s ease; color: rgba(255, 255, 255, 0.3); }
-moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease; .head-icon {
-o-transition: all 0.2s ease; width: 20px;
transition: all 0.2s ease; height: 20px;
border-radius: 150px; } float: left;
margin-right: 5px;
.modal li:hover { border-radius: 2px; }
background: rgba(200, 200, 200, 0.3); }
small {
.modal h4 { font-size: 0.9em; }
margin-bottom: 38px; }
.modal {
.modal > .modal-footer { background: rgba(10, 10, 10, 0.8);
background: rgba(50, 50, 50, 0.6); } color: #ccc; }
.waves-effect.waves-brown .waves-ripple { .modal a {
background-color: rgba(230, 230, 230, 0.3); } color: #c8c8c8; }
.typed-cursor { .modal ul {
display: none; } display: inline-block; }
@media only screen and (max-width: 768px) { .modal li {
.cover-2 h2, display: inline-block;
.cover-2 p { padding: 10px;
width: 100%; } margin: 4px;
background: rgba(100, 100, 100, 0.2);
.online-part { -webkit-transition: all 0.2s ease;
padding: 25% 0.7%; } -moz-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
.rule { -o-transition: all 0.2s ease;
padding: 15px; } transition: all 0.2s ease;
border-radius: 5px;
.admins > ul > a { font-size: 0.8em; }
display: block;
border-radius: 0; } .modal li:hover {
background: rgba(150, 150, 150, 0.3); }
.head-icon {
width: 20px; .modal h4 {
height: 20px; margin-bottom: 38px;
margin-right: 0; font-size: 1.2em;
float: left; font-weight: 400; }
border-radius: 50%; }
.modal-msg {
.modal li { background: rgba(34, 34, 34, 0.3);
display: block; display: inline-block;
width: 95%; } } margin: 100px auto;
padding: 20px 40px; }
/*# sourceMappingURL=main.css.map */ .modal-msg h5 {
font-weight: 100;
font-size: 0.85em;
border-bottom: 3px solid rgba(204, 204, 204, 0.3);
padding-bottom: 20px; }
.modal-msg span {
font-size: 0.9em;
font-weight: 200; }
.modal > .modal-footer {
background: rgba(50, 50, 50, 0.3); }
.modal > .modal-footer .modal-close {
font-size: .9em;
text-transform: none; }
.waves-effect.waves-brown .waves-ripple {
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%; }
.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%; } }

View file

@ -1 +1,72 @@
#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}} #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, 0.2); }
.admins {
width: 85%;
margin: 0 auto;
background: rgba(100, 100, 100, 0.1);
padding: 15px;
border-radius: 10px; }
.admins li {
display: inline-block;
padding: 10px;
background: rgba(100, 100, 100, 0.2);
margin: 5px;
border-radius: 5px;
-webkit-transition: all 0.13s ease-in-out;
-moz-transition: all 0.13s ease-in-out;
-ms-transition: all 0.13s ease-in-out;
-o-transition: all 0.13s ease-in-out;
transition: all 0.13s ease-in-out; }
.admins li:hover {
background: rgba(200, 200, 200, 0.2); }
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; } }

View file

@ -8,7 +8,7 @@
<meta name="author" content="aggelosQQ, markbyron, DarthSalamon, Madgeek1450, TotalFreedom"> <meta name="author" content="aggelosQQ, markbyron, DarthSalamon, Madgeek1450, TotalFreedom">
<meta name="keywords" content="TF,minecraft,totalfreedom,free op,server,worldedit,freebuild"> <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"> <meta name="description" content="TotalFreedom is the first Free OP Minecraft server, which is up and running since 2010! play.totalfreedom.me">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet"> <link href="https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600" 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="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/component.min.css">
<link async rel="stylesheet" href="css/main.css"> <link async rel="stylesheet" href="css/main.css">
@ -50,8 +50,15 @@
<h4 id="players-online"> <h4 id="players-online">
</h5> </h5>
<ul id="players"></ul> <ul id="players"></ul>
<div class="modal-msg">
<h5>Why don't you visit us yourself?</h5>
<span class="ip">play.totalfreedom.me</span>
</div>
</div>
<div class="modal-footer">
<a href="#!" class="modal-action modal-close btn-flat waves-effect waves-dark">I'm Done</a>
</div> </div>
<div class="modal-footer"> <a href="#!" class=" modal-action modal-close btn-flat waves-effect waves-dark">Close</a> </div>
</div> </div>
</div> </div>
<div class="section cover-2" id="rules-sec"> <div class="section cover-2" id="rules-sec">
@ -76,9 +83,12 @@
<h2 id="rules-title" class="five waves-effect waves-brown">Adhere to Authority <i class="fa fa-chevron-right rules-icon hide-on-med-and-down"></i></h2> <h2 id="rules-title" class="five waves-effect waves-brown">Adhere to Authority <i class="fa fa-chevron-right rules-icon hide-on-med-and-down"></i></h2>
<p class="rule e">Do not override the actions of the server owner (markbyron) or other admins. For example, if an admin de-ops or bans a player for griefing, you may not re-op or pardon them without permission. Super admins will follow the directions of senior admins with respect to any admin matter unless it violates server rules. If it violates the rules, the admin will notify the proper authority.</p> <p class="rule e">Do not override the actions of the server owner (markbyron) or other admins. For example, if an admin de-ops or bans a player for griefing, you may not re-op or pardon them without permission. Super admins will follow the directions of senior admins with respect to any admin matter unless it violates server rules. If it violates the rules, the admin will notify the proper authority.</p>
</div> </div>
<br>
<p class="caution"><i class="fa fa-exclamation-circle"></i> TotalFreedom does not accept donations.</p>
<a href="http://totalfreedom.boards.net/thread/21065/server-conduct-policy-players-admins">Read more</a> <p class="caution"><i class="fa fa-exclamation-triangle"></i> TotalFreedom does not accept donations.</p>
<a class="grey-text" href="http://totalfreedom.boards.net/thread/21065/server-conduct-policy-players-admins">Read the Conduct Policy</a>
<h1 class="section-title">TotalFreedom Help</h1> <h1 class="section-title">TotalFreedom Help</h1>
<div class="rules-section"> <div class="rules-section">
<h2 id="rules-title" class="six">Saving Builds <i class="fa fa-chevron-right rules-icon hide-on-med-and-down"></i></h2> <h2 id="rules-title" class="six">Saving Builds <i class="fa fa-chevron-right rules-icon hide-on-med-and-down"></i></h2>
@ -170,14 +180,15 @@
</ul> </ul>
<div class="container"> <div class="container">
<ul class="rest"> <ul class="rest">
<li><a href="staff.html" class="readmore waves-effect waves-light">See the rest of the staff <i class="fa fa-arrow-right"></i></a></li> <li><a href="staff.html" class="readmore waves-effect waves-light">See the rest of the staff <i class="fa fa-chevron-right fa-fw"></i></a></li>
<br/> <br/>
</ul> </ul>
<br/> <br/>
<hr> <hr>
<br/> <br/>
<h3 style="text-align: center;">Useful Links</h3>
<ul class="useful"> <ul class="useful">
<h3 style="text-align: center;">Useful Links</h3>
<a href="http://totalfreedom.boards.net" target="_blank" class="readmore waves-effect waves-dark"> <a href="http://totalfreedom.boards.net" target="_blank" class="readmore waves-effect waves-dark">
<li><i class="fa fa-comments icon"></i><br/> Forum</li> <li><i class="fa fa-comments icon"></i><br/> Forum</li>
</a> </a>

View file

@ -12,7 +12,7 @@ $(document).ready(function() {
$(".button").hide(); $(".button").hide();
} else { } else {
$("#online").html('TotalFreedom has <font color="green">' + json.players.online + '</font> players online!<br/>'); $("#online").html('TotalFreedom has <font color="green">' + json.players.online + '</font> players online!<br/>');
$("#players-online").html(json.players.online + ' online players!'); $("#players-online").html(json.players.online + ' Online Players!');
$('.button').show(); $('.button').show();
} }
}); });

244
prepros-6.config Normal file
View file

@ -0,0 +1,244 @@
{
"name": "Website",
"firstRun": false,
"exportConfig": true,
"fileConfigs": [],
"fileTree": {
"expandedDirs": [],
"hideSystemFiles": true,
"systemFiles": [
".*",
"desktop.ini",
"prepros.config",
"$RECYCLE.BIN",
"prepros.cfg",
"prepros-6.config",
"Prepros Export"
],
"hideUnwatchedFiles": false
},
"imports": [
{
"path": "scss/main.scss",
"imports": [
"scss/_mixins.scss"
]
},
{
"path": "scss/staff.scss",
"imports": [
"scss/_mixins.scss"
]
}
],
"projectView": {
"selectedView": "log"
},
"fileWatcher": {
"enabled": true,
"watchedExtensions": [
"less",
"sass",
"scss",
"styl",
"md",
"markdown",
"coffee",
"js",
"jade",
"haml",
"slim",
"ls",
"kit",
"png",
"jpg",
"jpeg",
"ts",
"pug",
"css",
"html",
"htm",
"php"
]
},
"pathFilters": [
"node_modules",
".*",
"bower_components",
"prepros.config",
"Prepros Export",
"prepros-6.config",
"prepros.cfg",
"wp-admin",
"wp-includes"
],
"server": {
"port": 7880,
"assignNewPortAutomatically": true,
"enable": true,
"proxy": {
"enable": false,
"url": ""
}
},
"browser-sync": {
"enable": false,
"clicks": true,
"forms": true,
"scroll": true
},
"live-reload": {
"enable": true,
"animate": true,
"delay": 0
},
"ftp-deploy": {
"connectionType": "ftp",
"remotePath": "",
"uploadTimeout": 20000,
"uploadOnChange": false,
"ftp": {
"secure": false,
"host": "",
"port": 21,
"user": "",
"password": ""
},
"sftp": {
"host": "",
"port": 22,
"usePrivateKey": false,
"username": "",
"password": "",
"privateKey": "",
"passphrase": ""
},
"pathFilters": [
"config.rb",
"prepros.config",
"prepros-6.config",
"node_modules",
"Prepros Export",
".git",
".idea",
".sass-cache",
".hg",
".svn",
".cache",
".DS_Store",
"*.sass",
"*.scss",
"*.less",
"*.pug",
"*.jade",
"*.styl",
"*.haml",
"*.slim",
"*.coffee",
"*.ls",
"*.kit",
"*.ts"
],
"history": []
},
"file-type-sass": "{\"compilers\":[\"node-sass\",\"autoprefixer\",\"minify-css\"]}",
"file-type-less": "{\"compilers\":[\"less\",\"autoprefixer\",\"minify-css\"]}",
"autoprefixer": {
"browsers": "last 5 versions"
},
"file-type-pug": "{\"compilers\":[\"pug\"]}",
"file-type-css": "{\"compilers\":[\"autoprefixer\",\"cssnext\",\"minify-css\"]}",
"file-type-javascript": "{\"compilers\":[\"concat-js\",\"babel\",\"uglify-js\"]}",
"file-type-stylus": "{\"compilers\":[\"stylus\",\"autoprefixer\",\"minify-css\"]}",
"file-type-markdown": "{\"compilers\":[\"markdown\"]}",
"file-type-haml": "{\"compilers\":[\"haml\"]}",
"file-type-slim": "{\"compilers\":[\"slim\"]}",
"file-type-coffee-script": "{\"compilers\":[\"coffee-script\",\"uglify-js\"]}",
"file-type-livescript": "{\"compilers\":[\"livescript\",\"uglify-js\"]}",
"file-type-kit": "{\"compilers\":[\"kit\"]}",
"uglify-js": {
"compress": {
"sequences": true,
"properties": true,
"dead_code": true,
"drop_debugger": true,
"unsafe": false,
"unsafe_comps": false,
"conditionals": true,
"comparisons": true,
"evaluate": true,
"booleans": true,
"loops": true,
"unused": true,
"hoist_funs": true,
"keep_fargs": false,
"hoist_vars": false,
"if_return": true,
"join_vars": true,
"cascade": true,
"side_effects": true,
"pure_getters": false,
"negate_iife": true,
"screw_ie8": false,
"drop_console": false,
"angular": false,
"warnings": false,
"pure_funcs": [],
"global_defs": []
},
"output": {
"quote_keys": false,
"space_colon": true,
"ascii_only": false,
"unescape_regexps": false,
"inline_script": false,
"beautify": false,
"bracketize": false,
"semicolons": true,
"comments": false,
"preserve_line": false,
"screw_ie8": false
}
},
"cssnext": {
"customProperties": true,
"applyRule": true,
"calc": false,
"nesting": true,
"customMedia": true,
"mediaQueriesRange": true,
"customSelectors": true,
"attributeCaseInsensitive": true,
"colorRebeccapurple": true,
"colorHwb": true,
"colorGray": true,
"colorHexAlpha": true,
"colorFunction": true,
"fontVariant": true,
"filter": true,
"initial": true,
"rem": true,
"pseudoElements": true,
"pseudoClassMatches": true,
"pseudoClassNot": true,
"pseudoClassAnyLink": true,
"colorRgba": true,
"overflowWrap": true
},
"file-type-typescript": "{\"compilers\":[\"typescript\",\"uglify-js\"]}",
"babel": {
"useBabelRc": true,
"presets": {
"babel-preset-es2015": true
},
"plugins": {
"babel-plugin-syntax-jsx": true,
"babel-plugin-transform-react-jsx": true,
"babel-plugin-transform-async-to-generator": true,
"babel-plugin-transform-class-properties": true,
"babel-plugin-transform-object-rest-spread": true
}
},
"file-type-png": "{\"compilers\":[\"png\"]}",
"file-type-jpg": "{\"compilers\":[\"jpg\"]}"
}

View file

@ -6,7 +6,7 @@
} }
body { body {
font-family: 'Raleway', sans-serif; font-family: 'Raleway', sans-serif;
font-weight:100; font-weight:300;
color: #fff; color: #fff;
background: #222 url(../images/cover-1.png) center no-repeat fixed; background: #222 url(../images/cover-1.png) center no-repeat fixed;
background-size: cover background-size: cover
@ -23,6 +23,9 @@ body {
} }
} }
#online {
font-weight: 200;
}
#rules-title { #rules-title {
border-radius: 0px; border-radius: 0px;
} }
@ -36,7 +39,8 @@ body {
} }
.brand-logo { .brand-logo {
margin-top: 5px; margin-top: 5px;
margin-bottom: 5px margin-bottom: 5px;
font-weight: 100;
} }
.button-collapse { .button-collapse {
margin-top: 5px; margin-top: 5px;
@ -69,14 +73,15 @@ body {
display: inline-block display: inline-block
} }
#rules-title { #rules-title {
font-size: 2.2em; font-size: 1.9em;
background: rgba(230, 230, 230, .1); background: rgba(180, 180, 180, .1);
cursor: pointer; cursor: pointer;
@include userselect(none); @include userselect(none);
@include transition(all .2s ease); @include transition(all .2s ease);
} }
#rules-title:hover { #rules-title:hover {
background: rgba(210, 210, 210, .2) background: rgba(150, 150, 150, .2);
transform: scale(1.03,1.03);
} }
.admins>ul>a, .admins>ul>a,
i.rules-icon { i.rules-icon {
@ -94,16 +99,18 @@ i.rules-icon {
.cover-2 h2, .cover-2 h2,
.cover-2 p { .cover-2 p {
width: 75%; width: 75%;
margin: 0 auto font-weight: 300;
margin: 0 auto;
} }
.cover-2 p { .cover-2 p {
font-size: 1.2em; font-size: 1.2em;
height: auto height: auto
} }
.section-title { .section-title {
font-size: 4em; font-size: 2.5em;
color: rgba(255, 255, 255, .9); color: rgba(255, 255, 255, 1);
z-index: 100 z-index: 100;
font-weight:100;
} }
.cover-3 { .cover-3 {
background: url(../images/cover-3.png) no-repeat fixed; background: url(../images/cover-3.png) no-repeat fixed;
@ -113,24 +120,27 @@ i.rules-icon {
margin: 5px; margin: 5px;
background: rgba(0, 0, 0, .3); background: rgba(0, 0, 0, .3);
@include transition(all .2s ease); @include transition(all .2s ease);
border-radius: 150px; border-radius:5px;
z-index: 200; z-index: 200;
font-size: 0.9em;
} }
.admins>ul>a:hover { .admins>ul>a:hover {
background: rgba(100, 100, 100, .3); background: rgba(70, 70, 70, .15);
transform: translateY(-4px); transform: translateY(-3px);
} }
.admins ul { .admins ul {
z-index: 101 z-index: 101
} }
.admins a li { .admins a li {
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
font-size: 1.2em; font-size: 1.1em;
z-index: 102 z-index: 102;
font-weight:300;
} }
.rank { .rank {
font-size: 2em; font-size: 1.6em;
z-index: 103 z-index: 103;
font-weight: 200;
} }
.rest>li>a, .rest>li>a,
.useful a { .useful a {
@ -144,17 +154,20 @@ i.rules-icon {
border-bottom: 1px solid rgba(255, 255, 255, .2) border-bottom: 1px solid rgba(255, 255, 255, .2)
} }
.rest>li>a { .rest>li>a {
font-size: 1.5em; font-size: 1.35em;
font-weight: 300;
color: rgba(255, 255, 255, .6); color: rgba(255, 255, 255, .6);
border-radius: 50px; border-radius: 10px;
@include transition(all .2s ease); @include transition(all .2s ease);
display: inline-block;
} }
.rest>li>a:hover { .rest>li>a:hover {
background: rgba(255, 255, 255, .2); background: rgba(100, 100, 100, .2);
color: #fff color: #fff
} }
.rest>li { .rest>li {
margin-top: 50px; margin-top: 50px;
display: inline-block;
@include transition(all .2s ease); @include transition(all .2s ease);
} }
.rest>li:hover { .rest>li:hover {
@ -162,21 +175,24 @@ i.rules-icon {
} }
.useful a { .useful a {
display: inline-block; display: inline-block;
font-size: 1.2em; font-size: 1.05em;
color: rgba(255, 255, 255, .6); color: rgba(255, 255, 255, .6);
border: 2px solid rgba(255, 255, 255, .6); border: 2px solid rgba(200, 200, 200, .3);
margin-right: 10px; margin-right: 10px;
border-radius: 50px; border-radius: 50px;
width: 200px; width: 200px;
@include transition(all .2s ease); @include transition(all .2s ease);
margin-bottom: 10px margin-bottom: 10px
} }
.useful h3 {
font-weight: 100;
}
.useful>a>li>i { .useful>a>li>i {
font-size: 2em; font-size: 2em;
margin-bottom: 10px margin-bottom: 10px
} }
.useful a:hover { .useful a:hover {
background: rgba(255, 255, 255, .2); background: rgba(100, 100, 100, .1);
color: #fff; color: #fff;
transform: translateY(-5px) transform: translateY(-5px)
} }
@ -195,25 +211,30 @@ i.rules-icon {
font-weight: 700 font-weight: 700
} }
.nav-wrapper { .nav-wrapper {
background: rgba(0, 0, 0, .3) margin: -8px;
background: rgba(20, 20, 20, .5);
li>a {
font-weight: 200;
font-size: .9em;
}
} }
.cover-2 a { .cover-2 a {
font-size: 1.3em; font-size: 1.17em;
color: rgba(255, 255, 255, .3) color: rgba(255, 255, 255, .3);
} }
.head-icon { .head-icon {
width: 20px; width: 20px;
height: 20px; height: 20px;
float: left; float: left;
margin-right: 5px; margin-right: 5px;
border-radius: 50% border-radius:2px;
} }
small { small {
font-size:0.9em; font-size:0.9em;
} }
.modal { .modal {
background: rgba(0, 0, 0, .5); background: rgba(10, 10, 10, .8);
color: #ccc color: #ccc
} }
.modal a { .modal a {
@ -224,27 +245,59 @@ small {
} }
.modal li { .modal li {
display: inline-block; display: inline-block;
/* word-wrap: break-word;*/
padding:10px; padding:10px;
margin:4px; margin:4px;
background: rgba(150, 150, 150, .3); background: rgba(100, 100, 100, .2);
@include transition(all .2s ease); @include transition(all .2s ease);
border-radius: 150px; border-radius: 5px;
font-size: 0.8em;
} }
.modal li:hover { .modal li:hover {
background: rgba(200, 200, 200, .3); background: rgba(150, 150, 150, .3);
} }
.modal h4 { .modal h4 {
margin-bottom: 38px margin-bottom: 38px;
font-size: 1.2em;
font-weight: 400;
} }
.modal-msg {
background: rgba(#222, .3);
display: inline-block;
margin:100px auto;
padding: 20px 40px;
h5 {
font-weight: 100;
font-size: 0.85em;
border-bottom: 3px solid rgba(#ccc, 0.3);
padding-bottom: 20px;
}
span {
font-size: 0.9em;
font-weight: 200;
}
}
.modal>.modal-footer { .modal>.modal-footer {
background: rgba(50, 50, 50, .6) background: rgba(50, 50, 50, .3);
.modal-close {
font-size: .9em;
text-transform: none;
}
} }
.waves-effect.waves-brown .waves-ripple { .waves-effect.waves-brown .waves-ripple {
background-color: rgba(230, 230, 230, .3) background-color: rgba(230, 230, 230, .3)
} }
.typed-cursor { display: none; } .typed-cursor { display: none; }
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.cover-2 h2, .cover-2 h2,
.cover-2 p { .cover-2 p {

80
scss/staff.scss Normal file
View file

@ -0,0 +1,80 @@
@import 'mixins';
#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(#000, .2)
}
.admins {
width: 85%;
margin: 0 auto;
background: rgba(100, 100, 100, .1);
padding: 15px;
border-radius: 10px;
li {
display: inline-block;
padding: 10px;
background: rgba(100, 100, 100, .2);
margin: 5px;
border-radius: 5px;
@include transition(all .13s ease-in-out);
&:hover {
background: rgba(200, 200, 200, .2);
}
}
}
h2 {
font-size: 1.5em
}
#note {
h5 {
margin-bottom: -15px
}
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
}
}