Skip to content
Snippets Groups Projects
Unverified Commit 40f21971 authored by Conrad Zelck's avatar Conrad Zelck
Browse files

fix: use shared header styles 


Signed-off-by: default avatarConrad Zelck <git@simpel.cc>
parent a25a43a8
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
index.php
+ 59
− 51
View file @ 40f21971
<html lang="en"> <html lang="en">
<head>
<?php include dirname($_SERVER['DOCUMENT_ROOT']) . "/simpel.cc/php/head.php"; ?> <head>
<link rel="stylesheet" href="style.css"> <?php include dirname($_SERVER['DOCUMENT_ROOT']) . "/simpel.cc/php/head.php"; ?>
</head> <link rel="stylesheet" href="style.min.css">
<body> </head>
<header>
<?php include dirname($_SERVER['DOCUMENT_ROOT']) . "/simpel.cc/php/header.php"; ?> <body>
</header> <header>
<main> <?php include dirname($_SERVER['DOCUMENT_ROOT']) . "/simpel.cc/php/header.php"; ?>
<div> </header>
<label for="searchinput">Search language or comment syntax:</label> <main>
<input type="search" id="searchinput" onkeyup="searchSyntax()" onsearch="searchSyntax()" title="Type in a scripting language or comments syntax" placeholder="search string …" autofocus> <div>
<table id="resulttable"> <label for="searchinput">Search language or comment syntax:</label>
<thead> <input type="search" id="searchinput" onkeyup="searchSyntax()" onsearch="searchSyntax()"
<tr> title="Type in a scripting language or comments syntax" placeholder="search string …" autofocus>
<th title="programming, scripting or markdown language">language</th> <table id="resulttable">
<th title="line (L) or multiline (M) comment">type</th> <thead>
<th>comment syntax</th> <tr>
</tr> <th title="programming, scripting or markdown language">language</th>
</thead> <th title="line (L) or multiline (M) comment">type</th>
<tbody> <th>comment syntax</th>
<?php </tr>
$file = fopen("comments.csv", "r"); </thead>
// Fetching data from csv file row by row <tbody>
while (($data = fgetcsv($file)) !== false) { <?php
// HTML tag for placing in row format $file = fopen("comments.csv", "r");
echo "<tr>"; // Fetching data from csv file row by row
foreach ($data as $i) { while (($data = fgetcsv($file)) !== false) {
echo "<td>" . htmlspecialchars($i, ENT_QUOTES, 'UTF-8', false) . "</td>"; // HTML tag for placing in row format
} echo "<tr>";
echo "</tr> \n"; foreach ($data as $i) {
} echo "<td>" . htmlspecialchars($i, ENT_QUOTES, 'UTF-8', false) . "</td>";
fclose($file); }
?> echo "</tr> \n";
</tbody> }
</table> fclose($file);
</div> ?>
</main> </tbody>
<footer> </table>
<p>sources:</p> </div>
<ul> </main>
<li class="source"><a href="https://en.wikipedia.org/wiki/Comparison_of_programming_languages_(syntax)" target="_blank">en.wikipedia.org/wiki/Comparison_of_programming_languages_(syntax)</a></li> <footer>
<li class="source"><a href="http://rigaux.org/language-study/syntax-across-languages/Vrs.html" target="_blank">rigaux.org/language-study/syntax-across-languages/Vrs.html</a></li> <p>sources:</p>
<li class="source"><a href="https://pldb.com/languages/line-comments-feature.html" target="_blank">pldb.com/languages/line-comments-feature.html</a></li> <ul>
<li class="source"><a href="https://pldb.com/languages/multiline-comments-feature.html" target="_blank">pldb.com/languages/multiline-comments-feature.html</a></li> <li class="source"><a href="https://en.wikipedia.org/wiki/Comparison_of_programming_languages_(syntax)"
</ul> target="_blank">en.wikipedia.org/wiki/Comparison_of_programming_languages_(syntax)</a></li>
</footer> <li class="source"><a href="http://rigaux.org/language-study/syntax-across-languages/Vrs.html"
</body> target="_blank">rigaux.org/language-study/syntax-across-languages/Vrs.html</a></li>
<script> <li class="source"><a href="https://pldb.com/languages/line-comments-feature.html"
target="_blank">pldb.com/languages/line-comments-feature.html</a></li>
<li class="source"><a href="https://pldb.com/languages/multiline-comments-feature.html"
target="_blank">pldb.com/languages/multiline-comments-feature.html</a></li>
</ul>
</footer>
</body>
<script>
function searchSyntax() { function searchSyntax() {
var input, filter, table, tr, tdOne, tdThree, i, txtValue; var input, filter, table, tr, tdOne, tdThree, i, txtValue;
input = document.getElementById("searchinput"); input = document.getElementById("searchinput");
...@@ -68,5 +75,6 @@ ...@@ -68,5 +75,6 @@
} }
} }
} }
</script> </script>
</html>
</html>
\ No newline at end of file
style.css
+ 26
− 66
View file @ 40f21971
body { body {
min-height: 50vh; font-size: 2em;
font-family: helvetica, Arial, sans-serif; overflow-y: scroll;
font-size: 2vmin;
background-color: #555;
color: white;
margin: 3vmin 4vmin 2vmin 4vmin;
}
/* iPad portait */
@media (max-width: 768px) {
body {
font-size: 3vmin;
}
table {
width: inherit !important;
}
}
/* iPhone landscape only */
@media (max-width: 568px) {
body {
font-size: 4vmin;
}
table {
width: inherit !important;
}
}
/* iPhone portait only */
@media (max-width: 320px) {
body {
font-size: 4vmin;
}
table {
width: inherit !important;
}
}
a {
color: #ffffff;
text-decoration: none;
} }
header { header {
margin-bottom: 1.5em; margin-bottom: 1.5em;
} }
nav {
display: flex;
align-items: center;
column-gap: 0.7em;
}
h1 {
font-size: 1.5em;
margin: 0;
}
#github {
margin-left: auto;
}
#github-cat {
height: 1.5em;
}
main { main {
justify-content: center; justify-content: center;
display: flex; display: flex;
font-size: 0.75em;
} }
label, input { label, input {
display: block; display: block;
} }
label {
font-size: 1.25em;
margin-bottom: 0.5em;
}
input { input {
font-size: medium; font-size: inherit;
font-family: inherit; font-family: inherit;
height: 2.5em; height: 2.5em;
margin-top: 0.2em; margin-top: 0.2em;
...@@ -104,9 +49,9 @@ input[type="search"] { ...@@ -104,9 +49,9 @@ input[type="search"] {
} }
table { table {
font-size: medium; font-size: inherit;
border: 1px solid white; border: 1px solid white;
margin-top: 2vmin; margin-top: 1.4em;
width: 70ch; width: 70ch;
max-width: calc(100vw - 8vmin); max-width: calc(100vw - 8vmin);
border-collapse: collapse; border-collapse: collapse;
...@@ -157,11 +102,26 @@ th:nth-child(3), td:nth-child(3) { ...@@ -157,11 +102,26 @@ th:nth-child(3), td:nth-child(3) {
} }
footer { footer {
font-size: 0.75em;
margin: auto; margin: auto;
} }
footer p {
margin-block-end: 0em;
line-height: 1.5;
}
footer ul {
margin-top: 0em;
}
.source {
line-height: 1.5;
}
.source a { .source a {
word-break: break-all; word-break: break-all;
text-decoration: none;
} }
.source a:hover { .source a:hover {
......
style.min.css 0 → 100644
+ 1
− 0
View file @ 40f21971
body{font-size:2em;overflow-y:scroll;}header{margin-bottom:1.5em;}main{justify-content:center;display:flex;font-size:.75em;}label,input{display:block;}label{font-size:1.25em;margin-bottom:.5em;}input{font-size:inherit;font-family:inherit;height:2.5em;margin-top:.2em;padding:5px 10px;color:white;border:2px solid;cursor:pointer;-webkit-border-radius:5px;border-radius:5px;}input{color:#333;border-color:white;background-color:white;box-sizing:border-box;}input[type="search"]{width:70ch;max-width:calc(100vw - 8vmin);}table{font-size:inherit;border:1px solid white;margin-top:1.4em;width:70ch;max-width:calc(100vw - 8vmin);border-collapse:collapse;}table,td,th{padding-left:10px;padding-top:10px;padding-bottom:10px;}tr:nth-child(even){background-color:#555;}tr:nth-child(odd){background-color:#555;}tr,th{border-bottom:1px solid white;}tr:last-child{border-bottom:none;}td:nth-child(even),th:nth-child(even){border-left:1px solid white;border-right:1px solid white;}th{text-align:left;background-color:#444444;}th:nth-child(1),td:nth-child(1){width:35ch;}th:nth-child(2),td:nth-child(2){width:5ch;}th:nth-child(3),td:nth-child(3){width:32ch;}footer{font-size:.75em;margin:auto;}footer p{margin-block-end:0;line-height:1.5;}footer ul{margin-top:0;}.source{line-height:1.5;}.source a{word-break:break-all;text-decoration:none;}.source a:hover{text-decoration:underline;}
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment