La Bureautique, tic, tic…

This commit is contained in:
Boris 2022-10-30 19:56:28 +01:00
parent 94b5b3b84c
commit 17a47dafa1
4 changed files with 193 additions and 4 deletions

View File

@ -8,15 +8,19 @@ include_once('header.php');
echo '
<nav>
<ul>
<li>
<li id="dashboard-map">
<a href="map.php">
Carte
<span>
Carte
</span>
</a>
</li>
<li>
<li id="dashboard-messenger">
<a href="messenger.php">
Messagerie
<span>
Messagerie
</span>
</a>
</li>
</ul>

View File

@ -0,0 +1,100 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
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:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="600"
height="600"
viewBox="0 0 158.75 158.75"
version="1.1"
id="svg8"
inkscape:version="0.92.5 (2060ec1f9f, 2020-04-08)"
sodipodi:docname="dashboard-messenger.svg">
<defs
id="defs2" />
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="0.98994949"
inkscape:cx="312.49753"
inkscape:cy="326.56767"
inkscape:document-units="mm"
inkscape:current-layer="layer1"
showgrid="false"
units="px"
inkscape:window-width="1600"
inkscape:window-height="869"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1" />
<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></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Calque 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-138.25001)">
<rect
style="fill:#000000;fill-opacity:1;stroke-width:0.26705927"
id="rect4591"
width="159.29265"
height="158.49081"
x="-1.2208763e-07"
y="138.50919" />
<rect
id="rect18"
width="74.300934"
height="36.348656"
x="78.57724"
y="191.39627"
style="fill:#0c3114;fill-opacity:1;stroke-width:0.26458332" />
<rect
id="rect18-3"
width="74.300934"
height="22.98518"
x="4.2763057"
y="165.23613"
style="fill:#0c3114;fill-opacity:1;stroke-width:0.2103983" />
<rect
id="rect18-3-6"
width="74.300934"
height="35.814117"
x="3.4744968"
y="232.58809"
style="fill:#0c3114;fill-opacity:1;stroke-width:0.26263064" />
<rect
id="rect18-3-7"
width="74.300934"
height="15.234364"
x="79.646317"
y="272.72678"
style="fill:#0c3114;fill-opacity:1;stroke-width:0.17128938" />
<rect
id="rect18-3-7-5"
width="74.300934"
height="15.234364"
x="79.111778"
y="144.52274"
style="fill:#0c3114;fill-opacity:1;stroke-width:0.17128938" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@ -0,0 +1,32 @@
#dashboard-map {
border-style: solid;
border-color: hsl(132.2, 59.8%, 74.2%);
}
#dashboard-map {
background:
linear-gradient( 0deg, transparent 49.85%, hsl(132.2, 59.8%, 74.2%) 49.85%, hsl(132.2, 59.8%, 74.2%) 50.15%, transparent 50.15%),
linear-gradient( 90deg, transparent 49.85%, hsl(132.2, 59.8%, 74.2%) 49.85%, hsl(132.2, 59.8%, 74.2%) 50.15%, transparent 50.15%),
linear-gradient( 45deg, transparent 49.90%, hsl(132.2, 59.8%, 74.2%) 49.90%, hsl(132.2, 59.8%, 74.2%) 50.10%, transparent 50.10%),
linear-gradient(135deg, transparent 49.90%, hsl(132.2, 59.8%, 74.2%) 49.90%, hsl(132.2, 59.8%, 74.2%) 50.10%, transparent 50.10%),
repeating-radial-gradient(transparent 0, transparent 5%, hsl(132.2, 59.8%, 74.2%) 5%, hsl(132.2, 59.8%, 74.2%) 5.4%),
/*radial-gradient(circle at center, hsl(132.2, 59.8%, 37.1%) 0%, hsl(132.2, 59.8%, 74.2%) 50%, hsl(132.2, 59.8%, 37.1%) 100%), */
hsla(132.2, 59.8%, 37.1%, 0.8);
}
#dashboard-messenger {
background-image: url('dashboard-messenger.svg');
background-size: cover;
}
#dashboard-messenger {
border-style: outset;
border-color: gray;
}

View File

@ -0,0 +1,53 @@
body#home nav {
display: flex;
align-items: center;
height: 100vh;
}
body#home nav ul {
width: 100vw;
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
justify-content: space-evenly;
}
#dashboard-map {
border-radius: 12.5vw;
}
#dashboard-map a span {
display: none;
}
#dashboard-map a {
width: 25vw;
height: 25vw;
display: block;
}
#dashboard-messenger a span {
display: none;
}
#dashboard-messenger a {
width: 25vw;
height: 25vw;
display: block;
}
#dashboard-messenger {
border-radius: 1rem;
border-width: 0.5rem;
}