Amélioration design formulaires (boutons collés)

This commit is contained in:
Marien Fressinaud
2013-03-16 16:08:19 +01:00
parent 49e1a798ba
commit dd628faade
4 changed files with 63 additions and 16 deletions

View File

@@ -10,6 +10,7 @@ class feedController extends ActionController {
} else {
if (Request::isPost ()) {
$url = Request::param ('url_rss');
$params = array ();
try {
$feed = new Feed ($url);
@@ -51,6 +52,7 @@ class feedController extends ActionController {
'content' => 'Le flux <em>' . $feed->url () . '</em> a bien été ajouté'
);
Session::_param ('notification', $notif);
$params['id'] = $feed->id ();
} catch (FileNotExistException $e) {
Log::record ($e->getMessage (), Log::ERROR);
// notif
@@ -68,7 +70,7 @@ class feedController extends ActionController {
Session::_param ('notification', $notif);
}
Request::forward (array (), true);
Request::forward (array ('c' => 'configure', 'a' => 'feed', 'params' => $params), true);
}
}
}

View File

@@ -1,6 +1,13 @@
<ul class="nav nav-list aside">
<li class="nav-header">Vos flux RSS</li>
<li class="nav-form"><form id="add_rss" method="post" action="<?php echo Url::display (array ('c' => 'feed', 'a' => 'add')); ?>">
<div class="stick">
<input type="url" name="url_rss" placeholder="Ajouter un flux RSS" />
<button class="btn" type="submit"><i class="icon add"></i></button>
</div>
</form></li>
<?php if (!empty ($this->feeds)) { ?>
<?php foreach ($this->feeds as $feed) { ?>
<li class="item<?php echo ($this->flux && $this->flux->id () == $feed->id ()) ? ' active' : ''; ?>">
@@ -8,11 +15,6 @@
</li>
<?php } ?>
<?php } else { ?>
<li class="disable">Aucun flux</li>
<li class="item disable">Aucun flux</li>
<?php } ?>
<li><form id="add_rss" method="post" action="<?php echo Url::display (array ('c' => 'feed', 'a' => 'add')); ?>">
<input type="url" name="url_rss" placeholder="Ajouter un flux RSS" />
<button class="btn"><i class="icon add"></i></button>
</form></li>
</ul>

View File

@@ -15,8 +15,11 @@
<div class="item search">
<form action="<?php echo _url ('index', 'index'); ?>" method="get">
<input type="text" name="search" id="search" placeholder="Rechercher (non fonctionnel)" />
<button class="btn"><i class="icon search"></i></button>
<div class="stick">
<?php $s = Request::param ('search', ''); ?>
<input type="text" name="search" id="search" value="<?php echo $s; ?>" placeholder="Rechercher (non fonctionnel)" />
<button class="btn" type="submit"><i class="icon search"></i></button>
</div>
</form>
</div>

View File

@@ -59,15 +59,21 @@ label {
input {
display: inline-block;
min-height: 25px;
padding: 5px 5px;
width: 200px;
padding: 5px;
background: #fdfdfd;
border: 1px solid #bbb;
border-radius: 3px;
color: #666;
line-height: 30px;
line-height: 25px;
vertical-align: middle;
box-shadow: 0 2px 2px #eee inset;
}
input[type="radio"],
input[type="checkbox"] {
width: 15px;
min-height: 15px;
}
input:focus {
color: #0062BE;
border-color: #33BBFF;
@@ -108,23 +114,41 @@ input {
font-size: 14px;
}
.stick {
white-space: nowrap;
font-size: 0px;
vertical-align: middle;
}
.stick input {
border-radius: 3px 0 0 3px;
border-right: none;
}
.stick .btn {
border-top: 1px solid #bbb;
border-radius: 0 3px 3px 0;
}
.btn {
display: inline-block;
min-height: 25px;
min-height: 37px;
min-width: 15px;
padding: 5px 10px;
background: #fff;
background: linear-gradient(#fff, #eee);
border-radius: 5px;
border-radius: 3px;
border: 1px solid #ddd;
border-bottom: 1px solid #aaa;
border-right: 1px solid #aaa;
color: #666;
text-shadow: 0px -1px 0 #ddd;
line-height: 25px;
line-height: 20px;
vertical-align: middle;
cursor: pointer;
}
a.btn {
min-height: 25px;
line-height: 25px;
}
.btn:hover {
background: #f0f0f0;
background: linear-gradient(#f8f8f8, #f0f0f0);
@@ -211,6 +235,11 @@ input {
text-shadow: 0 0 1px #ddd;
}
.nav.nav-list .nav-form {
padding: 3px;
text-align: center;
}
.nav-head {
display: block;
margin: 0;
@@ -248,9 +277,10 @@ input {
/* ICONES */
.icon {
display: inline-block;
width: 16px;
height: 16px;
width: 14px;
height: 14px;
vertical-align: middle;
line-height: 14px;
}
.icon.refresh {
background: url("icons/refresh.svg") center center no-repeat;
@@ -307,6 +337,13 @@ input {
.header .item.title a:hover {
text-decoration: none;
}
.header .item.search input {
width: 200px;
transition: all 200ms linear;
}
.header .item.search input:focus {
width: 300px;
}
.header .item.configure {
width: 100px;
}
@@ -326,6 +363,9 @@ input {
border-right: 1px solid #aaa;
background: #fff;
}
.aside .nav-form input {
width: 180px;
}
.aside.aside_flux {
padding: 10px 0;
}