ea6f226da8
J'ai ajouté un bouton déconnect, les pages respawnées se chargent dans une iframe pour conserver un accès vers l'index (en plus ça fait joli, la barre de titre est réduite dans ce mode) j'ai supprimé le bouton 'supprimer une page' dans le mode public (même si son effet était déjà inhibé dans le code) ainsi que le bouton bookmarklet Les noms des fichiers zippés sont désormais plus explicites.
69 lines
5.9 KiB
CSS
69 lines
5.9 KiB
CSS
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
|
|
body {
|
|
background:url(paper.png) #efe;
|
|
width: 100%;
|
|
min-width:320px;
|
|
margin:0;padding:0;
|
|
font-family: Georgia, Serif;font-size : 16px; color: #050;
|
|
}
|
|
a:hover { color: #050;text-shadow:0 0 5px green;}
|
|
|
|
a { color: black; text-decoration: none;}
|
|
|
|
input{outline:none;-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; height:25px;padding : 3px ; vertical-align: bottom; margin-top : 3px ;}
|
|
input[type=text]{width:80%;min-width:200px; background-color:rgba(255,255,255,0.8);border:1px solid #444;border-top-color:#333;border-bottom-color:#aaa; -moz-box-shadow: inset 0 1px 3px #000000; -webkit-box-shadow: inset 0 1px 3px #000000; box-shadow: inset 0 1px 3px #000000; }
|
|
input[type=text]:hover{background-color:rgba(200,255,200,0.8);-moz-box-shadow: inset 0 1px 3px #040; -webkit-box-shadow: inset 0 1px 3px #040; box-shadow: inset 0 1px 3px #040; }
|
|
input[type=text]:focus{background-color:rgba(200,255,200,0.9);-moz-box-shadow: inset 0 0 3px #040; -webkit-box-shadow: inset 0 0 3px #040; box-shadow: inset 0 0 3px #040; }
|
|
input[type=submit]{cursor: pointer; border:1px solid #494;border-bottom-color:#272;border-top-color:#afa; background-color:rgba(0,200,0,0.8); -moz-box-shadow: 0 1px 2px #080; -webkit-box-shadow: 0 1px 2px #080; box-shadow: 0 1px 2px #080; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#000')"; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#000'); }
|
|
input[type=submit]:hover{ background-color:rgba(0,255,0,0.8);}
|
|
input[type=submit]:active{border-color:black; background-color:rgba(0,255,0,0.8);}
|
|
#____q{margin-top:20px;}
|
|
header{
|
|
|
|
-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
|
|
border-bottom:1px solid #222;
|
|
-moz-box-shadow: 0 1px 3px #888; -webkit-box-shadow: 0 1px 3px #888; box-shadow: 0 1px 3px #888; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#888')"; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=135, Color='#888');
|
|
padding : 10px ; width: 100%; height:auto;margin: 0;
|
|
text-align: left;box-shadow: 0 1px 2px;
|
|
filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = #555, endColorstr = #333); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = #555, endColorstr = #333)";
|
|
background-image: -moz-linear-gradient( top, #555, #333); background-image: -ms-linear-gradient( top, #555, #333);
|
|
background-image: -o-linear-gradient( top, #555, #333); background-image: -webkit-gradient(linear, center top, center bottom, from(#555), to(#333)); background-image: -webkit-linear-gradient( top, #555, #333); background-image: linear-gradient( top, #555, #333);
|
|
}
|
|
header nav{display:inline-block; vertical-align: top;}
|
|
header nav p{color:lightgreen;text-shadow: 0 1px 1px black;font-size:20px;}
|
|
|
|
|
|
|
|
|
|
aside{height:100%;padding-bottom : 70px;text-align:center;}
|
|
aside iframe{height:100%;border:none;}
|
|
aside ul{padding:0;}
|
|
aside li{margin:5px;list-style:none;vertical-align:middle;border-radius:3px;}
|
|
aside .public li{background:rgba(100,255,100,0.2);}
|
|
aside .private li{background:rgba(255,100,100,0.2);}
|
|
aside .public {background:rgba(100,255,100,0.2);}
|
|
aside .private {background:rgba(255,100,100,0.2);}
|
|
aside li em {font-size:10px ; color:#484;}
|
|
aside li img {vertical-align:bottom;margin:1px;width:16px;height:16px;}
|
|
aside li a.suppr, aside li a.origine, aside li a.zip{opacity:0.5;width:16px;height:16px;display:inline-block;background:url(actions.png) no-repeat 0 -159px ;}
|
|
aside li a.origine{background-position: 0 -396px ;}
|
|
aside li a.zip{background-position: 0 2px ;}
|
|
aside li a.suppr:hover,aside li a.origine:hover,aside li a.zip:hover{opacity:1;}
|
|
aside li a.toprivate,aside li a.topublic{float:right;margin-right:5px;opacity:0.5;}
|
|
aside li a.toprivate:hover,aside li a.topublic:hover{opacity:1;}
|
|
|
|
aside .public,.private{min-width:300px;text-align:left;vertical-align:top; margin-top:25px;padding:10px; border-radius:5px; border:1px dashed;display:inline-block;}
|
|
aside .public{border-color:green;}
|
|
aside .private{border-color:red;}
|
|
footer {text-align: right; color:#F80;text-shadow: 0 1px 1px black; position:fixed;bottom:0;left:0;right:0;height:auto;min-height:20px;padding : 5px ; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border-top:1px solid #888;-moz-box-shadow: 0 0px 9px #000; -webkit-box-shadow: 0 0px 9px #000; box-shadow: 0 0px 9px #000; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=135, Color='#000')"; filter: progid:DXImageTransform.Microsoft.Shadow(Strength=9, Direction=135, Color='#000'); filter: progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = #555, endColorstr = #333); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr = #555, endColorstr = #333)"; background-image: -moz-linear-gradient( top, #555, #333); background-image: -ms-linear-gradient( top, #555, #333); background-image: -o-linear-gradient( top, #555, #333); background-image: -webkit-gradient(linear, center top, center bottom, from(#555), to(#333)); background-image: -webkit-linear-gradient( top, #555, #333); background-image: linear-gradient( top, #555, #333); }
|
|
footer p {margin:0;padding:0;color:lightgreen;text-shadow:0 1px 1px green;}
|
|
footer a {color:lightgreen;text-shadow:0 1px 1px green;}
|
|
footer a:hover {color:white;}
|
|
|
|
body.iframe aside{padding-bottom:0!important;}
|
|
body.iframe header {padding:2px;vertical-align: top;}
|
|
body.iframe header img{width:32px;height:auto;}
|
|
body.iframe header input{vertical-align: top;}
|
|
body.iframe header #____q{margin-top:2px;}
|
|
body.iframe header nav{margin-top:2px;display:inline-block; vertical-align: top;}
|
|
body.iframe header nav p{margin:0;padding:0;} |