General improvement
This commit is contained in:
parent
599da85947
commit
59cacfbe41
104
main.php
104
main.php
|
|
@ -1,87 +1,27 @@
|
|||
<?php
|
||||
include_once("utils/localization.php");
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
// Global variables
|
||||
$_dr = $_SERVER['DOCUMENT_ROOT'];
|
||||
|
||||
<title><?= $trans('title') ?></title>
|
||||
<meta name="author" content="Dendy">
|
||||
// Parse path into array
|
||||
// (e.g."/hello////13/thing" into ["hello", "13", "thing"])
|
||||
$GLOBALS['PARSED_PATH'] = (function () {
|
||||
/* - Usage of '#' as delimiters to be able to use '/' without escaping
|
||||
* - (a|b) checks patterns a or b and captures it, (?:a|b) doesn't capture
|
||||
*
|
||||
* - (?:/|) is there to remove the first '/'
|
||||
* - ([^/]+?) gets the content in a non-greedy way
|
||||
* - (?:/|$) limits the capture to the next '/' or the end of the string
|
||||
*/
|
||||
preg_match_all('#(?:/|)([^/]+?)(?:/|$)#', $_SERVER['DOCUMENT_URI'], $matches);
|
||||
|
||||
<!-- Stylesheets -->
|
||||
<link rel="stylesheet" href="static/style/reset.css">
|
||||
<link rel="stylesheet" href="static/style/main.css">
|
||||
</head>
|
||||
// If it doesn't find anything, it is the root
|
||||
$matches[1][0] = $matches[1][0] ?? '';
|
||||
|
||||
<body>
|
||||
<div id="title">
|
||||
<img src="static/resources/avi.png"/>
|
||||
<div>
|
||||
<h1><?= $trans('title') ?></h1>
|
||||
<p><?= $trans('subtitle') ?></p>
|
||||
</div>
|
||||
</div>
|
||||
// We don't care about the full pattern, just the captured group
|
||||
return $matches[1];
|
||||
})();
|
||||
|
||||
<div id="menu" class="section">
|
||||
<ul>
|
||||
<li><a href="#"><?= $trans('home') ?></a></li>
|
||||
<li><a href="#"><?= $trans('gallery') ?></a></li>
|
||||
<li><a href="#"><?= $trans('blog') ?></a></li>
|
||||
<li><a href="#"><?= $trans('about') ?></a></li>
|
||||
</ul>
|
||||
<div id="lang-select">
|
||||
LANG:<?php
|
||||
foreach($langs as $lang){
|
||||
printf(' <a href="/?lang=%s">%s</a>', $lang, strtoupper($lang));
|
||||
}
|
||||
?></div>
|
||||
</div>
|
||||
|
||||
<div id="content" class="row">
|
||||
<div id="main-section" class="section column middle">
|
||||
<h2><?= $trans('welcome') ?></h2>
|
||||
</div>
|
||||
|
||||
<div id="links" class="column right section">
|
||||
<h2><?= $trans('links') ?></h2>
|
||||
|
||||
<h3><?= $trans('programming') ?></h3><ul>
|
||||
<li><a href="https://git.fai.st/dendy"><?= $trans('git') ?></a></li>
|
||||
</ul>
|
||||
|
||||
<h3><?= $trans('people') ?></h3>
|
||||
<ul>
|
||||
<li><a href="https://dusk.fai.st">Dusk</a></li>
|
||||
<li><a href="https://yari.fai.st">Yarita</a></li>
|
||||
<li><a href="https://lidiarock.one">LidiaRock1</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="contact" class="column right section">
|
||||
<h2><?= $trans('contact') ?></h2>
|
||||
<ul>
|
||||
<li><a href="https://awoo.fai.st/dendy" rel="me" target="_blank">Fedi</a></li>
|
||||
<li><a href="xmpp:dendy@fai.st">XMPP</a></li>
|
||||
<li><a target="_blank" href="https://matrix.to/#/@dendy:fai.st">Matrix</a></li>
|
||||
</ul>
|
||||
<h2><?= $trans('keys') ?></h2>
|
||||
<ul>
|
||||
<li><a target="_blank" href="static/dendy.asc">PGP public key</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section" id="fediring">
|
||||
<ul>
|
||||
<li><a href="https://fediring.net/previous?host=dendy.cat"><-</a></li>
|
||||
<li><a href="https://fediring.net/">Fediring</a></li>
|
||||
<li><a href="https://fediring.net/next?host=dendy.cat">-></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="section" id="footer">
|
||||
<?= $trans('copyright') ?>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
match ($GLOBALS['PARSED_PATH'][0]) {
|
||||
'' => include_once "$_dr/pages/index.php",
|
||||
default => printf("404"),
|
||||
};
|
||||
|
|
|
|||
|
|
@ -0,0 +1,95 @@
|
|||
<?php
|
||||
include_once "$_dr/utils/localization.php";
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<title><?= $trans('title') ?></title>
|
||||
<meta name="author" content="Dendy">
|
||||
|
||||
<!-- Stylesheets -->
|
||||
<link rel="stylesheet" href="static/style/reset.css">
|
||||
<link rel="stylesheet" href="static/style/main.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="title">
|
||||
<img src="static/resources/avi.png" />
|
||||
<div>
|
||||
<h1><?= $trans('title') ?></h1>
|
||||
<p><?= $trans('subtitle') ?></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav id="navbar" class="section">
|
||||
<ul>
|
||||
<li><a href="#"><?= $trans('home') ?></a></li>
|
||||
<li><a href="#"><?= $trans('gallery') ?></a></li>
|
||||
<li><a href="#"><?= $trans('blog') ?></a></li>
|
||||
<li><a href="#"><?= $trans('about') ?></a></li>
|
||||
</ul>
|
||||
<div id="lang-select">
|
||||
LANG:<?php
|
||||
foreach ($langs as $lang) {
|
||||
printf(' <a href="/?lang=%s">%s</a>', $lang, strtoupper($lang));
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main class="row">
|
||||
<div class="column middle">
|
||||
<div class="section">
|
||||
<header><?= $trans('welcomeHeader') ?></header>
|
||||
<?= $trans('welcome') ?>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<header><?= $trans('projectsHeader') ?></header>
|
||||
<?= $trans('projects') ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="links" class="column right section">
|
||||
<header><?= $trans('links') ?></header>
|
||||
|
||||
<h3><?= $trans('programming') ?></h3>
|
||||
<ul>
|
||||
<li><a href="https://git.fai.st/dendy"><?= $trans('git') ?></a></li>
|
||||
</ul>
|
||||
|
||||
<h3><?= $trans('people') ?></h3>
|
||||
<ul>
|
||||
<li><a href="https://dusk.fai.st">Dusk</a></li>
|
||||
<li><a href="https://yari.fai.st">Yarita</a></li>
|
||||
<li><a href="https://lidiarock.one">LidiaRock1</a></li>
|
||||
<li><a href="https://sugui.me">Suguivy</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div id="contact" class="column right section">
|
||||
<header><?= $trans('contact') ?></header>
|
||||
<ul>
|
||||
<li><a href="https://awoo.fai.st/dendy" target="_blank">Fedi</a></li>
|
||||
<li><a href="xmpp:dendy@fai.st">XMPP</a></li>
|
||||
<li><a target="_blank" href="https://matrix.to/#/@dendy:fai.st">Matrix</a></li>
|
||||
<li><a type="application/pgp-keys" target="_blank" href="https://keys.openpgp.org/vks/v1/by-fingerprint/AB537E17CB430578DBFF75080168B35FFD7F608F">PGP public key</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div class="section" id="fediring">
|
||||
<ul>
|
||||
<li><a href="https://fediring.net/previous?host=dendy.cat"><-</a></li>
|
||||
<li><a href="https://fediring.net/">Fediring</a></li>
|
||||
<li><a href="https://fediring.net/next?host=dendy.cat">-></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="section" id="footer">
|
||||
<?= $trans('copyright') ?>
|
||||
</div>
|
||||
</body>
|
||||
|
|
@ -1,63 +1,84 @@
|
|||
|
||||
/**
|
||||
/********************
|
||||
* Generic elements *
|
||||
**/
|
||||
++++++++++++++++++**/
|
||||
|
||||
*{
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body{
|
||||
background-color: rgb(14,14,14);
|
||||
background-image: url(../resources/background.png);
|
||||
background-size: cover;
|
||||
color: white;
|
||||
margin: 40px 10%;
|
||||
font-family: sans-serif;
|
||||
background-color: rgb(14,14,14);
|
||||
background-image: url(../resources/background.png);
|
||||
background-size: cover;
|
||||
color: white;
|
||||
margin: 40px 10%;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: 40px;
|
||||
font-weight: bold;
|
||||
font-size: 40px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
h2{
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
h3{
|
||||
font-weight: bold;
|
||||
margin-bottom: 5px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
a{
|
||||
text-decoration: none;
|
||||
color: darkgrey;
|
||||
text-decoration: none;
|
||||
color: darkgrey;
|
||||
}
|
||||
a:hover{
|
||||
a:hover{
|
||||
background-color: darkgrey;
|
||||
color: black;
|
||||
}
|
||||
color: black;
|
||||
}
|
||||
|
||||
p{
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
b{
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
/******************
|
||||
* General layout *
|
||||
**/
|
||||
+++++++++++++++++*/
|
||||
|
||||
main {
|
||||
padding: 10px 0px;
|
||||
}
|
||||
|
||||
.section{
|
||||
background-color: rgba(5,5,5,0.6);
|
||||
margin-bottom: 10px;
|
||||
padding: 30px;
|
||||
border: 1px solid rgba(255,255,255,0.15);
|
||||
border-radius: 5px;
|
||||
background-color: rgba(5,5,5,0.6);
|
||||
margin-bottom: 10px;
|
||||
padding: 20px;
|
||||
border: 1px solid rgba(255,255,255,0.25);
|
||||
}
|
||||
.section header{
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.25);
|
||||
}
|
||||
.section p:last-of-type {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
|
||||
.row:after {
|
||||
content: "";
|
||||
|
|
@ -65,26 +86,25 @@ p{
|
|||
clear: both;
|
||||
}
|
||||
.column{
|
||||
float: left;
|
||||
float: left;
|
||||
}
|
||||
.column.middle{
|
||||
width: 75%;
|
||||
padding: 30px;
|
||||
.column.middle{
|
||||
width: 75%;
|
||||
min-height: 400px;
|
||||
}
|
||||
.column.right{
|
||||
width: calc(25% - 10px);
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
.column.right{
|
||||
width: calc(25% - 20px);
|
||||
margin-left: 20px;
|
||||
}
|
||||
.column.right li::before{
|
||||
content: "· ";
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1070px){
|
||||
.column.middle{
|
||||
@media screen and (max-width: 1070px){
|
||||
.column.middle{
|
||||
width: 100%;
|
||||
margin-left: 0px;
|
||||
}
|
||||
margin-left: 0px;
|
||||
}
|
||||
.column.right {
|
||||
width: calc(50% - 5px);
|
||||
margin-left: 0px;
|
||||
|
|
@ -93,26 +113,26 @@ p{
|
|||
.column.right:last-of-type{
|
||||
margin-right: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#footer{
|
||||
padding: 20px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Page title *
|
||||
**/
|
||||
/***************
|
||||
* Page header *
|
||||
***************/
|
||||
|
||||
#title{
|
||||
margin-bottom: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#title img {
|
||||
display: none;
|
||||
float: left;
|
||||
#title img {
|
||||
display: none;
|
||||
float: left;
|
||||
/* overlap border */
|
||||
transform: translateY(1px);
|
||||
}
|
||||
}
|
||||
#title:after {
|
||||
content: "";
|
||||
display: table;
|
||||
|
|
@ -121,33 +141,33 @@ p{
|
|||
#title div {
|
||||
padding-top: 20px;
|
||||
}
|
||||
@media screen and (min-width: 800px){
|
||||
#title{
|
||||
margin-bottom:0;
|
||||
}
|
||||
#title img{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 800px){
|
||||
#title{
|
||||
margin-bottom:0;
|
||||
}
|
||||
#title img{
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
#menu, #fediring{
|
||||
padding:0;
|
||||
overflow: hidden;
|
||||
padding: 10px 15px;
|
||||
#navbar, #fediring{
|
||||
padding:0;
|
||||
overflow: hidden;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
#menu li { float: left; }
|
||||
#navbar li { float: left; }
|
||||
#lang-select { float: right; }
|
||||
|
||||
#menu a, #fediring a{
|
||||
/*display: block;*/
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 12px 15px;
|
||||
}
|
||||
#menu a:hover, #fediring a:hover, #menu a.activated{
|
||||
background: rgba(255,255,255,1);
|
||||
#navbar a, #fediring a{
|
||||
/*display: block;*/
|
||||
color: white;
|
||||
text-align: center;
|
||||
padding: 12px 15px;
|
||||
}
|
||||
#navbar a:hover, #fediring a:hover, #navbar a.activated{
|
||||
background: rgba(255,255,255,1);
|
||||
color: black
|
||||
}
|
||||
}
|
||||
|
||||
#fediring{
|
||||
text-align: center;
|
||||
|
|
|
|||
Loading…
Reference in New Issue