Resolving legacy CSS issue where styles lived in two parallel files

This commit is contained in:
John Donaldson 2018-09-12 10:45:38 -05:00
parent 2acff8f6a3
commit 986951c9bf
23 changed files with 130 additions and 169 deletions

View File

@ -45,7 +45,7 @@ class Page:
ret.write("<html>\n")
ret.write(" <head>\n")
ret.write(" <title>{}</title>\n".format(self.title))
ret.write(" <link rel=\"stylesheet\" href=\"{}/files/www/res/style.css\">\n".format(self.base))
ret.write(" <link rel=\"stylesheet\" href=\"{}/files/www/css/style.css\">\n".format(self.base))
for s in self.scripts:
ret.write(" {}\n".format(s))
ret.write(" </head>\n")

View File

@ -61,7 +61,7 @@ def generate_html(ziphandle, puzzle, puzzledir, category, points, authors, files
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title>{category} {points}</title>
<link rel="stylesheet" href="../../style.css">
<link rel="stylesheet" href="../../css/style.css">
{scripts}
</head>
<body>

View File

@ -33,7 +33,7 @@ function koth.page(title, body)
print()
end
print("<!DOCTYPE html>")
print("<html><head><title>" .. title .. "</title><link rel=\"stylesheet\" href=\"../css/style.css\"><meta name=\"viewport\" content=\"width=device-width\"></head>")
print("<html><head><title>" .. title .. "</title><link rel=\"stylesheet\" href=\"../../css/style.css\"><meta name=\"viewport\" content=\"width=device-width\"></head>")
print("<body><h1>" .. title .. "</h1>")
if (body) then
print("<section>")

85
www/css/style-legacy.css Normal file
View File

@ -0,0 +1,85 @@
html {
color: #ccb;
height: 100%;
}
body {
margin: 0;
height: 100%
}
pre, tt {
background-color: rgba(0, 0, 0, 0.3);
}
.terminal {
background: rgba(80, 70, 60, 0.96);
display: inline-block;
margin: 1%;
border: solid black 0.2em;
border-radius: 1em 1em 0.5em 1em;
overflow: auto;
}
.terminal p {
padding: 0.25em 0.5em;
}
#overview, #messages {
width: 47%;
height: 20%;
}
#puzzles {
width: 24%;
height: 70%;
}
#main {
width: 70%;
height: 70%;
}
.download {
background: #080;
color: white;
display: inline-block;
}
.download:link {
color: inherit;
text-decoration: inherit;
}
h1 {
text-align: center;
font-size: 120%;
}
a:link, .link {
color: #13a5de;
cursor: pointer;
}
a:visited {
color: #999999;
}
@media (max-width: 52em) {
#overview, #messages, #puzzles, #main {
width: 96%;
}
}
::-webkit-scrollbar {
width: 0.7em;
}
::-webkit-scrollbar-track {
/* -webkit-box-shadow: inset 0 0 0.5em rgba(200, 200, 200, 0.3); */
background: rgba(0, 0, 0, 0.2);
}
::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.2);
border-radius: 1em;
}

View File

@ -9,14 +9,13 @@ Tan: #e1caa5
@import "../fonts/maven_pro.css";
html {
background: #35170c url(../images/background.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
/* min-height: 100%;*/
font-family: "Maven Pro", Ubuntu, sans-serif;
overflow-y: auto;
background: #35170c url(../images/background.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
font-family: "Maven Pro", Ubuntu, sans-serif;
overflow-y: auto;
}
h1, h2, h3 {
@ -259,3 +258,36 @@ nav li + li:before {
font-size: small;
text-align: center;
}
#puzzles {
width: 24%;
height: 20%;
}
.category h2 {
margin: 0;
font-size: 100%;
}
.category ul {
margin: 0;
padding-left: 1em;
font-size: 90%;
}
.category li {
display: inline;
}
.category li + li:before {
content: " ";
}
.category a:link, .link {
color: #13a5de;
cursor: pointer;
}
.category a:visited {
color: #999999;
}

View File

@ -3,6 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="res/style.css">
<link rel="icon" href="images/luna-moth.svg" type="image/svg+xml">
<link rel="icon" href="images/luna-moth.png" type="image/png">

View File

@ -4,7 +4,7 @@
<title>Open Puzzles</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css" type="text/css">
<link rel="stylesheet" href="res/style.css">
<!--<link rel="stylesheet" href="css/style-legacy.css">-->
<link rel="icon" href="images/luna-moth.svg" type="image/svg+xml">
<link rel="icon" href="images/luna-moth.png" type="image/png">

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -1,18 +0,0 @@
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
src: local('Lato Regular'), local('Lato-Regular'), url(Lato-Regular.ttf) format('truetype');
}
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 700;
src: local('Lato Bold'), local('Lato-Bold'), url(Lato-Bold.ttf) format('truetype');
}
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 400;
src: local('Lato Italic'), local('Lato-Italic'), url(Lato-Italic.ttf) format('truetype');
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 236 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 52 KiB

View File

@ -1,139 +0,0 @@
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 400;
src: local('Lato Regular'), local('Lato-Regular'), url(Lato-Regular.ttf) format('truetype');
}
@font-face {
font-family: 'Lato';
font-style: normal;
font-weight: 700;
src: local('Lato Bold'), local('Lato-Bold'), url(Lato-Bold.ttf) format('truetype');
}
@font-face {
font-family: 'Lato';
font-style: italic;
font-weight: 400;
src: local('Lato Italic'), local('Lato-Italic'), url(Lato-Italic.ttf) format('truetype');
}
@font-face {
font-family: 'Inconsolata';
font-style: normal;
font-weight: 400;
src: local('Inconsolata Regular'), local('Inconsolata-Regular'), url(Inconsolata-Regular.ttf) format('truetype');
}
html {
background: rgba(61, 50, 44, 0) url(brown-lines.jpg) no-repeat center center fixed;
background-size: cover;
color: #ccb;
height: 100%;
font-family: Lato, sans-serif;
}
body {
margin: 0;
height: 100%
}
pre, tt {
font-family: Inconsolata, monospace;
background-color: rgba(0, 0, 0, 0.3);
}
.terminal {
background: rgba(80, 70, 60, 0.96);
display: inline-block;
margin: 1%;
border: solid black 0.2em;
border-radius: 1em 1em 0.5em 1em;
overflow: auto;
}
.terminal p {
padding: 0.25em 0.5em;
}
#preview {
background-image: url(preview.png);
background-size: contain;
max-width: 40em;
display: block;
margin: 1% auto;
}
#overview, #messages {
width: 47%;
height: 20%;
}
#puzzles {
width: 24%;
height: 70%;
}
#main {
width: 70%;
height: 70%;
}
.download {
background: #080;
color: white;
display: inline-block;
}
.download:link {
color: inherit;
text-decoration: inherit;
}
h1 {
text-align: center;
font-size: 120%;
}
a:link, .link {
color: #13a5de;
cursor: pointer;
}
a:visited {
color: #999999;
}
.category h2 {
margin: 0;
font-size: 100%;
}
.category ul {
margin: 0;
padding-left: 1em;
font-size: 90%;
}
.category li {
display: inline;
}
.category li + li:before {
content: " ";
}
@media (max-width: 52em) {
#overview, #messages, #puzzles, #main {
width: 96%;
}
}
::-webkit-scrollbar {
width: 0.7em;
}
::-webkit-scrollbar-track {
/* -webkit-box-shadow: inset 0 0 0.5em rgba(200, 200, 200, 0.3); */
background: rgba(0, 0, 0, 0.2);
}
::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.2);
border-radius: 1em;
}