1
Fork 0
mirror of https://github.com/RYGhub/royalnet.git synced 2024-11-23 19:44:20 +00:00

Use title bar

This commit is contained in:
Steffo 2019-06-06 21:26:42 +02:00
parent b17aef24e6
commit 8c04edabaf
7 changed files with 1095 additions and 8 deletions

View file

@ -8,7 +8,7 @@
<div class="doublebox">
<div class="top">
<span class="left">
Wiki index
Wiki Index
</span>
</div>
<div class="bot">

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

View file

@ -0,0 +1,219 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="1000"
height="1000"
viewBox="0 0 264.58332 264.58333"
version="1.1"
id="svg8"
inkscape:version="0.92.3 (2405546, 2018-03-11)"
sodipodi:docname="LogoRoyalGames.svg"
inkscape:export-filename="C:\Users\stepi\Pictures\LogoRoyalGames.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96">
<title
id="title5190">Royal Games</title>
<defs
id="defs2">
<linearGradient
id="linearGradient5149">
<stop
style="stop-color:#000000;stop-opacity:1;"
offset="0"
id="stop5147" />
</linearGradient>
<linearGradient
id="linearGradient5042">
<stop
style="stop-color:#000000;stop-opacity:1;"
offset="0"
id="stop5040" />
</linearGradient>
<linearGradient
id="linearGradient4971">
<stop
style="stop-color:#000000;stop-opacity:1;"
offset="0"
id="stop4969" />
</linearGradient>
<linearGradient
id="Principale"
osb:paint="solid">
<stop
style="stop-color:#a1ccff;stop-opacity:1;"
offset="0"
id="stop4895" />
</linearGradient>
<linearGradient
id="Sfondo"
osb:paint="solid">
<stop
style="stop-color:#0d193b;stop-opacity:1;"
offset="0"
id="stop817" />
</linearGradient>
<linearGradient
inkscape:collect="always"
xlink:href="#Sfondo"
id="linearGradient821"
x1="34.745037"
y1="124.61114"
x2="175.3288"
y2="124.61114"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1.8820335,0,0,2.1427478,-65.391324,-102.30192)" />
<linearGradient
inkscape:collect="always"
xlink:href="#Principale"
id="linearGradient5332"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(4.9722906,-1.7276436,1.7276436,4.9722906,-481.91887,-479.70806)"
x1="55.743366"
y1="152.60051"
x2="62.71452"
y2="152.60051" />
<linearGradient
inkscape:collect="always"
xlink:href="#Principale"
id="linearGradient5334"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(4.8721103,-1.6928355,1.6928355,4.8721103,-559.10679,-570.69534)"
x1="65.251831"
y1="186.99634"
x2="72.946449"
y2="186.99634" />
<linearGradient
inkscape:collect="always"
xlink:href="#Sfondo"
id="linearGradient5336"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(5.0448436,-1.7528523,1.7528523,5.0448436,-614.18765,-850.35741)"
x1="63.593018"
y1="224.03799"
x2="71.024086"
y2="224.03799" />
<clipPath
clipPathUnits="userSpaceOnUse"
id="clipPath5457">
<use
x="0"
y="0"
xlink:href="#g5453"
id="use5459"
width="100%"
height="100%" />
</clipPath>
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="0.49497475"
inkscape:cx="287.44765"
inkscape:cy="453.73086"
inkscape:document-units="px"
inkscape:current-layer="main-layer"
showgrid="false"
units="px"
inkscape:pagecheckerboard="true"
inkscape:measure-start="384.018,406.607"
inkscape:measure-end="388.429,418.649"
showguides="true"
inkscape:object-paths="true"
inkscape:snap-intersection-paths="true"
inkscape:snap-smooth-nodes="true"
inkscape:snap-midpoints="false"
inkscape:snap-bbox="false"
inkscape:bbox-paths="true"
inkscape:bbox-nodes="true"
inkscape:snap-bbox-edge-midpoints="true"
inkscape:snap-bbox-midpoints="true"
inkscape:snap-nodes="true"
inkscape:snap-grids="false"
inkscape:snap-others="false"
inkscape:guide-bbox="true"
inkscape:window-width="1920"
inkscape:window-height="1017"
inkscape:window-x="1272"
inkscape:window-y="-8"
inkscape:window-maximized="1"
inkscape:snap-page="false"
fit-margin-top="0"
fit-margin-left="0"
fit-margin-right="0"
fit-margin-bottom="0">
<inkscape:grid
type="xygrid"
id="grid1186"
originx="0"
originy="1.5e-005" />
</sodipodi:namedview>
<metadata
id="metadata5">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title>Royal Games</dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Main Layer"
inkscape:groupmode="layer"
id="main-layer"
transform="translate(0,-32.416689)"
style="display:inline">
<rect
style="fill:url(#linearGradient821);fill-opacity:1;stroke-width:0.53132677"
id="background"
width="264.58334"
height="264.58334"
x="0"
y="32.416656" />
<g
id="logo"
transform="matrix(0.88827897,0,0,0.88827923,7.5532469,20.037367)">
<path
inkscape:connector-curvature="0"
id="star"
d="m 55.674623,47.499965 23.70863,68.248035 5.283398,-7.9251 5.291666,7.9375 5.291667,-7.9375 v 27.78125 c 0,0 -3.96081,0.36871 -8.719881,0.71727 l 36.012267,103.66498 105.39511,38.24676 -69.9983,-88.16309 66.02232,-87.15178 -103.69547,36.69078 z"
style="display:inline;opacity:0.98999999;fill:#a1ccff;fill-opacity:1;stroke-width:0.33488649" />
<path
inkscape:connector-curvature="0"
id="crown"
d="m 86.530103,136.32142 -7.14685,-20.57342 -0.0083,0.0124 -5.291667,-7.93751 -5.291666,7.93751 -5.291622,-7.9375 -5.291667,7.93751 -5.291666,-7.93751 v 27.78126 c 0,0 14.097344,1.32291 21.166666,1.32291 3.331782,0 8.204375,-0.29493 12.446786,-0.60565 z"
style="display:inline;opacity:1;fill:#a1ccff;fill-opacity:1;stroke-width:0.33488649" />
<path
d="m 72.507099,179.7588 3.39258,9.76411 q 0.982062,2.82645 1.575007,3.45555 0.609709,0.59447 1.635113,0.72773 1.025404,0.13327 3.415041,-0.69702 l 0.330331,0.95072 -17.832346,6.19592 -0.330331,-0.95071 q 2.415332,-0.83922 3.111495,-1.57065 0.712931,-0.76606 0.796984,-1.60159 0.109751,-0.84445 -0.872311,-3.6709 l -7.856504,-22.61162 q -0.982062,-2.82645 -1.591772,-3.42092 -0.592945,-0.6291 -1.618348,-0.76236 -1.025404,-0.13327 -3.415041,0.69702 l -0.330331,-0.95072 16.187864,-5.62454 q 6.320976,-2.19625 9.553754,-2.3404 3.232782,-0.14414 5.904185,1.577 2.662477,1.69545 3.7606,4.85593 1.339177,3.85425 -0.560957,7.33657 -1.219429,2.20912 -4.128851,4.11271 l 12.474459,8.88354 q 2.439061,1.71548 3.329239,2.03972 1.330261,0.4305 2.744571,0.0255 l 0.33033,0.95072 -10.971772,3.81219 -16.746132,-11.97806 z m -5.937017,-17.08719 5.303137,15.26284 1.464616,-0.50889 q 3.571608,-1.24097 5.121371,-2.49936 1.540832,-1.2841 1.953701,-3.32815 0.429633,-2.07869 -0.525644,-4.82805 -1.383817,-3.98273 -3.920215,-5.23243 -2.5107,-1.25862 -6.647599,0.17876 z"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:medium;line-height:1.25;font-family:'Times New Roman';-inkscape-font-specification:'Times New Roman, Bold';letter-spacing:0px;word-spacing:0px;fill:url(#linearGradient5332);fill-opacity:1;stroke:none;stroke-width:1.39273477"
id="letter-r"
inkscape:connector-curvature="0" />
<path
d="m 130.68189,137.70908 0.33514,0.96457 q -1.66517,0.84148 -2.33195,1.94973 -0.92304,1.54784 -2.04475,7.40121 l -3.217,15.4634 2.97106,8.55096 q 0.9511,2.73733 1.47316,3.3156 0.513,0.55218 1.52862,0.78362 1.03243,0.19649 2.4402,-0.29264 l 1.98136,-0.68843 0.33514,0.96457 -19.83925,6.89323 -0.33514,-0.96457 1.85095,-0.64312 q 1.5642,-0.54349 2.28645,-1.408 0.55091,-0.60076 0.63405,-1.62275 0.0692,-0.72522 -0.85477,-3.38436 l -2.46381,-7.09103 -13.57909,-12.2571 q -4.034666,-3.62353 -5.323131,-4.05231 -1.297544,-0.45491 -3.001119,0.10777 l -0.335146,-0.96457 16.945476,-5.88778 0.33515,0.96457 -0.75607,0.2627 q -1.53812,0.53443 -2.00989,1.19475 -0.44555,0.65179 -0.27353,1.14689 0.32609,0.93849 3.72516,3.99398 l 10.45421,9.48617 2.65629,-12.87275 q 1.01366,-4.73481 0.5698,-6.01227 -0.24455,-0.70385 -1.08543,-0.93761 -1.11283,-0.34377 -3.53051,0.35017 l -0.33515,-0.96457 z"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:medium;line-height:1.25;font-family:'Times New Roman';-inkscape-font-specification:'Times New Roman, Bold';letter-spacing:0px;word-spacing:0px;fill:url(#linearGradient5336);fill-opacity:1;stroke:none;stroke-width:1.41305673"
id="letter-y"
inkscape:connector-curvature="0" />
<path
d="m 102.64486,200.4253 4.18153,12.03476 -0.93156,0.32368 q -3.40148,-4.34864 -7.667536,-5.7445 -4.266052,-1.39586 -8.269247,-0.005 -3.826954,1.32969 -5.617541,4.37848 -1.79933,3.02363 -1.518338,7.24317 0.280991,4.21955 1.689414,8.2731 1.705854,4.90957 4.149964,8.20824 2.444105,3.29865 5.615805,4.1436 3.196874,0.83619 6.746879,-0.39727 1.23369,-0.42865 2.43025,-1.12657 1.21299,-0.73185 2.39761,-1.70779 l -2.46693,-7.1 q -0.69983,-2.01419 -1.17799,-2.49704 -0.4869,-0.50803 -1.53432,-0.68021 -1.022237,-0.18094 -2.255926,0.24771 l -0.881207,0.30618 -0.323675,-0.93156 16.591858,-5.76491 0.32368,0.93156 q -1.84457,0.78197 -2.45992,1.44726 -0.59892,0.63134 -0.68683,1.6777 -0.0604,0.5571 0.58696,2.42022 l 2.46693,7.1 q -2.76567,2.59752 -6.06198,4.56113 -3.26239,1.98004 -7.06416,3.30099 -4.859227,1.68835 -8.536819,1.49887 -3.661163,-0.22341 -6.872121,-1.50618 -3.194524,-1.3167 -5.515311,-3.52953 -2.969632,-2.86211 -4.465535,-7.16744 -2.676879,-7.70426 0.890426,-14.89749 3.567304,-7.19323 11.775112,-10.04506 2.54291,-0.88355 4.722241,-1.1893 1.177786,-0.18349 3.977586,-0.0841 2.81623,0.0655 3.269421,-0.0919 0.70497,-0.24494 1.13426,-0.95843 0.42055,-0.73868 0.42546,-2.34875 z"
style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:medium;line-height:1.25;font-family:'times new roman';-inkscape-font-specification:'times new roman, Bold';letter-spacing:0px;word-spacing:0px;fill:url(#linearGradient5334);fill-opacity:1;stroke:none;stroke-width:1.36467421"
id="letter-g"
inkscape:connector-curvature="0" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 11 KiB

View file

@ -0,0 +1,393 @@
body {
font-family: "Arial", "Helvetica Neue", sans-serif;
background-color: #0d193b;
color: #a0ccff;
box-sizing: border-box;
}
a {
color: #00caca;
text-decoration: none;
}
a:hover {
color: #4affff;
}
a:active {
color: white;
}
a:not(.no-icon)::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f0c1";
margin-right: 4px;
}
a:not(.no-icon)[href^="https://t.me"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f2c6";
margin-right: 3px;
}
a:not(.no-icon)[href^="https://www.youtube.com"]::before,
a:not(.no-icon)[href^="https://youtu.be"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f167";
margin-right: 3px;
}
a:not(.no-icon)[href^="https://vimeo.com"]::before,
a:not(.no-icon)[href^="https://player.vimeo.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f27d";
margin-right: 4px;
}
a:not(.no-icon)[href^="https://github.com"]::before,
a:not(.no-icon)[href^="https://gist.github.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f09b";
margin-right: 4px;
}
a:not(.no-icon)[href^="https://itch.io"]::before,
a:not(.no-icon)[href^="https://steffo.itch.io"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f83a";
margin-right: 3px;
}
a:not(.no-icon)[href^="https://www.kickstarter.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f3bb";
margin-right: 4px;
}
a:not(.no-icon)[href^="https://reddit.com"]::before,
a:not(.no-icon)[href^="https://new.reddit.com"]::before,
a:not(.no-icon)[href^="https://old.reddit.com"]::before,
a:not(.no-icon)[href^="https://redd.it"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f281";
margin-right: 3px;
}
a:not(.no-icon)[href^="https://www.twitch.tv"]::before,
a:not(.no-icon)[href^="https://clips.twitch.tv"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f1e8";
margin-right: 4px;
}
a:not(.no-icon)[href^="https://store.steampowered.com"]::before,
a:not(.no-icon)[href^="https://steamcommunity.com"]::before,
a:not(.no-icon)[href^="https://partner.steamgames.com"]::before,
a:not(.no-icon)[href^="steam:"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f1b6";
margin-right: 4px;
}
a:not(.no-icon)[href^="https://twitter.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f099";
margin-right: 3px;
}
a:not(.no-icon)[href^="https://it.wikipedia.org"]::before,
a:not(.no-icon)[href^="https://en.wikipedia.org"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f266";
margin-right: 3px;
}
a:not(.no-icon)[href^="#"]::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f13d";
margin-right: 3px;
}
a:not(.no-icon)[href^="http:"]::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f09c";
margin-right: 4px;
}
a:not(.no-icon)[href^="magnet:"]::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f076";
margin-right: 4px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #ffffff;
margin-top: 0;
margin-bottom: 0;
font-weight: normal;
}
code {
font-family: "Consolas", "Source Code Pro", monospace;
}
blockquote {
color: #a0ccff;
border-left: 3px solid #a0ccff;
background-color: rgba(160, 204, 255, 0.1);
padding: 2px 4px 2px 8px;
margin: 8px;
}
textarea {
background-color: rgba(160, 204, 255, 0.1);
color: #a0ccff;
border: 1px solid #a0ccff;
padding: 2px;
margin: 1px;
font-size: small;
font-family: "Consolas", "Source Code Pro", monospace;
width: 100%;
height: 300px;
}
button,
input[type="submit"],
.btn {
background-color: rgba(160, 204, 255, 0.1);
color: #a0ccff !important;
border: 1px solid #a0ccff;
border-radius: 0;
padding: 2px 8px;
margin: 1px;
font-size: medium;
font-family: sans-serif;
text-decoration: none;
cursor: default;
}
button:hover,
input[type="submit"]:hover,
.btn:hover {
background-color: rgba(160, 204, 255, 0.2);
color: #ffffff;
border-color: #ffffff;
}
button:active,
input[type="submit"]:active,
.btn:active {
background-color: rgba(160, 204, 255, 0.3);
color: white;
border-color: white;
}
pre {
margin: 0;
}
img {
margin-left: auto;
margin-right: auto;
display: block;
max-width: 100%;
}
.h-container {
display: flex;
justify-content: center;
align-content: center;
flex-direction: column;
}
@media (min-width: 800px) {
.h-container {
flex-direction: row;
}
}
.main-container {
width: 100%;
}
@media (min-width: 800px) {
.main-container {
width: 800px;
}
}
@media (min-width: 1200px) {
.main-container {
width: 1200px;
}
}
.title-bar {
display: flex;
justify-content: center;
align-content: center;
font-size: 64px;
color: #ffffff;
}
.title-bar .ryg-logo {
width: 144px;
height: 144px;
display: inline;
vertical-align: middle;
}
.box {
background-color: rgba(160, 204, 255, 0.1);
border-radius: 4px;
padding: 8px;
margin: 8px;
}
.doublebox {
margin: 8px;
}
.doublebox .top {
display: flex;
justify-content: space-between;
background-color: rgba(160, 204, 255, 0.2);
padding: 4px;
border-radius: 4px 4px 0 0;
color: #ffffff;
font-size: smaller;
font-weight: bold;
height: 16px;
}
.doublebox .top .left {
align-self: flex-start;
}
.doublebox .top .right {
align-self: flex-end;
}
.doublebox .bot {
background-color: rgba(160, 204, 255, 0.1);
padding: 8px;
border-radius: 0 0 4px 4px;
}
.multirow {
list-style-type: none;
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
}
.palette-color {
border-radius: 4px;
width: 32px;
height: 32px;
display: inline-block;
}
.palette-color.light {
border: 1px solid black;
}
.palette-color.dark {
border: 1px solid white;
}
.proscons {
padding: 4px 4px 4px 8px;
margin: 4px;
border-radius: 4px;
}
.proscons.plus {
color: #7dff7d;
background-color: rgba(125, 255, 125, 0.1);
}
.proscons.plus::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f0fe";
margin-right: 6px;
}
.proscons.minus {
color: #ff7d7d;
background-color: rgba(255, 125, 125, 0.1);
}
.proscons.minus::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f146";
margin-right: 6px;
}
.proscons.stars {
background-color: rgba(255, 255, 125, 0.1);
color: #ffff7d;
display: flex;
}
.proscons.stars .stars-0 {
margin-right: 6px;
}
.proscons.stars .stars-0::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005\f005\f005\f005";
}
.proscons.stars .stars-1 {
margin-right: 6px;
}
.proscons.stars .stars-1::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005";
}
.proscons.stars .stars-1::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005\f005\f005";
}
.proscons.stars .stars-2 {
margin-right: 6px;
}
.proscons.stars .stars-2::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005";
}
.proscons.stars .stars-2::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005\f005";
}
.proscons.stars .stars-3 {
margin-right: 6px;
}
.proscons.stars .stars-3::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005\f005";
}
.proscons.stars .stars-3::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005";
}
.proscons.stars .stars-4 {
margin-right: 6px;
}
.proscons.stars .stars-4::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005\f005\f005";
}
.proscons.stars .stars-4::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005";
}
.proscons.stars .stars-5 {
margin-right: 6px;
}
.proscons.stars .stars-5::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005\f005\f005\f005";
}
.proscons:not(.plus):not(.minus):not(.stars) {
color: #a0ccff;
background-color: rgba(160, 204, 255, 0.1);
}
.proscons:not(.plus):not(.minus):not(.stars)::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f0c8";
margin-right: 6px;
}
.proscons.big {
font-size: xx-large;
}
.spoiler {
color: rgba(0, 0, 0, 0);
border: 1px solid rgba(160, 204, 255, 0.1);
border-radius: 2px;
}
.spoiler:hover {
color: #a0ccff;
}
/*# sourceMappingURL=styling.css.map */

View file

@ -0,0 +1 @@
{"version":3,"sources":["styling.less"],"names":[],"mappings":"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","file":"styling.css"}

View file

@ -0,0 +1,477 @@
@bg: #0d193b; //Background color
@fg: #a0ccff; //Foreground color
@li: #00caca; //Link
@ec: #ffffff; //Extra color
@pastel-red: #ff7d7d;
@pastel-orange: #ffbb7d;
@pastel-yellow: #ffff7d;
@pastel-lime: #7dff7d;
@pastel-cyan: #7dffff;
@pastel-blue: #7d7dff;
@pastel-magenta: #ff7dff;
@main-fonts: "Arial", "Helvetica Neue", sans-serif;
@monospace-fonts: "Consolas", "Source Code Pro", monospace;
//General
body {
font-family: @main-fonts;
background-color: @bg;
color: @fg;
box-sizing: border-box;
}
a {
color: @li;
text-decoration: none;
&:hover {
color: lighten(@li, 25%);
}
&:active {
color: white;
}
//Icon link
//noinspection CssNoGenericFontName
&:not(.no-icon) {
//External link
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f0c1";
margin-right: 4px;
}
//Telegram link
&[href^="https://t.me"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f2c6";
margin-right: 3px;
}
//YouTube link
&[href^="https://www.youtube.com"]::before, &[href^="https://youtu.be"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f167";
margin-right: 3px;
}
//Vimeo link
&[href^="https://vimeo.com"]::before, &[href^="https://player.vimeo.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f27d";
margin-right: 4px;
}
//GitHub link
&[href^="https://github.com"]::before, &[href^="https://gist.github.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f09b";
margin-right: 4px;
}
//Itchio link
&[href^="https://itch.io"]::before, &[href^="https://steffo.itch.io"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f83a";
margin-right: 3px;
}
//Kickstarter link
&[href^="https://www.kickstarter.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f3bb";
margin-right: 4px;
}
//Reddit link
&[href^="https://reddit.com"]::before, &[href^="https://new.reddit.com"]::before, &[href^="https://old.reddit.com"]::before, &[href^="https://redd.it"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f281";
margin-right: 3px;
}
//Twitch link
&[href^="https://www.twitch.tv"]::before, &[href^="https://clips.twitch.tv"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f1e8";
margin-right: 4px;
}
//Steam link
&[href^="https://store.steampowered.com"]::before, &[href^="https://steamcommunity.com"]::before, &[href^="https://partner.steamgames.com"]::before, &[href^="steam:"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f1b6";
margin-right: 4px;
}
//Twitter link
&[href^="https://twitter.com"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f099";
margin-right: 3px;
}
//Wikipedia link
&[href^="https://it.wikipedia.org"]::before, &[href^="https://en.wikipedia.org"]::before {
font-family: "Font Awesome 5 Brands";
font-weight: bold;
content: "\f266";
margin-right: 3px;
}
//Anchor
&[href^="#"]::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f13d";
margin-right: 3px;
}
//Unsafe link
&[href^="http:"]::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f09c";
margin-right: 4px;
}
//Magnet link
&[href^="magnet:"]::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f076";
margin-right: 4px;
}
}
}
h1, h2, h3, h4, h5, h6 {
color: @ec;
margin-top: 0;
margin-bottom: 0;
font-weight: normal;
}
code {
font-family: @monospace-fonts;
}
blockquote {
color: @fg;
border-left: 3px solid @fg;
background-color: fade(@fg, 10%);
padding: 2px 4px 2px 8px;
margin: 8px;
}
textarea {
background-color: fade(@fg, 10%);
color: @fg;
border: 1px solid @fg;
padding: 2px;
margin: 1px;
font-size: small;
font-family: @monospace-fonts;
width: 100%;
height: 300px;
}
button, input[type="submit"], .btn {
background-color: fade(@fg, 10%);
color: @fg !important;
border: 1px solid @fg;
border-radius: 0;
padding: 2px 8px;
margin: 1px;
font-size: medium;
font-family: sans-serif;
text-decoration: none;
cursor: default;
&:hover {
background-color: fade(@fg, 20%);
color: lighten(@fg, 25%);
border-color: lighten(@fg, 25%);
}
&:active {
background-color: fade(@fg, 30%);
color: white;
border-color: white;
}
}
pre {
margin: 0;
}
img {
margin-left: auto;
margin-right: auto;
display: block;
max-width: 100%;
}
//Elements
.h-container {
display: flex;
justify-content: center;
align-content: center;
flex-direction: column;
@media (min-width: 800px)
{
flex-direction: row;
}
}
.main-container {
width: 100%;
@media (min-width: 800px)
{
width: 800px;
}
@media (min-width: 1200px)
{
width: 1200px;
}
}
.title-bar {
display: flex;
justify-content: center;
align-content: center;
font-size: 64px;
color: @ec;
.ryg-logo {
width: 144px;
height: 144px;
display: inline;
vertical-align: middle;
}
}
.box {
background-color: fade(@fg, 10%);
border-radius: 4px;
padding: 8px;
margin: 8px;
}
.doublebox {
margin: 8px;
.top {
display: flex;
justify-content: space-between;
background-color: fade(@fg, 20%);
padding: 4px;
border-radius: 4px 4px 0 0;
color: @ec;
font-size: smaller;
font-weight: bold;
height: 16px;
.left {
align-self: flex-start;
}
.right {
align-self: flex-end;
}
}
.bot {
background-color: fade(@fg, 10%);
padding: 8px;
border-radius: 0 0 4px 4px;
}
}
//This is something about the sidebar... better leave it alone.
.multirow {
list-style-type: none;
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
}
.palette-color {
border-radius: 4px;
width: 32px;
height: 32px;
display: inline-block;
&.light {
border: 1px solid black;
}
&.dark {
border: 1px solid white;
}
}
//noinspection CssNoGenericFontName
.proscons {
padding: 4px 4px 4px 8px;
margin: 4px;
border-radius: 4px;
&.plus {
color: @pastel-lime;
background-color: fade(@pastel-lime, 10%);
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f0fe";
margin-right: 6px;
}
}
&.minus {
color: @pastel-red;
background-color: fade(@pastel-red, 10%);
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f146";
margin-right: 6px;
}
}
&.stars {
background-color: fade(@pastel-yellow, 10%);
color: @pastel-yellow;
display: flex;
.stars-0 {
margin-right: 6px;
&::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005\f005\f005\f005";
}
}
.stars-1 {
margin-right: 6px;
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005";
}
&::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005\f005\f005";
}
}
.stars-2 {
margin-right: 6px;
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005";
}
&::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005\f005";
}
}
.stars-3 {
margin-right: 6px;
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005\f005";
}
&::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005\f005";
}
}
.stars-4 {
margin-right: 6px;
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005\f005\f005";
}
&::after {
font-family: "Font Awesome 5 Free";
font-weight: normal;
content: "\f005";
}
}
.stars-5 {
margin-right: 6px;
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f005\f005\f005\f005\f005";
}
}
}
&:not(.plus):not(.minus):not(.stars) {
color: @fg;
background-color: fade(@fg, 10%);
&::before {
font-family: "Font Awesome 5 Free";
font-weight: bold;
content: "\f0c8";
margin-right: 6px;
}
}
&.big {
font-size: xx-large;
}
}
.spoiler {
color: rgba(0, 0, 0, 0);
border: 1px solid fade(@fg, 10%);
border-radius: 2px;
&:hover {
color: @fg;
}
}

View file

@ -10,15 +10,12 @@
<meta property="og:site_name" content="Royal Games">
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css">
<link rel="stylesheet" href="https://steffo.eu/static/styling.css">
<link rel="icon" href="{{ url_for("static", filename="favicon.png") }}" type="image/png">
<link rel="stylesheet" href="{{ url_for("static", filename="styling.css") }}">
<link rel="icon" href="{{ url_for("static", filename="logo.png") }}" type="image/png">
</head>
<body>
<!--TODO: togliere questa roba-->
<div id="top-bar">
<span id="steffo">
Royal Games
</span>
<div class="title-bar">
<span><img class="ryg-logo" src="{{ url_for('static', filename="logo.svg") }}" alt=""> Royal Games</span>
</div>
<div class="h-container">
<div class="main-container">