Stylisation de l'application.
This commit is contained in:
Chouchen
152
css/clock.css
152
css/clock.css
@@ -1,152 +0,0 @@
|
||||
#fancyClock{
|
||||
|
||||
margin:40px auto;
|
||||
|
||||
height:100px;
|
||||
|
||||
/*border:1px solid #111111;*/
|
||||
|
||||
width:300px;
|
||||
float:left;
|
||||
|
||||
}
|
||||
#fancyClock:after{content: div;clear:both;}
|
||||
|
||||
.clock{
|
||||
|
||||
/* The .clock div. Created dynamically by jQuery */
|
||||
background:url(../images/interface/clock.png) top left no-repeat;
|
||||
background-color:#FFF;
|
||||
|
||||
height:100px;
|
||||
|
||||
width:100px;
|
||||
|
||||
position:relative;
|
||||
|
||||
overflow:hidden;
|
||||
|
||||
float:left;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.clock .rotate{
|
||||
|
||||
/* There are two .rotate divs - one for each half of the background */
|
||||
|
||||
position:absolute;
|
||||
|
||||
width:100px;
|
||||
|
||||
height:100px;
|
||||
|
||||
top:0;
|
||||
|
||||
left:0;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.rotate.right{
|
||||
|
||||
display:none;
|
||||
|
||||
z-index:11;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.clock .bg, .clock .front{
|
||||
|
||||
width:50px;
|
||||
|
||||
height:100px;
|
||||
|
||||
background-color:#FFF;
|
||||
|
||||
position:absolute;
|
||||
|
||||
top:0;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.clock .display{
|
||||
|
||||
/* Holds the number of seconds, minutes or hours respectfully */
|
||||
|
||||
position:absolute;
|
||||
|
||||
width:100px;
|
||||
|
||||
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
|
||||
|
||||
z-index:20;
|
||||
|
||||
color:#F5F5F5;
|
||||
|
||||
font-size:30px;
|
||||
|
||||
text-align:center;
|
||||
|
||||
top:33px;
|
||||
|
||||
left:0;
|
||||
|
||||
|
||||
|
||||
/* CSS3 text shadow: */
|
||||
|
||||
text-shadow:4px 4px 5px #333333;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* The left part of the background: */
|
||||
|
||||
|
||||
|
||||
.clock .bg.left{ left:0; }
|
||||
|
||||
|
||||
|
||||
/* Individual styles for each color: */
|
||||
|
||||
.orange .bg.left{ background:url(../images/bg_orange.png) no-repeat left top; }
|
||||
|
||||
.green .bg.left{ background:url(../images/bg_green.png) no-repeat left top; }
|
||||
|
||||
.blue .bg.left{ background:url(../images/bg_blue.png) no-repeat left top; }
|
||||
|
||||
|
||||
|
||||
/* The right part of the background: */
|
||||
|
||||
.clock .bg.right{ left:100px; }
|
||||
|
||||
|
||||
|
||||
.orange .bg.right{ background:url(../images/bg_orange.png) no-repeat right top; }
|
||||
|
||||
.green .bg.right{ background:url(../images/bg_green.png) no-repeat right top; }
|
||||
|
||||
.blue .bg.right{ background:url(../images/bg_blue.png) no-repeat right top; }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.clock .front.left{
|
||||
|
||||
left:0;
|
||||
|
||||
z-index:10;
|
||||
|
||||
}
|
||||
|
||||
@@ -305,7 +305,7 @@ div#fancy-bg-s {
|
||||
bottom: 0;
|
||||
|
||||
left: 0;
|
||||
|
||||
|
||||
font-family: Arial;
|
||||
|
||||
font-size: 12px;
|
||||
|
||||
68
css/main.css
68
css/main.css
@@ -43,66 +43,6 @@
|
||||
border-color:#BFBFBF;
|
||||
}
|
||||
|
||||
#googlemenu {
|
||||
width: 100%;
|
||||
padding: 0 0 0 0;
|
||||
margin-left: 0px;
|
||||
margin-top: 5px;
|
||||
overflow:auto;
|
||||
height:395px;
|
||||
}
|
||||
|
||||
#googlemenu ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#googlemenu li.item {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 0px;
|
||||
padding-left: 4px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
height:18px;
|
||||
border-color:white;
|
||||
border-width:1px;
|
||||
line-height:20px;
|
||||
border-left:none;
|
||||
border-right:none;
|
||||
background-color:rgba(235,239,249,0.0);
|
||||
|
||||
-webkit-transition: background-color 0.3s ease-out ;
|
||||
}
|
||||
|
||||
#googlemenu li.item:hover {
|
||||
background-color:#ebeff9;
|
||||
border-color:#BFCDF6;
|
||||
|
||||
-webkit-transition: background-color 0s ease-out ;
|
||||
}
|
||||
|
||||
#googlemenu li.disabled {
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
#googlemenu li img {
|
||||
margin-top: 2px;
|
||||
margin-right:4px;
|
||||
}
|
||||
|
||||
#googlemenu li.empty {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 0px;
|
||||
padding-left: 4px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
||||
#googlemenu li.empty a:hover{
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
ul.iconlist li{
|
||||
display:inline-block;
|
||||
text-align:center;
|
||||
@@ -273,14 +213,14 @@
|
||||
border:1px solid #ccc;
|
||||
height:32px;
|
||||
}
|
||||
|
||||
#menu-bar{height:40px;background: -moz-linear-gradient(top, #ECD9D9 0%, #fff 100%);background: -webkit-gradient(linear, left top, left bottom, from(#ECD9D9), to(#fff)); position:relative; top:0; left:0; border-bottom:1px solid #ECD9D9;}
|
||||
#recherche{margin-top:70px;}
|
||||
|
||||
#config {width:300px;}
|
||||
#config-menu, #blog-links-manager {width:100px; margin:0 auto; text-align:center;display:block;}
|
||||
#config-menu, #blog-links-manager, #city-menu {float:right; margin:12px 10px 0 0;}
|
||||
|
||||
/* Green button class: */
|
||||
a.green-button,a.green-button:visited{
|
||||
a.green-button,a.green-button:visited, span.green-button{
|
||||
color:black;
|
||||
display:block;
|
||||
font-size:10px;
|
||||
@@ -295,7 +235,7 @@ a.green-button,a.green-button:visited{
|
||||
background:url(../images/interface/button_green.png) no-repeat left top;
|
||||
}
|
||||
|
||||
a.green-button:hover{
|
||||
a.green-button:hover, span.green-button:hover{
|
||||
text-decoration:none;
|
||||
background-position:left bottom;
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
#todoList {/*position:absolute; bottom:10px; left: 100px;*/padding:5px;width:350px;-webkit-border-radius: 5px;
|
||||
#todoList {padding:5px;width:350px;-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;border: 1px solid rgba(0,0,0,0.3);
|
||||
-webkit-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.15);
|
||||
-moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.15);}
|
||||
@@ -1,4 +1,6 @@
|
||||
#weather {position:absolute; top:10px; left: 100px;padding:5px;-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;border: 1px solid rgba(0,0,0,0.3);
|
||||
-webkit-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.15);
|
||||
-moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.15);}
|
||||
-moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.15);}
|
||||
|
||||
#city-submit{cursor:pointer;}
|
||||
Reference in New Issue
Block a user