ESIR
/
KiWi-Calendar
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

PHP & HTML issues

master
n0m1s 10 years ago
parent
053b5d32b1
commit
aabb85b03e
4 changed files with 319 additions and 246 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +79
    -78
      index.css
  2. +115
    -115
      index.html
  3. +117
    -0
      index.php
  4. +8
    -53
      main.css

+ 79
- 78
index.css View File

@ -56,23 +56,23 @@ nav .onglet:hover
#hamburgerMenu #hamburgerMenu
{ {
background-color:#fff;
height:100%;
background-color:#fff;
height:100%;
} }
#hamburgerMenu h2 #hamburgerMenu h2
{ {
font-size:22px;
color:#2b2b2b;
margin-left:5%;
margin-top:5%;
font-size:22px;
color:#2b2b2b;
margin-left:5%;
margin-top:5%;
} }
form form
{ {
margin-top:-20px;
margin-left:20%;
margin-bottom:-20px;
margin-top:-20px;
margin-left:20%;
margin-bottom:-20px;
} }
input[type="checkbox"] { input[type="checkbox"] {
@ -93,47 +93,47 @@ input[type="checkbox"]:checked + label span {
#AddEvent #AddEvent
{ {
margin:0;
margin-top:45px;
text-align:center;
font-size: 20px;
padding-top:15px;
height: 40px;
width: 100%;
position:absolute;
color: #ffffff;
background-color: #2b2b2b;
margin:0;
margin-top:45px;
text-align:center;
font-size: 20px;
padding-top:15px;
height: 40px;
width: 100%;
position:absolute;
color: #ffffff;
background-color: #2b2b2b;
} }
#container #container
{ {
margin-top:120px;
margin-top:120px;
} }
#AddEvent:hover #AddEvent:hover
{ {
color: #2b2b2b;
background-color: #40c1e6;
color: #2b2b2b;
background-color: #40c1e6;
} }
#calendar #calendar
{ {
height:100%;
margin:0;
margin-left:-10px;
background-color:#f1f1f1;
height:100%;
margin:0;
margin-left:-10px;
background-color:#f1f1f1;
} }
#footer #footer
{ {
position:fixed;
background-color:#f1f1f1;
bottom:0px;
height:54px;
color:#2b2b2B;
margin:0;
width:100%;
border:1px solid #2b2b2b;
position:fixed;
background-color:#f1f1f1;
bottom:0px;
height:54px;
color:#2b2b2B;
margin:0;
width:100%;
border:1px solid #2b2b2b;
} }
#Export #Export
@ -145,18 +145,18 @@ input[type="checkbox"]:checked + label span {
#exMois #exMois
{ {
margin-top:-10px;
height:30px;
width:30%;
margin-left:auto;
margin-right:auto;
margin-top:-10px;
height:30px;
width:30%;
margin-left:auto;
margin-right:auto;
} }
#Mois #Mois
{ {
text-align:center;
font-size: 30px;
margin-top:-45px;
text-align:center;
font-size: 30px;
margin-top:-45px;
} }
#exLess #exLess
@ -176,54 +176,55 @@ input[type="checkbox"]:checked + label span {
/*Calendar*/ /*Calendar*/
table
{
width:100%;
margin:0;
padding:0;
border-style:none;
table-layout: fixed;
#calendar {
margin-top:60px;
} }
tr
{
height:250px;
border-style:none;
margin:0;
width:100%;
padding:0;
#calendar .week {
padding: 0;
margin: 0;
list-style: none;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
flex-wrap: wrap;
justify-content: center;
} }
td
{
border-style:none;
height:100%;
#calendar .week .day {
padding: 5px;
width: 200px;
height: 200px;
margin:0; margin:0;
padding:0; padding:0;
border:1px solid #2b2b2b;
} }
td:hover
{
background-color: #40c1e6;
#calendar .week .today {
background-color: #a5dff0;
} }
tr #date
{
font-size:30px;
margin:20px;
color:#2b2b2b;
#calendar .week .day:hover {
background-color: #65ccea;
} }
#calendar #event
{
margin:0;
border:1px solid #2b2b2b;
height:100%;
width:100%;
#calendar .week .day h2 {
font-size: 30px;
margin: 20px;
color: #2B2B2B;
} }
#link
{
margin-left:10px;
font-size:12px;
#calendar .week .otherMonth h2 {
color: #4B4B4B;
}
#calendar .week .day ul {
margin-left: -20px;
font-size:12px;
} }

+ 115
- 115
index.html View File

@ -32,41 +32,41 @@
</div></a> </div></a>
<div id="container"> <div id="container">
<h2>Conférences, Évènements</h2> <h2>Conférences, Évènements</h2>
<form name="confs" action="" method="POST">
<div align="left"><br>
<input type="checkbox" id="c1" name="cc" />
<label for="c1"><span></span>Biomédical</label><br>
<input type="checkbox" id="c2" name="cc" />
<label for="c2"><span></span>Domotique</label><br>
<input type="checkbox" id="c3" name="cc" />
<label for="c3"><span></span>Informatique</label><br>
<input type="checkbox" id="c4" name="cc" />
<label for="c4"><span></span>Matériaux</label><br>
<input type="checkbox" id="c5" name="cc" />
<label for="c5"><span></span>Télécommunication</label><br>
<input type="checkbox" id="c6" name="cc" />
<label for="c6"><span></span>Divers</label><br>
<br>
</div>
</form>
<form name="confs" action="" method="POST">
<div align="left"><br>
<input type="checkbox" id="c1" name="cc" />
<label for="c1"><span></span>Biomédical</label><br>
<input type="checkbox" id="c2" name="cc" />
<label for="c2"><span></span>Domotique</label><br>
<input type="checkbox" id="c3" name="cc" />
<label for="c3"><span></span>Informatique</label><br>
<input type="checkbox" id="c4" name="cc" />
<label for="c4"><span></span>Matériaux</label><br>
<input type="checkbox" id="c5" name="cc" />
<label for="c5"><span></span>Télécommunication</label><br>
<input type="checkbox" id="c6" name="cc" />
<label for="c6"><span></span>Divers</label><br>
<br>
</div>
</form>
<h2>Clubs, associations</h2> <h2>Clubs, associations</h2>
<form name="confs" action="" method="POST"> <form name="confs" action="" method="POST">
<div align="left"><br>
<input type="checkbox" id="c7" name="cc" />
<label for="c7"><span></span>Club Framboise</label><br>
<input type="checkbox" id="c8" name="cc" />
<label for="c8"><span></span>ESIRDuino</label><br>
<input type="checkbox" id="c9" name="cc" />
<label for="c9"><span></span>Club Tricot</label><br>
<input type="checkbox" id="c10" name="cc" />
<label for="c10"><span></span>Club Miam</label><br>
<input type="checkbox" id="c11" name="cc" />
<label for="c11"><span></span>Les lapins noirs</label><br>
<input type="checkbox" id="c12" name="cc" />
<label for="c12"><span></span>Club rigolo</label><br>
<br>
</div>
</form>
<div align="left"><br>
<input type="checkbox" id="c7" name="cc" />
<label for="c7"><span></span>Club Framboise</label><br>
<input type="checkbox" id="c8" name="cc" />
<label for="c8"><span></span>ESIRDuino</label><br>
<input type="checkbox" id="c9" name="cc" />
<label for="c9"><span></span>Club Tricot</label><br>
<input type="checkbox" id="c10" name="cc" />
<label for="c10"><span></span>Club Miam</label><br>
<input type="checkbox" id="c11" name="cc" />
<label for="c11"><span></span>Les lapins noirs</label><br>
<input type="checkbox" id="c12" name="cc" />
<label for="c12"><span></span>Club rigolo</label><br>
<br>
</div>
</form>
</div> </div>
</nav> </nav>
@ -75,90 +75,90 @@
<div id="calendar"> <div id="calendar">
<ul class="flex-container"> <ul class="flex-container">
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Domotique</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club tricot</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de kakapos</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Sécurité</div>
<div id="link">14h : Conférence - Cryptographie</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club Jeux</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de zombies</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Compilation</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club robotique</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de bananes</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Imagerie numérique</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club tarot</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de kakapos</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Communication</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club Saucisson</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de nuages</div></li>
</ul>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Domotique</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club tricot</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de kakapos</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Sécurité</div>
<div id="link">14h : Conférence - Cryptographie</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club Jeux</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de zombies</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Compilation</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club robotique</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de bananes</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Imagerie numérique</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club tarot</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de kakapos</div></li>
<li class="flex-item"><div id="event"><div id="date">6</div>
<div id="link">10h : Conférence - Communication</div></li>
<li class="flex-item"><div id="event"><div id="date">7</div>
</li>
<li class="flex-item"><div id="event"><div id="date">8</div>
</li>
<li class="flex-item"><div id="event"><div id="date">9</div>
<div id="link">20h : Club Saucisson</div></li>
<li class="flex-item"><div id="event"><div id="date">10</div>
<div id="link">21h : Soirée ISATI</div></li>
<li class="flex-item"><div id="event"><div id="date">11</div>
</li>
<li class="flex-item"><div id="event"><div id="date">12</div>
<div id="link">8h : Invasion de nuages</div></li>
</ul>
<div id="footer">
<div id="TextFooter">
<div id="exMois">
<a id="ancherMore" href="#More" onclick="alert('Click on More');"><img id="exMore" alt="expand less" src="images/expand_less.png" /></a>
<div id="Mois">Mars 2015</div>
<a id="ancherLess" href="#Less" onclick="alert('Click on Less');"><img id="exLess" alt="expand more" src="images/expand_more.png" /></a>
</div>
<div id="Export">Exporter en <a href="#RSS">RSS</a>, <a href="#iCal">iCal</a>, <a href="#webCal">WebCal</a></div>
</div>
<div>
<div id="footer">
<div id="TextFooter">
<div id="exMois">
<a id="ancherMore" href="#More" onclick="alert('Click on More');"><img id="exMore" alt="expand less" src="images/expand_less.png" /></a>
<div id="Mois">Mars 2015</div>
<a id="ancherLess" href="#Less" onclick="alert('Click on Less');"><img id="exLess" alt="expand more" src="images/expand_more.png" /></a>
</div>
<div id="Export">Exporter en <a href="#RSS">RSS</a>, <a href="#iCal">iCal</a>, <a href="#webCal">WebCal</a></div>
</div>
<div>
</div> </div>
<script src="hamburger.js"></script> <script src="hamburger.js"></script>
</body> </body>


+ 117
- 0
index.php View File

@ -0,0 +1,117 @@
<!DOCTYPE html>
<html>
<head>
<title>Kiwi Calendar</title>
<meta charset="utf-8" />
<link rel="stylesheet" href="./index.css" />
<link rel="stylesheet" href="./main.css" />
<link rel="icon" type="image/png" href="favicon.png" />
<!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /><![endif]-->
</head>
<body>
<header id="title">
<a id="hamburgerButton" href="#"><img alt="menu" src="./images/menu.png" /></a>
<img alt="logo ESIR" src="./images/esir.png" />
<img class="rightLogo" alt="logo Kiwi" src="./images/KiWiCalendar.png" />
</header>
<nav id="hamburgerMenu">
<a id="ancherESIR" href="#ESIR" onclick="alert('Click on ESIR');">
<div class="onglet" id="onglet-esir">
Esir
</div>
</a>
<a id="ancherRennes" href="#Rennes" onclick="alert('Click on Rennes');">
<div class="onglet" id="onglet-ext">
Rennes
</div>
</a>
<a id="ancherEvent" href="#addEvent" onclick="alert('Ajoute un evenement');"><div class="Button" id="AddEvent">
+ Ajouter un Évènement
</div></a>
<div id="container">
<h2>Conférences, Évènements</h2>
<form name="confs" action="" method="POST">
<div align="left"><br>
<input type="checkbox" id="c1" name="cc" />
<label for="c1"><span></span>Biomédical</label><br>
<input type="checkbox" id="c2" name="cc" />
<label for="c2"><span></span>Domotique</label><br>
<input type="checkbox" id="c3" name="cc" />
<label for="c3"><span></span>Informatique</label><br>
<input type="checkbox" id="c4" name="cc" />
<label for="c4"><span></span>Matériaux</label><br>
<input type="checkbox" id="c5" name="cc" />
<label for="c5"><span></span>Télécommunication</label><br>
<input type="checkbox" id="c6" name="cc" />
<label for="c6"><span></span>Divers</label><br>
<br>
</div>
</form>
<h2>Clubs, associations</h2>
<form name="confs" action="" method="POST">
<div align="left"><br>
<input type="checkbox" id="c7" name="cc" />
<label for="c7"><span></span>Club Framboise</label><br>
<input type="checkbox" id="c8" name="cc" />
<label for="c8"><span></span>ESIRDuino</label><br>
<input type="checkbox" id="c9" name="cc" />
<label for="c9"><span></span>Club Tricot</label><br>
<input type="checkbox" id="c10" name="cc" />
<label for="c10"><span></span>Club Miam</label><br>
<input type="checkbox" id="c11" name="cc" />
<label for="c11"><span></span>Les lapins noirs</label><br>
<input type="checkbox" id="c12" name="cc" />
<label for="c12"><span></span>Club rigolo</label><br>
<br>
</div>
</form>
</div>
</nav>
<div id="calendar">
<?php
for($week = 0; $week < 5; ++$week)
{
echo('
<ul class="week">');
for($date = strtotime('last monday +'.$week.' weeks'); $date < strtotime('next monday +'.$week.' weeks'); $date = strtotime('+1 day', $date))
{
$class = '';
if(date('m', $date) != date('m'))
$class .= ' otherMonth';
if(date('Y-m-d', $date) == date('Y-m-d'))
$class .= ' today';
echo('
<li class="day'.$class.'">
<h2>'.date("d", $date).'</h2>
<ul>
<li class="calendar-link">10h : Conférence - Domotique</li>
</ul>
</li>');
}
echo('
</ul>'."\n");
}
?>
<div id="footer">
<div id="TextFooter">
<div id="exMois">
<a id="ancherMore" href="#More" onclick="alert('Click on More');"><img id="exMore" alt="expand less" src="images/expand_less.png" /></a>
<div id="Mois">Mars 2015</div>
<a id="ancherLess" href="#Less" onclick="alert('Click on Less');"><img id="exLess" alt="expand more" src="images/expand_more.png" /></a>
</div>
<div id="Export">Exporter en <a href="#RSS">RSS</a>, <a href="#iCal">iCal</a>, <a href="#webCal">WebCal</a></div>
</div>
<div>
</div>
<script src="hamburger.js"></script>
</body>
</html>

+ 8
- 53
main.css View File

@ -19,67 +19,22 @@ body, html {
a a
{ {
color:#5fd0f1;
text-decoration:none;
color:#5fd0f1;
text-decoration:none;
} }
#title img #title img
{ {
padding-top:10px;
height: 50px;
padding-top:10px;
height: 50px;
} }
#title .rightLogo #title .rightLogo
{ {
float:right;
margin-right:25px;
}
.flex-container {
padding: 0;
margin: 0;
list-style: none;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
flex-wrap: wrap;
justify-content: center;
}
.flex-item {
padding: 5px;
width: 200px;
height: 200px;
margin:0;
padding:0;
}
#date {
font-size: 30px;
margin: 20px;
color: #2B2B2B;
float:right;
margin-right:25px;
} }
#link {
margin-left: 10px;
font-size: 12px;
}
#calendar #event:hover {
background-color: #65ccea;
}
#calendar {
margin-top:60px;
}
@media only screen and (max-width: 1000px) and (max-height: 500px){ @media only screen and (max-width: 1000px) and (max-height: 500px){
#title #title
@ -89,8 +44,8 @@ a
#title img #title img
{ {
padding-top:10px;
height: 30px;
padding-top:10px;
height: 30px;
} }
} }

Write Preview
Loading…
Cancel
Save