Skip to content

Instantly share code, notes, and snippets.

@ekdevdes
Created June 28, 2012 04:57
Show Gist options
  • Select an option

  • Save ekdevdes/3009204 to your computer and use it in GitHub Desktop.

Select an option

Save ekdevdes/3009204 to your computer and use it in GitHub Desktop.
[CSS] iCal-like event adder (posted via Fiddles for iOS)
body{
font-family:sans-serif;
padding:20px;
}
a{
color:white;
background:blue;
padding:15px;
text-decoration:none;
border-radius:4px;
font-weight:bold;
}
.rotate{
-moz-transition: -moz-transform .2s ease-in-out;
-moz-transform: rotate(-45deg);
}
.rotate-back{
-moz-transition: -moz-transform .2s ease-in-out;
-moz-transform: rotate(0deg);
}
a span{
color:white;
font-size:20px;
}
#event{
margin-bottom:0;
margin-top:0;
width:215px;
}
a:hover{
background:darkBlue;
}
div::before{
content:"";
position:absolute;
top:-5px;
left:0px;
width:0;
height:0;
line-height:0;
border-left:9px solid transparent;
border-right:9px solid transparent;
border-bottom:9px solid lightGray;
}
div{
background:lightGray;
width:225px;
padding:5px;
position:relative;
border-radius:4px;
top:20px;
}
input:-moz-placeholder{
font-style:italic;
}
div form input{
/* width:215px; */
padding:5px;
border-radius:4px;
border:none;
margin-bottom:7px;
margin-top:7px;
display:inline;
}
label{
font-size:12px;
font-weight:bold;
margin-right:10px;
color:#444;
}
div form p.repeating{
padding:0;margin:0;
position:relative;
bottom:5px;
margin-bottom:5px;
}
div form
#event{
margin-bottom:3px;
}
div form{
text-align:center;
margin:0 auto;
}
#endr{
width:125px;
}
div form p{
color:#444;
}
span{
text-align:center;
font-size:10px;
color:#444444;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment