Merge branch 'f0ckdev' into 'master'

Neues Layout

See merge request !71
This commit is contained in:
noxy 2017-02-01 12:10:47 +00:00
commit 058325f8eb
7 changed files with 242 additions and 79 deletions

View File

@ -1,45 +1,72 @@
@font-face { @font-face {
font-family: "Cyberfall"; font-family: "Cyberfall";
src: url(https://dr0p.it/Clgl.otf) format("opentype"); src: url(https://dr0p.it/Clgl.otf) format("opentype");
} }
body { body {
margin: 1em auto 3em auto; margin: 1em auto 3em auto;
background-color: #0B111D; background-color: #0B111D;
color: #fff; color: #fff;
font-family: "Cyberfall"; font-family: "Cyberfall";
font-size: 12px; font-size: 12px;
} }
a { a {
color: #00ffed; color: #00ffed;
} }
a:hover { a:hover {
color: #00b4ef; color: #00b4ef;
} }
.panel { .return {
margin-bottom: 0; text-align: center;
background-color: rgb(18, 19, 35); border: 2px solid #154d71;
border: 5px solid #154D71; width: 888px;
border-radius: 0px; margin: 0 auto;
padding-left: 10px; background: #121323;
padding-right: 10px; }
width: 25%;
float: left; .controls {
position: relative; text-align: center;
min-height: 1px; color: #00ffed;
} width: 888px;
margin: 0 auto;
input, select, textarea { background: #121323;
border: 1px double #00edff; padding-top: 0;
background: #282A2E; margin-top: 5px;
color: #f1e3ce; border: 2px solid #154d71;
font-family: 'Hack', monospace, sans-serif; }
font-size: 80%;
} .medium, .thumbnail {
display: flex;
.thumb { justify-content: center;
border: 2px solid #207ea4; margin-top: 5px;
} background: #121323;
border: 2px solid #154d71;
padding: 5px;
}
.panel {
margin-bottom: 0;
background-color: rgb(18, 19, 35);
border: 2px solid #154D71;
border-radius: 0px;
padding-left: 10px;
padding-right: 10px;
width: 25%;
position: relative;
min-height: 1px;
}
input, select, textarea {
border: 1px double #00edff;
background: #282A2E;
color: #f1e3ce;
font-family: 'Hack', monospace, sans-serif;
font-size: 80%;
}
.thumb {
border: 2px solid #207ea4;
}

View File

@ -34,8 +34,33 @@ a:hover {
text-decoration: none; text-decoration: none;
animation: glitch2 2s steps(100) infinite; animation: glitch2 2s steps(100) infinite;
color: white; color: white;
border: 1px solid #9a0039;
background-color: #061412;
} }
.controls {
text-align: center;
color: #01f4b5;
font-weight: bold;
width: 888px;
margin: 0 auto;
background: #061412;
padding-top: 0;
margin-top: 5px;
border: 1px solid #9a0039;
}
.medium, .thumbnail {
display: flex;
justify-content: center;
margin-top: 5px;
background: #061412;
border: 2px solid #9a0039;
padding: 5px;
}
.thumb { .thumb {
border: 2px solid rgb(4, 232, 189); border: 2px solid rgb(4, 232, 189);
} }
@ -76,8 +101,18 @@ a#holland:hover {
/* PANEL */ /* PANEL */
.panel { .panel {
background-color: rgba(4, 27, 23, 0.61); background-color: rgba(4, 27, 23, 0.61);
border: 5px solid #9a0039; border: 2px solid #9a0039;
}
.navbar {
text-align: center;
margin-top: 7px;
width: 888px;
margin: 0 auto;
border: 2px solid #9a0039;
background: #061412;
padding-bottom: 3px;
} }
@keyframes noise-anim { @keyframes noise-anim {

View File

@ -20,7 +20,7 @@
&nbsp;| <a id="prev" href="/{{ prev }}">->></a> &nbsp;| <a id="prev" href="/{{ prev }}">->></a>
{% endif %} {% endif %}
</div> </div>
<div class="wrapper">
<div class="medium"> <div class="medium">
{% if item == "video" %} {% if item == "video" %}
<video id="player" src="{{ dest }}" style="max-width: 1280px; height: 50%;" preload="auto" autoplay controls loop></video> <video id="player" src="{{ dest }}" style="max-width: 1280px; height: 50%;" preload="auto" autoplay controls loop></video>
@ -38,6 +38,8 @@
{% else %} {% else %}
<h1>404 - Not f0cked</h1> <h1>404 - Not f0cked</h1>
{% endif %} {% endif %}
</div>
</div>
<div class="panel info"> <div class="panel info">
<span class="id">ID: {{ id }} | by: {{ username }}<span></span><br /> <span class="id">ID: {{ id }} | by: {{ username }}<span></span><br />
@ -50,7 +52,7 @@
<span class="timestamp">timestamp: {{ timestamp }}</span><br> <span class="timestamp">timestamp: {{ timestamp }}</span><br>
<span id="themes">theme: </span> <span id="themes">theme: </span>
</div> </div>
</div>
<script src="./s/shit.js"></script> <script src="./s/shit.js"></script>
<script src="./s/theme.js"></script> <script src="./s/theme.js"></script>
</body> </body>

View File

@ -19,6 +19,12 @@ a:hover {
border: 2px solid #3333cc; border: 2px solid #3333cc;
} }
.wrapper {
margin: 0 auto;
width: 888px;
}
.navbar { .navbar {
text-align: center; text-align: center;
margin-top: 7px; margin-top: 7px;
@ -37,7 +43,7 @@ input, select, textarea {
.panel { .panel {
margin-bottom: 0; margin-bottom: 0;
background-color: #aaaacc; background-color: #aaaacc;
border: 5px solid #313370; border: 2px solid #313370;
border-radius: 0px; border-radius: 0px;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
@ -64,23 +70,38 @@ code {
.return { .return {
text-align: center; text-align: center;
border: 1px solid black; border: 2px solid #313370;
width: 300px; width: 888px;
margin: 0 auto; margin: 0 auto;
background: #aaaacc; background: #aaaacc;
margin-bottom: 5px;
} }
.controls { .controls {
text-align: center; text-align: center;
color: #3333cc; color: #3333cc;
font-weight: bold; font-weight: bold;
width: 300px; width: 888px;
margin: 0 auto; margin: 0 auto;
border-left: 1px solid black;
background: #aaaacc; background: #aaaacc;
border-right: 1px solid black;
border-bottom: 1px solid black;
padding-top: 0; padding-top: 0;
border: 2px solid #313370;
}
.medium, .thumbnail {
display: flex;
justify-content: center;
margin-top: 5px;
background: #aaaacc;
border: 2px solid #313370;
}
.panel.info {
margin: 0 auto;
margin-top: 5px;
float: none;
width: 888px;
margin-bottom: 5px;
} }
.navbar { .navbar {

View File

@ -29,6 +29,28 @@ input, select, textarea {
.return { .return {
text-align: center; text-align: center;
font-size: 25px; font-size: 25px;
border: 2px solid #ff008d;
}
.controls {
text-align: center;
color: #ff008d;
font-weight: bold;
width: 888px;
margin: 0 auto;
background: #484747;
padding-top: 0;
margin-top: 5px;
border: 2px solid #ff008d;
}
.medium, .thumbnail {
display: flex;
justify-content: center;
margin-top: 5px;
background: #484747;
border: 2px solid #ff008d;
padding: 5px;
} }
span.id { span.id {
@ -45,8 +67,8 @@ code {
.panel { .panel {
margin-bottom: 0; margin-bottom: 0;
background-color: rgba(34, 34, 34, 0.61); background-color: rgb(72, 71, 71);
border: 5px solid #ff008d; border: 2px solid #ff008d;
border-radius: 0px; border-radius: 0px;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;

View File

@ -66,10 +66,14 @@ a:hover {
} }
.medium, .thumbnail { .medium, .thumbnail {
display: flex; display: flex;
justify-content: center; justify-content: center;
margin-top: 10px; margin-top: 5px;
background: #484747;
border: 2px solid #99ff00;
padding: 5px;
} }
.info { .info {
padding-top: 5px; padding-top: 5px;
} }
@ -77,17 +81,33 @@ a:hover {
text-align: center; text-align: center;
padding-bottom: 10px; padding-bottom: 10px;
} }
.controls { .controls {
text-align: center; text-align: center;
padding-top: 10px; color: #99ff00;
font-weight: bold;
width: 888px;
margin: 0 auto;
background: #484747;
padding-top: 0;
margin-top: 5px;
border: 1px solid #99ff00;
} }
.navbar { .navbar {
text-align: center; text-align: center;
margin-top: 7px; margin-top: 7px;
} }
.return { .return {
text-align: center; text-align: center;
border: 1px solid #99ff00;
width: 888px;
margin: 0 auto;
background: #484747;
font-weight: bold;
} }
.irc { .irc {
margin: 20px; margin: 20px;
} }
@ -96,19 +116,35 @@ code {
} }
.panel { .panel {
margin-bottom: 0; margin-bottom: 0;
background-color: rgba(34, 34, 34, 0.61); background-color: #484747;
border: 5px solid #383838; border: 2px solid #99ff00;
border-radius: 0px; border-radius: 0px;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
width: 25%; width: 25%;
float: left; float: left;
position: relative; position: relative;
min-height: 1px; min-height: 1px;
color: #ffffff;
padding-bottom: 5px;
} }
.panel.info {
margin: 0 auto;
margin-top: 5px;
float: none;
width: 888px;
margin-bottom: 5px;
}
img { img {
vertical-align: middle; vertical-align: middle;
max-height: 770px; max-height: 770px;
} }
.wrapper {
margin: 0 auto;
width: 888px;
}

View File

@ -35,6 +35,29 @@ input, select, textarea {
font-size: 50px; font-size: 50px;
color: #00DF00; color: #00DF00;
text-shadow: 0 0 20px #00DF00; text-shadow: 0 0 20px #00DF00;
background: #0b0b0b;
border: 2px solid #0a842a;
}
.controls {
text-align: center;
color: #00d500;
font-weight: bold;
width: 888px;
margin: 0 auto;
background: #0b0b0b;
padding-top: 0;
margin-top: 5px;
border: 2px solid #0a842a;
}
.medium, .thumbnail {
display: flex;
justify-content: center;
margin-top: 5px;
background: #0b0b0b;
border: 2px solid #0a842a;
padding: 5px;
} }
a#next { a#next {
@ -55,7 +78,7 @@ a#prev {
.panel { .panel {
margin-bottom: 0; margin-bottom: 0;
background-color: rgba(16, 16, 16, 0.61); background-color: rgba(16, 16, 16, 0.61);
border: 5px solid #0b842b; border: 2px solid #0b842b;
border-radius: 0px; border-radius: 0px;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
@ -63,9 +86,6 @@ a#prev {
float: left; float: left;
position: relative; position: relative;
min-height: 1px; min-height: 1px;
-webkit-box-shadow: 10px 10px 0px 0px rgba(0,255,30,1);
-moz-box-shadow: 10px 10px 0px 0px rgba(0,255,30,1);
box-shadow: 10px 10px 0px 0px rgba(0,255,30,1);
} }
.thumb:hover { .thumb:hover {