I am super proud of what I've done

This commit is contained in:
alisolarflare 2017-06-19 03:04:02 -04:00
parent 86af3e529e
commit 6fa511f19c
3 changed files with 101 additions and 93 deletions

View file

@ -6,7 +6,6 @@
<script src="./resources/frameworks/jquery-3.2.1.min.js" type="text/javascript"></script> <script src="./resources/frameworks/jquery-3.2.1.min.js" type="text/javascript"></script>
<link href='https://fonts.googleapis.com/css?family=Balthazar' rel='stylesheet'> <link href='https://fonts.googleapis.com/css?family=Balthazar' rel='stylesheet'>
<link rel="stylesheet" href="resources/questions/style.css"> <link rel="stylesheet" href="resources/questions/style.css">
<link rel="stylesheet" href="resources/global/style.css">
<script type="text/javascript" src="resources/questions/scenarios.js"></script> <script type="text/javascript" src="resources/questions/scenarios.js"></script>
</head> </head>
<body> <body>
@ -19,22 +18,12 @@
<a href="./spawn.html">Spawn</a> <a href="./spawn.html">Spawn</a>
</nav> </nav>
<h1>Our Little Interview</h1> <h1 id="who" class="tab">Who</h1>
<h1 class="welcome">Welcome to Chromagaming!</h1>
<nav> <div class="introduction">
<ul>
<li><a href="#who">The Who Questions</a></li>
<li><a href="#what">The What Questions</a></li>
<li><a href="#why">The Why Questions</a></li>
<li><a href="#how">The How Questions</a></li>
</ul>
</nav>
<h2 id="who">Who</h2>
<h3 class="welcome">Welcome to Chromagaming!</h3>
<p>It seems like you're interested in becoming an official member.</p> <p>It seems like you're interested in becoming an official member.</p>
<p>Before we accept you into our community, we'd like to get to know you first.</p> <p>Before we accept you into our community, we'd like to get to know you first.</p>
</div>
<ul> <ul>
<li>Name<br /> <li>Name<br />
<input type="text" name="" value=""></li> <input type="text" name="" value=""></li>
@ -68,8 +57,9 @@
<input type="submit"> <input type="submit">
</ul> </ul>
<h2 id="what">What</h2> <h1 id="what" class="tab">What</h1>
<h3>Every server has its rules</h3> <h1>Every server has its rules</h1>
<div class="introduction">
<p> <p>
Although our rules are a bit more Although our rules are a bit more
straight forward than usual. This section tests your knowledge straight forward than usual. This section tests your knowledge
@ -82,9 +72,11 @@
if applicants are paying attention.</em></li> if applicants are paying attention.</em></li>
<li><em>Consider this a basic filter.</em></li> <li><em>Consider this a basic filter.</em></li>
</ul> </ul>
</div>
<h2 id="why">Why</h2> <h1 id="why" class="tab">Why</h1>
<h3>Our server runs on a case by case basis</h3> <h1>Our server runs on a case by case basis</h1>
<div class="introduction">
<p> <p>
Therefore instead of testing you on the rules of the land, it'd be Therefore instead of testing you on the rules of the land, it'd be
more appropriate to test you on your ability to react. more appropriate to test you on your ability to react.
@ -102,9 +94,10 @@
What matters in this case is <em>why</em> you What matters in this case is <em>why</em> you
choose the awnser. choose the awnser.
</p> </p>
<h3>Scenarios</h3> </div>
<ul id="scenarios"> <h2>Scenarios</h2>
</ul> <div id="scenarios">
</div>
<p>More scenarios to come...</p> <p>More scenarios to come...</p>
<p> <p>
<em> <em>
@ -117,16 +110,20 @@
developer or post to #feedback on Discord. developer or post to #feedback on Discord.
</em> </em>
</p> </p>
<h2 id="how">How</h2> <h1 id="how" class="tab">How</h1>
<h1>Congratulations!</h1>
<div class="introduction">
<p> <p>
Congratulations! By filling out this form, you have been given By filling out this form, you have been given
a few basic permissions. Feel free to roam around spawn, view a few basic permissions. Feel free to roam around spawn, view
our dynamic map, join our discord channel, and discover our our dynamic map, join our discord channel, and discover our
custom coded Civilization View. custom coded Civilization View.
<br /> </p>
<p>
We'll let you know when the moderators have finished reviewing We'll let you know when the moderators have finished reviewing
your application. Till then, have fun! your application. Till then, have fun!
</p> </p>
</div>
<p id="application-status">Your application is awaiting approval</p> <p id="application-status">Your application is awaiting approval</p>
<div class="footer-image-links"> <div class="footer-image-links">
<img src="./resources/questions/images/64pxWhiteBox.png" alt="placeholder"> <img src="./resources/questions/images/64pxWhiteBox.png" alt="placeholder">

View file

@ -3,7 +3,7 @@ window.onload = function(){
makeScenario = function(scenario){ makeScenario = function(scenario){
//Create output Element //Create output Element
let $trueOutputElement = $("<li></li>") let $trueOutputElement = $("<li></li")
$trueOutputElement.attr("id", `scenarios-${scenario.name}`); $trueOutputElement.attr("id", `scenarios-${scenario.name}`);
let $outputElement = $("<div class=\"accordion-panel\"></div>"); let $outputElement = $("<div class=\"accordion-panel\"></div>");
@ -20,7 +20,7 @@ window.onload = function(){
//Mature Content rating //Mature Content rating
if(scenario.adult == true){ if(scenario.adult == true){
$adultText = $("<p>)</p>") $adultText = $("<p></p>")
.addClass("adult") .addClass("adult")
.append(`(question for those over the age of 18... or those mature enough)`) .append(`(question for those over the age of 18... or those mature enough)`)
@ -48,7 +48,11 @@ window.onload = function(){
} }
//Other Question //Other Question
if (scenario.other){ if (scenario.other){
$otherElement = $("<li>Other... <input type=text></li>"); $inputTag = $("<input>")
.attr("type", "radio")
.attr("name", `radio-${scenario.name}`);
$otherElement = $("<li>Other... <input type=text></li>")
.prepend($inputTag);
$optionElement.append($otherElement); $optionElement.append($otherElement);
} }

View file

@ -4,17 +4,22 @@ html{
background-color: lightgray; background-color: lightgray;
} }
h2 { h1{
font-family: "Lucida Sans Unicode";
font-weight: lighter;
display: none;
}
h3{
font-family: Balthazar; font-family: Balthazar;
font-weight: bolder; font-weight: bolder;
font-style: italic; font-style: italic;
font-size: 30px; font-size: 30px;
} }
h1.tab{
display: none;
}
h2 {
font-family: Balthazar;
font-weight: bolder;
font-style: italic;
font-size: 25px;
}
p { p {
font-family: Georgia; font-family: Georgia;
font-size: 17px; font-size: 17px;
@ -31,14 +36,16 @@ li, li p{
} }
.footer-image-links{ .footer-image-links{
display: block; text-align: center;
margin: 10px auto;
width: 400px;
} }
.footer-image-links img{ .footer-image-links img{
display: inline-block;
width: 64px;
padding: 5px; padding: 5px;
} }
.introduction{
border-bottom: groove;
}
#scenarios li p.adult{ #scenarios li p.adult{
font-family: monospace; font-family: monospace;
color: rgb(240, 0, 100); color: rgb(240, 0, 100);