2.2
This commit is contained in:
broncowdd
parent
bf75eb57f4
commit
fbe6e7c42a
|
|
@ -0,0 +1,9 @@
|
||||||
|
<?php include('auto_form2file.php'); ?>
|
||||||
|
|
||||||
|
|
||||||
|
the $_POST data was converted into a php config file
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<a href='index.php'> Return to form and see the changes !</a>
|
||||||
|
|
@ -0,0 +1,186 @@
|
||||||
|
<?php
|
||||||
|
/**
|
||||||
|
* @author bronco@warriordudimanche.com
|
||||||
|
* @copyright open source and free to adapt (keep me aware !)
|
||||||
|
* @version 0.1
|
||||||
|
* auto_form.php is a little script to auto create a form and
|
||||||
|
* its content only with an array.
|
||||||
|
* It can create text inputs radiobuttons, select lists, passwords inputs.
|
||||||
|
* All the generated form's elements can be reached by classes
|
||||||
|
* and ids with css or jquery.
|
||||||
|
*
|
||||||
|
* It's possible to configure auto_form to add some features
|
||||||
|
* like placeholders, labels etc.
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
/* this is an example array
|
||||||
|
$config=array(
|
||||||
|
'use_a_boolean_value'=>true,
|
||||||
|
'allow_user_to_config'=>false,
|
||||||
|
'adresse_du_site'=>'www.warriordudimanche.net',
|
||||||
|
'use_a_choice'=>'choice one',// current value: other values are defined below
|
||||||
|
'use_a_radiobutton_choice'=>'choice one',// current value: other values are defined below
|
||||||
|
'my_password'=>'password',
|
||||||
|
'confirm_password'=>'',
|
||||||
|
|
||||||
|
);*/
|
||||||
|
//then render_form($config);
|
||||||
|
|
||||||
|
|
||||||
|
/* #####################################################################
|
||||||
|
# auto_form config #
|
||||||
|
#####################################################################
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
// here are the basic parameters
|
||||||
|
$autoform_config=array(
|
||||||
|
'use_labels'=>true,
|
||||||
|
'use_placeholder'=>true,
|
||||||
|
'method'=>'post',
|
||||||
|
'action'=>'config_page.php',
|
||||||
|
'form_name'=>'autoform',
|
||||||
|
'form_id'=>'autoform',
|
||||||
|
'form_class'=>'autoform',
|
||||||
|
'enctype'=>'',
|
||||||
|
'submit_button_label'=>'Save changes',
|
||||||
|
'reset_button_label'
|
||||||
|
);
|
||||||
|
|
||||||
|
foreach (glob('design/*') as $skin){
|
||||||
|
$skin=basename($skin);if ($skin!='index.html'){$skins[]=$skin;}
|
||||||
|
}
|
||||||
|
$autoform_config['skin']=$skins;
|
||||||
|
$autoform_config['default_data_folder']=array('private','public');
|
||||||
|
|
||||||
|
/* #####################################################################
|
||||||
|
# the render function #
|
||||||
|
#####################################################################
|
||||||
|
You can call it from anywhere in the page and render more than one form
|
||||||
|
just call render_form($data_array)to create a brand new form with differents
|
||||||
|
names, classes, ids etc.
|
||||||
|
*/
|
||||||
|
function render_form($var){
|
||||||
|
global $autoform_config;$all_keys='';
|
||||||
|
$id=$class=$enctype=$reset='';
|
||||||
|
if ($autoform_config['form_id']){$id=' id="'.$autoform_config['form_id'].'" ';}
|
||||||
|
if ($autoform_config['form_class']){$class=' class="'.$autoform_config['form_class'].'" ';}
|
||||||
|
if ($autoform_config['enctype']){$enctype=' enctype="'.$autoform_config['enctype'].'" ';}
|
||||||
|
if (isset($autoform_config['reset_button_label'])){$reset="<input type='reset' value='".$autoform_config['reset_button_label'].'"/>';}
|
||||||
|
|
||||||
|
echo '<form name="'.$autoform_config['form_name']."\" $id $class $enctype method=\"".$autoform_config['method']."\" action=\"".$autoform_config['action']."\">\n ";
|
||||||
|
foreach($var as $key=>$value){
|
||||||
|
$all_keys.=$key.' | ';
|
||||||
|
$txt=str_replace('_',' ',$key);
|
||||||
|
$label="<label class='$key' for='$key'>$txt</label>";
|
||||||
|
$idclasname="name='$key' id='$key' class='$key'";
|
||||||
|
//
|
||||||
|
echo '<li>';
|
||||||
|
if (is_bool($value)){
|
||||||
|
// oh, a checkbox !
|
||||||
|
if ($value==true){$checked=' checked ';}else{$checked='';}
|
||||||
|
echo $label;
|
||||||
|
echo "<input $idclasname type='checkbox' $checked value=true />";
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
if (!$autoform_config['use_labels']){$label='';}
|
||||||
|
if (isset($autoform_config[$key])&&is_array($autoform_config[$key])){
|
||||||
|
// lists of choices
|
||||||
|
if (isset($autoform_config[$key]['type'])&&$autoform_config[$key]['type']=='radio'){
|
||||||
|
unset($autoform_config[$key]['type']);
|
||||||
|
|
||||||
|
// oh, a radiobutton list !
|
||||||
|
echo $txt.'<br/>';
|
||||||
|
echo "<ul>\n";
|
||||||
|
foreach ($autoform_config[$key] as $chkey=>$choice){
|
||||||
|
if ($choice==$value){$checked='checked';}else{$checked='';}
|
||||||
|
echo "<li><label for='$choice$key'> $choice </label><input name='$key' type='radio' value='$choice' $checked id='$choice$key'/></li>\n";
|
||||||
|
}
|
||||||
|
echo "</ul>\n";
|
||||||
|
|
||||||
|
}else{
|
||||||
|
// oh, a select input !
|
||||||
|
echo $label;
|
||||||
|
echo "<select $idclasname text='$value'>\n";
|
||||||
|
foreach ($autoform_config[$key] as $choice){
|
||||||
|
if ($choice==$value){$checked='selected';}else{$checked='';}
|
||||||
|
echo "<option $checked value='$choice'>$choice</option>\n";
|
||||||
|
}
|
||||||
|
echo "</select>\n";
|
||||||
|
}
|
||||||
|
}else if (isset($autoform_config[$key]) && $autoform_config[$key]=='pass'){
|
||||||
|
//oh, a password input !
|
||||||
|
echo $label;
|
||||||
|
echo "<input type='password' $idclasname value='$value' />\n";
|
||||||
|
|
||||||
|
}else{
|
||||||
|
// ok, so that's a text input...
|
||||||
|
echo $label;
|
||||||
|
if ($autoform_config['use_placeholder']){$placeholder=" placeholder='$txt'";}else{$placeholder='';}
|
||||||
|
echo "<input type='text' $idclasname value='$value' $placeholder/>\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
echo "</li>\n";
|
||||||
|
}
|
||||||
|
echo "<input type='hidden' name='all_keys' value='$all_keys'/>\n";// this line to prevent unchecked boxes to desapear.
|
||||||
|
echo '<input type="submit" value="'.$autoform_config['submit_button_label']."\"/> $reset \n </form>";
|
||||||
|
}
|
||||||
|
include('auto_restrict.php');
|
||||||
|
include('config.php');
|
||||||
|
unset($GLOBAL['private_data_folder']);
|
||||||
|
unset($GLOBAL['public_data_folder']);
|
||||||
|
$GLOBAL['default_data_folder']=basename($GLOBAL['default_data_folder']);
|
||||||
|
|
||||||
|
$message='';
|
||||||
|
if ($_POST){
|
||||||
|
$auto_form['filename']='config.php';
|
||||||
|
$auto_form['filecontent']="<?php \n /* The configuration generated with auto_form*/\n\n";
|
||||||
|
$auto_form['variable_name']='$GLOBAL';
|
||||||
|
$all_keys=explode(' | ',$_POST['all_keys']);
|
||||||
|
unset($all_keys[count($all_keys)-1]);
|
||||||
|
$postdata=array_map('strip_tags',$_POST);
|
||||||
|
foreach ($all_keys as $key){
|
||||||
|
if (!isset($postdata[$key])){$postdata[$key]=false;} // avoid unchecked boxes to desapear from config file
|
||||||
|
if ($postdata[$key]===true){$postdata[$key]='true';} else
|
||||||
|
if ($postdata[$key]===false){$postdata[$key]='false';}
|
||||||
|
if ($postdata[$key]=='true'||$postdata[$key]=='false'){ //bool
|
||||||
|
$auto_form['filecontent'].=$auto_form['variable_name']."['$key']=".$postdata[$key].";\n";
|
||||||
|
}else{// not bool
|
||||||
|
$auto_form['filecontent'].=$auto_form['variable_name']."['$key']='".$postdata[$key]."';\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
$auto_form['filecontent'].="\n?>";
|
||||||
|
|
||||||
|
file_put_contents($auto_form['filename'],$auto_form['filecontent']);
|
||||||
|
if ($postdata['data_folder']!=$GLOBAL['data_folder']){ rename ($GLOBAL['data_folder'],$postdata['data_folder']);}
|
||||||
|
$message=' saved.';
|
||||||
|
unset($postdata['all_keys']);
|
||||||
|
$GLOBAL=$postdata;
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" /></head>
|
||||||
|
<title>Configuration</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="design/<?php echo $GLOBAL['skin']; ?>/style.css"/>
|
||||||
|
<link rel="shortcut icon" type="/image/png" href="design/<?php echo $GLOBAL['skin']; ?>/favicon2.png">
|
||||||
|
<!--[if IE]><script> document.createElement("article");document.createElement("aside");document.createElement("section");document.createElement("footer");</script> <![endif]-->
|
||||||
|
</head>
|
||||||
|
<body class="config">
|
||||||
|
<header><a href="index.php"><img src="design/<?php echo $GLOBAL['skin']; ?>/logo2.png"/></a>
|
||||||
|
<nav>
|
||||||
|
<h1>Configuration <?php echo $message;?></h1>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<aside>
|
||||||
|
<?php
|
||||||
|
render_form($GLOBAL);
|
||||||
|
?>
|
||||||
|
</aside>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 154 B |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 83 KiB |
|
|
@ -0,0 +1,95 @@
|
||||||
|
* { -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 3px green;}
|
||||||
|
|
||||||
|
a { color: black; text-decoration: none;}
|
||||||
|
.icon{font-family:arial, sans-serif;display:inline-block;border-radius: 2px;margin:1px;height:16px;width:16px;border:solid 1px;font-size:10px;line-height:16px;font-weight: bold; text-align:center;}
|
||||||
|
.private .icon{color:rgba(200,0,0,0.6);background-color:rgba(255,0,0,0.2);border-color:rgba(255,0,0,0.4);}
|
||||||
|
.public .icon{color:rgba(0,200,0,0.6);background-color:rgba(0,255,0,0.2);border-color:rgba(0,255,0,0.4);}
|
||||||
|
.private .icon:hover{color:rgba(200,0,0,1);background-color:rgba(255,0,0,0.5);border-color:rgba(255,0,0,0.8);text-shadow:none;box-shadow: 0 0 1px red}
|
||||||
|
.public .icon:hover{color:rgba(0,200,0,1);background-color:rgba(0,255,0,0.5);border-color:rgba(0,255,0,0.8);text-shadow:none;box-shadow: 0 0 1px green}
|
||||||
|
.public .icon.suppr:hover,.private .icon.suppr:hover{color:pink;background-color:rgba(255,0,0,0.9);border-color:rgba(255,0,0,1);}
|
||||||
|
input{font-family: times,serif;outline:none; font-size:16px;border-radius: 3px; 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]{border:1px solid green;cursor: pointer; color:lightgreen; text-shadow: 0 1px 1px darkgreen; display:inline-block;border-radius:3px;padding:2px;margin:1px;background:rgba(100,255,100,0.4);}
|
||||||
|
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 .zip{width:16px;height:16px; display:inline-block;background:url(zip.png) no-repeat;}
|
||||||
|
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 li .tag{font-size:10px;display:inline-block;padding:2px;border-radius:3px;}
|
||||||
|
nav .tag_public{display:inline-block;border-radius:3px;padding:2px;margin:1px;background:rgba(100,255,100,0.4);color:green;text-shadow:0 1px 1px darkgreen;}
|
||||||
|
aside .public li .tag{display:inline-block;border-radius:3px;padding:2px;margin:1px;background:rgba(100,255,100,0.4);color:green;}
|
||||||
|
nav .tag_public:hover{background:green;}
|
||||||
|
aside .public li .tag:hover{background:rgba(0,255,0,0.4);}
|
||||||
|
nav .tag_private{display:inline-block;border-radius:3px;padding:2px;margin:1px;background:rgba(255,100,100,0.4);color:pink;text-shadow:0 1px 1px darkred;}
|
||||||
|
aside .private li .tag{display:inline-block;border-radius:3px;padding:2px;margin:1px;background:rgba(255,100,100,0.4);color:darkred;}
|
||||||
|
aside .private li .tag:hover{background:rgba(255,0,0,0.5);}
|
||||||
|
nav .tag_private:hover{background:red;}
|
||||||
|
.tag_cloud{padding:2px;}
|
||||||
|
nav .tag_public{color:lightgreen;}
|
||||||
|
|
||||||
|
aside .public,.private{overflow-x:hidden;min-width:300px;text-align:left;vertical-align:top; margin-top:25px;padding:10px; border-radius:3px; border:1px solid;display:inline-block;}
|
||||||
|
aside .public{background:rgba(100,255,100,0.2);border-color:rgba(0,255,0,0.4);}
|
||||||
|
aside .private{background:rgba(255,100,100,0.2);border-color:rgba(255,0,0,0.3);}
|
||||||
|
aside .private a:hover{text-shadow:0 0 5px red;color:darkred;}
|
||||||
|
aside .private em{color:darkred;}
|
||||||
|
aside li em {font-size:10px ;}
|
||||||
|
aside .public li{background:rgba(100,255,100,0.2);}
|
||||||
|
aside .private li{background:rgba(255,100,100,0.2);}
|
||||||
|
li .infos{display:inline-block;padding:0;margin:0;}
|
||||||
|
li .tools{display:inline-block;padding:0;margin:0;vertical-align: middle;}
|
||||||
|
aside li img {vertical-align:middle;margin:1px;width:16px;height:16px;}
|
||||||
|
aside li a.toprivate,aside li a.topublic{margin-right:5px;opacity:0.5;}
|
||||||
|
aside li a.toprivate:hover,aside li a.topublic:hover{opacity:1;}
|
||||||
|
|
||||||
|
|
||||||
|
footer {
|
||||||
|
font-size:10px;text-align: right; color:lightgreen;text-shadow: 0 1px 1px black; position:fixed; line-height:15px;
|
||||||
|
bottom:0;left:0;right:0;height:auto;min-height:15px;padding-right : 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 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;}
|
||||||
|
|
||||||
|
body.config label{display:block;width:300px;margin:auto;}
|
||||||
|
body.config input{display:block;width:300px;margin-bottom:30px;margin:auto;}
|
||||||
|
body.config input[type=submit]{color:darkgreen;}
|
||||||
|
body.config select{display:block;width:300px;margin-bottom:30px;margin:auto;}
|
||||||
|
body.config h1{color:#5F0;}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 1014 B |
Binary file not shown.
|
After Width: | Height: | Size: 82 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 154 B |
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
|
|
@ -0,0 +1,126 @@
|
||||||
|
/* pinterest style */
|
||||||
|
|
||||||
|
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
|
||||||
|
body {
|
||||||
|
background:url(fond.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 3px green;}
|
||||||
|
|
||||||
|
a { color: black; text-decoration: none;}
|
||||||
|
.icon{font-family:arial, sans-serif;display:inline-block;border-radius: 2px;margin:1px;height:16px;width:16px;border:solid 1px;font-size:10px;line-height:16px;font-weight: bold; text-align:center;}
|
||||||
|
.private .icon{color:rgba(200,0,0,0.6);background-color:rgba(255,0,0,0.2);border-color:rgba(255,0,0,0.4);}
|
||||||
|
.public .icon{color:rgba(0,200,0,0.6);background-color:rgba(0,255,0,0.2);border-color:rgba(0,255,0,0.4);}
|
||||||
|
.private .icon:hover{color:rgba(200,0,0,1);background-color:rgba(255,0,0,0.5);border-color:rgba(255,0,0,0.8);text-shadow:none;box-shadow: 0 0 1px red}
|
||||||
|
.public .icon:hover{color:rgba(0,200,0,1);background-color:rgba(0,255,0,0.5);border-color:rgba(0,255,0,0.8);text-shadow:none;box-shadow: 0 0 1px green}
|
||||||
|
.public .icon.suppr:hover,.private .icon.suppr:hover{color:pink;background-color:rgba(255,0,0,0.9);border-color:rgba(255,0,0,1);}
|
||||||
|
input{font-family: times,serif;outline:none; font-size:16px;border-radius: 3px; 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]{border:1px solid green;cursor: pointer; color:lightgreen; text-shadow: 0 1px 1px darkgreen; display:inline-block;border-radius:3px;padding:2px;margin:1px;background-color:rgba(100,255,100,0.4);}
|
||||||
|
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; padding : 10px ; width: 100%; height:auto;margin: 0;
|
||||||
|
text-align: left;
|
||||||
|
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 .zip{width:16px;height:16px; display:inline-block;background:url(zip.png) no-repeat;}
|
||||||
|
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 li .tag{font-size:10px;display:inline-block;padding:2px;border-radius:3px;}
|
||||||
|
nav .tag_public{background:url(paper.png);display:inline-block;border-radius:3px;padding:2px;margin:1px;background-color:rgba(100,255,100,0.4);color:green;text-shadow:0 1px 1px darkgreen;}
|
||||||
|
aside .public li .tag{background:url(paper.png);display:inline-block;border-radius:3px;padding:2px;margin:1px;background-color:rgba(100,255,100,0.4);color:green;}
|
||||||
|
nav .tag_public:hover{background-color:green;}
|
||||||
|
aside .public li .tag:hover{background-color:rgba(0,255,0,0.4);}
|
||||||
|
nav .tag_private{background:url(paper.png);display:inline-block;border-radius:3px;padding:2px;margin:1px;background-color:rgba(255,100,100,0.4);color:pink;text-shadow:0 1px 1px darkred;}
|
||||||
|
aside .private li .tag{background:url(paper.png);display:inline-block;border-radius:3px;padding:2px;margin:1px;background-color:rgba(255,100,100,0.4);color:darkred;}
|
||||||
|
aside .private li .tag:hover{background-color:rgba(255,0,0,0.5);}
|
||||||
|
nav .tag_private:hover{background-color:red;}
|
||||||
|
.tag_cloud{padding:2px;}
|
||||||
|
nav .tag_public{color:lightgreen;background-color:rgba(0,255,0,0.5);}
|
||||||
|
|
||||||
|
aside .public,aside .private{
|
||||||
|
background:url(paper.png);
|
||||||
|
overflow-x:hidden;
|
||||||
|
min-width:300px;
|
||||||
|
text-align:left;
|
||||||
|
vertical-align:top;
|
||||||
|
margin-top:25px;padding:10px;
|
||||||
|
|
||||||
|
border:none;
|
||||||
|
display:inline-block;
|
||||||
|
text-align:center;
|
||||||
|
}
|
||||||
|
aside .public{}
|
||||||
|
aside .private{}
|
||||||
|
|
||||||
|
aside .private a:hover{text-shadow:0 0 5px red;color:darkred;}
|
||||||
|
aside .private em{color:darkred;}
|
||||||
|
aside li em {font-size:10px ;}
|
||||||
|
|
||||||
|
aside .public li,aside .private li{
|
||||||
|
display:inline-block;
|
||||||
|
width:200px;
|
||||||
|
overflow:hidden;
|
||||||
|
height: 200px;
|
||||||
|
border:1px solid;
|
||||||
|
}
|
||||||
|
aside .public li:hover{background-color:rgba(100,255,100,0.4);}
|
||||||
|
aside .private li:hover{background-color:rgba(255,100,100,0.4);}
|
||||||
|
aside li .suppr{display:block;padding:0;margin:0;opacity:0;}
|
||||||
|
aside li .title{display:block;font-size:18px;padding:0;margin:2px;height: 107px;text-align:left;overflow:hidden;}
|
||||||
|
aside li .infos{padding:0;margin:0;height:50px;display: table-cell;
|
||||||
|
vertical-align: bottom;}
|
||||||
|
aside li .tools{padding:0;margin:0;opacity:0;height:20px;text-align:left;}
|
||||||
|
aside li:hover .suppr ,aside li:hover .tools {opacity:1;height:16px;}
|
||||||
|
aside .public li{background-color:rgba(100,255,100,0.2);border-color:rgba(0,255,0,0.4);}
|
||||||
|
aside .private li{background-color:rgba(255,100,100,0.2);border-color:rgba(255,0,0,0.3);}
|
||||||
|
|
||||||
|
aside li img {vertical-align:bottom;margin:1px;width:16px;height:16px;}
|
||||||
|
aside li a.toprivate,aside li a.topublic{margin-right:5px;opacity:0.5;}
|
||||||
|
aside li a.toprivate:hover,aside li a.topublic:hover{opacity:1;}
|
||||||
|
|
||||||
|
|
||||||
|
footer {
|
||||||
|
font-size:10px;text-align: right; color:lightgreen;text-shadow: 0 1px 1px black; position:fixed; line-height:15px;
|
||||||
|
bottom:0;left:0;right:0;height:auto;min-height:15px;padding-right : 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 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;}
|
||||||
|
|
||||||
|
body *{transition:all 300ms}
|
||||||
|
body *:hover{transition:all 300ms}
|
||||||
|
|
||||||
|
body.config label{display:block;width:300px;margin:auto;}
|
||||||
|
body.config input{display:block;width:300px;margin-bottom:30px;margin:auto;}
|
||||||
|
body.config input[type=submit]{color:darkgreen;}
|
||||||
|
body.config select{display:block;width:300px;margin-bottom:30px;margin:auto;}
|
||||||
|
body.config h1{color:#5F0;}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 1014 B |
|
|
@ -0,0 +1,3 @@
|
||||||
|
zip : les noms de fichiers sont plus explicites
|
||||||
|
un bouton déconnect
|
||||||
|
retrait du bouton supprimer pour la page publique
|
||||||
Loading…
Reference in New Issue