css addEvent

10 years ago · 94c6c1ac60
--- a/addEvent.css
+++ b/addEvent.css
@ -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%;
 }
--- a/addEvent.php
+++ b/addEvent.php
@ -9,6 +9,7 @@
        <link rel="stylesheet" type="text/css" media="screen"
           href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
        <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]-->
    </head>
    <body>
@ -20,14 +21,14 @@
        <div id="descEvent">
              <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">
             <br>
             Adresse du lieu :<br>
             <div id="left">Adresse :</div>
             <input type="text" name="address">
             <br>
             Date de début :<br>
             <div id="left">Date de début :</div>
             <div id="datetimepicker" class="input-append date">
               <input type="text" name="dtstart"></input>
               <span class="add-on">
@ -35,7 +36,7 @@
               </span>
             </div>
             <br>
             Date de fin :<br>
             <div id="left">Date de fin :</div>
             <div id="datetimepicker2" class="input-append date">
               <input type="text" name="dtend"></input>
               <span class="add-on">
@ -43,20 +44,21 @@
               </span>
             </div>
             <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>
             <br>
             Site de l'évènement :<br>
             <div id="left">Site de l'évènement :</div>
             <input type="url" value="http://" name="site">
             <br>
             Image de l'évènement :<br>
             <div id="left">Image de l'évènement :</div>
             <input type="url" value="http://" name="urlImage">
             <br>
            Contact :<br>
            <div id="left">Contact :</div>
             <input type="text" name="contact">
             <br>
             <div id="buttonDiv"><button id="submit">Ajouter l'évènement !</button></div>
            </form>
            <button id="submit">Ajouter l'évènement !</button>


 <script type="text/javascript"
--- a/index.css
+++ b/index.css
@ -78,7 +78,6 @@ form
 input[type="checkbox"] {
    display:none;
 }

 input[type="checkbox"] + label span {
    display:inline-block;
    width:19px;
@ -95,27 +94,26 @@ input[type="checkbox"]:checked + label span {
 #AddEvent
 {
    margin:0;
    margin-top:45px;
    text-align:center;
    font-size: 20px;
    padding-top:1em;
    height: 3em;
    padding-top:15px;
    height: 40px;
    width: 100%;
    position:absolute;
    bottom: 3em;
    color: #ffffff;
    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