Browse Source

css addEvent

master
AmarOk 10 years ago
parent
commit
94c6c1ac60
3 changed files with 67 additions and 20 deletions
  1. +47
    -0
      addEvent.css
  2. +12
    -10
      addEvent.php
  3. +8
    -10
      index.css

+ 47
- 0
addEvent.css View File

@ -0,0 +1,47 @@
#eventForm {
margin-top: 30px;
border: 1px solid #5B5B5B;
padding: 20px;
padding-left: 20%;
padding-top:40px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; /* future proofing */
-khtml-border-radius: 10px; /* for old Konqueror browsers */
}
#buttonDiv {
width:80%;
text-align: center;
}
#submit {
margin-top:30px;
margin-left:auto;
margin-right:auto;
height: 60px;
padding: 0;
padding-left: 20px;
padding-right: 20px;
font-size: 22px;
color:white;
text-align: center;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
background: #454545;
border: 0;
border-bottom: 2px solid #2f2e2e;
cursor: pointer;
-webkit-box-shadow: inset 0 -2px #2f2e2e;
box-shadow: inset 0 -2px #2f2e2e;
}
#left {
width: 40%;
font-size: 17px;
font-weight: bold;
}
textarea, input {
width: 80%;
}

+ 12
- 10
addEvent.php View File

@ -9,6 +9,7 @@
<link rel="stylesheet" type="text/css" media="screen" <link rel="stylesheet" type="text/css" media="screen"
href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css"> href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
<link rel="icon" type="image/png" href="favicon.png" /> <link rel="icon" type="image/png" href="favicon.png" />
<link rel="stylesheet" href="./addEvent.css" />
<!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /><![endif]--> <!--[if IE]><link rel="shortcut icon" type="image/x-icon" href="favicon.ico" /><![endif]-->
</head> </head>
<body> <body>
@ -20,14 +21,14 @@
<div id="descEvent"> <div id="descEvent">
<h1>Ajouter un Évènement</h1> <h1>Ajouter un Évènement</h1>
<form name="eventForm">
Titre de l'évènement :<br>
<form id="eventForm" name="eventForm">
<div id="left">Titre :</div>
<input type="text" name="title"> <input type="text" name="title">
<br> <br>
Adresse du lieu :<br>
<div id="left">Adresse :</div>
<input type="text" name="address"> <input type="text" name="address">
<br> <br>
Date de début :<br>
<div id="left">Date de début :</div>
<div id="datetimepicker" class="input-append date"> <div id="datetimepicker" class="input-append date">
<input type="text" name="dtstart"></input> <input type="text" name="dtstart"></input>
<span class="add-on"> <span class="add-on">
@ -35,7 +36,7 @@
</span> </span>
</div> </div>
<br> <br>
Date de fin :<br>
<div id="left">Date de fin :</div>
<div id="datetimepicker2" class="input-append date"> <div id="datetimepicker2" class="input-append date">
<input type="text" name="dtend"></input> <input type="text" name="dtend"></input>
<span class="add-on"> <span class="add-on">
@ -43,20 +44,21 @@
</span> </span>
</div> </div>
<br> <br>
Description de l'évènement :<br>
<div id="left">Description de l'évènement :</div>
<textarea name="description" rows="4" cols="50" form="eventForm"> <textarea name="description" rows="4" cols="50" form="eventForm">
</textarea> </textarea>
<br> <br>
Site de l'évènement :<br>
<div id="left">Site de l'évènement :</div>
<input type="url" value="http://" name="site"> <input type="url" value="http://" name="site">
<br> <br>
Image de l'évènement :<br>
<div id="left">Image de l'évènement :</div>
<input type="url" value="http://" name="urlImage"> <input type="url" value="http://" name="urlImage">
<br> <br>
Contact :<br>
<div id="left">Contact :</div>
<input type="text" name="contact"> <input type="text" name="contact">
<br>
<div id="buttonDiv"><button id="submit">Ajouter l'évènement !</button></div>
</form> </form>
<button id="submit">Ajouter l'évènement !</button>
<script type="text/javascript" <script type="text/javascript"


+ 8
- 10
index.css View File

@ -78,7 +78,6 @@ form
input[type="checkbox"] { input[type="checkbox"] {
display:none; display:none;
} }
input[type="checkbox"] + label span { input[type="checkbox"] + label span {
display:inline-block; display:inline-block;
width:19px; width:19px;
@ -95,27 +94,26 @@ input[type="checkbox"]:checked + label span {
#AddEvent #AddEvent
{ {
margin:0; margin:0;
margin-top:45px;
text-align:center; text-align:center;
font-size: 20px; font-size: 20px;
padding-top:1em;
height: 3em;
padding-top:15px;
height: 40px;
width: 100%; width: 100%;
position:absolute; position:absolute;
bottom: 3em;
color: #ffffff; color: #ffffff;
background-color: #2b2b2b; background-color: #2b2b2b;
} }
#AddEvent:hover
#container
{ {
color: #2b2b2b;
background-color: #40c1e6;
margin-top:120px;
} }
#container
#AddEvent:hover
{ {
margin-top:0px;
padding-top: 40px;
color: #2b2b2b;
background-color: #40c1e6;
} }
#calendar #calendar


Loading…
Cancel
Save