cosmetic stuff

This commit is contained in:
Matteias Collet 2017-10-30 03:33:00 +01:00
parent 3f96ab0de9
commit 9e94fb0ead
2 changed files with 37 additions and 25 deletions

View file

@ -11,7 +11,7 @@
<body onload="updateChangelog()"> <body onload="updateChangelog()">
<div style="width: 100%; overflow: hidden;"> <div style="width: 100%; overflow: hidden;">
<div style="width: 510px; float: left;"> <div style="width: 400px; float: left;">
<select id="gameID" class="selectionHeader" onchange="updateCodelist()" autocomplete="off"> <select id="gameID" class="selectionHeader" onchange="updateCodelist()" autocomplete="off">
<option selected disabled hidden>Choose Version</option> <option selected disabled hidden>Choose Version</option>
<option value="GMSE01">GMSE01 (NTSC-U)</option> <option value="GMSE01">GMSE01 (NTSC-U)</option>
@ -22,7 +22,7 @@
</ul> </ul>
<button id="downloadButton" onclick="generateGCT()" style="visibility:hidden;">Download</button> <button id="downloadButton" onclick="generateGCT()" style="visibility:hidden;">Download</button>
</div> </div>
<div style="margin-left: 530px;"> <div style="margin-left: 420px;">
<div id="descriptionBox" class="framed"> <div id="descriptionBox" class="framed">
<p><h2>Mario Sunshine Cheatfile Generator</h2></p> <p><h2>Mario Sunshine Cheatfile Generator</h2></p>
<p><i>Authors: <a href="https://twitter.com/psychonauter">Psy</a> & <a href="https://twitter.com/srlmilk">Milk</a><br />Last Updated: Oct 30, 2017</i></p> <p><i>Authors: <a href="https://twitter.com/psychonauter">Psy</a> & <a href="https://twitter.com/srlmilk">Milk</a><br />Last Updated: Oct 30, 2017</i></p>

View file

@ -1,6 +1,6 @@
body { body {
margin: 50px 50px 0 50px; margin: 50px 50px 0 50px;
width: 1200px; width: 980px;
} }
html { html {
background-color: #262626; background-color: #262626;
@ -8,11 +8,11 @@ html {
font-family: Calibri; font-family: Calibri;
} }
#gameID { #gameID {
margin: 10px 0 10px 0; margin: 10px 0 5px 0;
} }
body button { body button {
width: 500px; width: 390px;
padding: 12px 8px 12px 0px; padding: 10px 10px 10px 10px;
float: left; float: left;
display: block; display: block;
margin: auto; margin: auto;
@ -22,7 +22,7 @@ body button {
border-style: none; border-style: none;
border-radius: 4px; border-radius: 4px;
cursor: pointer; cursor: pointer;
margin-top: 10px; margin-top: 5px;
outline: none; outline: none;
-webkit-transition: all 0s ease-out 0s; -webkit-transition: all 0s ease-out 0s;
-moz-transition: all 0s ease-out 0s; -moz-transition: all 0s ease-out 0s;
@ -36,13 +36,16 @@ img {
ul { ul {
margin: 0; margin: 0;
padding: 0; padding: 0;
width: 500px; width: 390px;
list-style-type: none; list-style-type: none;
} }
ul li { ul li {
cursor: pointer; cursor: pointer;
position: relative; position: relative;
padding: 12px 8px 12px 40px; padding: 8px 8px 8px 40px;
border-radius: 4px;
border-style: solid;
border-width: 1px;
background: #ffefef; background: #ffefef;
color: #262626; color: #262626;
font-size: 18px; font-size: 18px;
@ -64,24 +67,32 @@ ul li::before {
border-color: #a6a6a6; border-color: #a6a6a6;
border-style: solid; border-style: solid;
border-width: 1.5px 1.5px 1.5px 1.5px; border-width: 1.5px 1.5px 1.5px 1.5px;
border-radius: 4px; border-radius: 50%;
top: 14.5px; top: 11px;
left: 12px; left: 12px;
height: 15px; height: 14px;
width: 15px; width: 14px;
} }
ul li:nth-child(odd) { ul li:nth-child(odd) {
background: #fdfdfd; background: #fdfdfd;
} }
ul li:hover { ul li:hover {
/*background: #ddd;*/ background: #d84035;
color: #ffffff;
background: #565656; border-color: #000000;
}
ul li:hover::before {
border-color: #fff;
background-color: pink;
}
ul li.checked:hover {
background: #d84035;
color: #ffffff; color: #ffffff;
} }
ul li.checked { ul li.checked {
background: #565656; background: #434343;
color: #fff; color: #fff;
border-color: #262626;
} }
ul li.checked::before { ul li.checked::before {
content: ''; content: '';
@ -89,18 +100,18 @@ ul li.checked::before {
border-color: #fff; border-color: #fff;
border-style: solid; border-style: solid;
border-width: 1.5px 1.5px 1.5px 1.5px; border-width: 1.5px 1.5px 1.5px 1.5px;
border-radius: 4px; border-radius: 50%;
top: 14.5px; top: 11px;
left: 12px; left: 12px;
height: 15px; height: 14px;
width: 15px; width: 14px;
background-color: #ffffff; background-color: #d85e55;
} }
.selectionHeader { .selectionHeader {
background-color: #f44336; background-color: #f44336;
padding: 12px 8px 12px 10px; padding: 10px 10px 10px 10px;
color: white; color: white;
width: 500px; width: 390px;
font-size: 16px; font-size: 16px;
border-style: none; border-style: none;
border-radius: 4px; border-radius: 4px;
@ -111,7 +122,8 @@ ul li.checked::before {
outline: none; outline: none;
} }
.framed { .framed {
margin: 10px 0px 10px 0; position: fixed;
margin: 11px 0px 10px 0;
padding: 0px 12px 12px 12px; padding: 0px 12px 12px 12px;
background-color: #111; background-color: #111;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;