mougnibas/site-accueil-insa
2
0
Fork 0
forked from rebillar/site-accueil-insa
Code Issues Pull requests Releases Wiki Activity

"le css est une oeuvre diabolique" - Sun tzu

Browse source
This commit is contained in:
thaaoblues 2023-04-22 17:48:36 +02:00
parent 08a28ce828
commit 45da9fb748
5 changed files with 71 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

71
assets/css/menu.css
View file

@ -1,28 +1,75 @@
.menu {
position: fixed;
bottom: -150px;
left: 0;
bottom: -15%;
width: 100%;
height: auto;
height: 25vh;
z-index: 2;
overflow: visible;
transition: transform 0.3s;
}
.menu-row{
display: flex;
}
.menu-svg{
width: 370px;
margin-bottom: 0px;
width: 30vw;
height: 40vh;
}
#menu ul {
flex-wrap: wrap;
padding: 0;
margin: 0;
list-style: none;
display: flex;
justify-content: center;
background-color: transparent;
color: #fff;
height: 50px;
align-items: center;
background-color: rgba(0, 0, 0, 0.7); /* Add a semi-transparent background color for readability */
}
@media only screen and (max-width: 600px) {
/* Add styles for smartphones screens */
#menu ul {
height: auto;
flex-direction: column;
justify-content: center;
}
#menu li {
margin: 5px 0;
}
}
#menu li {
margin: 0 10px;
}
#menu a {
display: block; /* Add this line to make the link fill the entire menu item */
padding: 10px; /* Add some padding for better readability and clickable area */
color: #c25151;
text-decoration: none;
background-image: url('/assets/img/colonne.svg'); /* Add this line to set the link background image */
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.menu-link{
position: fixed;
margin-left: 10%;
bottom: 80px;
left: 0;
margin-left: 10px;
width: 100%;
z-index: 2;
position: absolute;
}
.menu-link use {

2
assets/css/page/index.css
View file

@ -1,7 +1,7 @@
#msg_acc {
display: block;
background-color: rgba(88, 159, 218, 0.798);
width: 80%;
width: 80vw;
max-width: 800px;
margin-left: auto;
margin-right: auto;

5
assets/css/page/prevs.css
View file

@ -36,10 +36,11 @@ iframe {
#desc {
display: block;
background-color: rgba(255,255,255,0.5);
background-color: rgba(88, 159, 218, 0.798);
width: 80vw;
margin: auto;
padding: 50px;
font-size: 1.2rem;
margin-top: 40px;
}
border-radius: 15px;
}

7
index.php
View file

@ -56,14 +56,9 @@ include "assets/scripts/globals.php";
<div id="msg_acc">
<p>
Bienvenue à l'<font color="red">INSA Toulouse</font> jeune aventurier, pour ta magnifique semaine d'accueil.
Bienvenue à l'<font color="red">INSA Toulouse</font> jeune gaulois, pour ta magnifique semaine d'accueil.
Ce site est fait pour t'aider à commencer l'aventure en toute sérénité.
</p>
<p>
Toutes les photos de ta semaine sont disponibles <a href="photos.php" class="link"> ici </a>! Pendant cette semaine tu
pourras découvrir toutes les photos prises par la Com Photo pour te remémorer plein de
souvenirs.
</p>
<p>
Tu vas pouvoir trouver ici des informations générales sur ta semaine, comme
<a href="planning.php" class="link">Le Planning</a>,

23
structure/menu.php
View file

@ -7,29 +7,20 @@ include "assets/scripts/globals.php"
?>
<div class="menu">
<div class="menu" id="menu">
<div class="menu-row">
<ul>
<?php
for($i = 0; $i <= 3; $i++){
echo "<div>";
echo "<img class=\"menu-svg\" src=\"assets/img/colonne.svg\">";
echo "</div>";
// 4 links per colums
/*for($j=$i*4+1;$j<=$i*4+2;$j++){
echo "<a style='margin-left:".($i*30)."%;' class='menu-link' href=".$SITE_MAP[$j][0].">".$SITE_MAP[$j][1]."</a>";
}
for($j=$i*4+3;$j<=$i*4+4;$j++){
echo "<a style='margin-left:".($i*200)."px; bottom:50px;' class='menu-link' href=".$SITE_MAP[$j][0].">".$SITE_MAP[$j][1]."</a>";
}*/
for($i = 0; $i <= 17; $i++){
echo "<li><a href=\"".$SITE_MAP[$i][0]."\">".$SITE_MAP[$i][1]."</a></li>";
}
?>
</div>
</ul>
</div>