From f53c01dcd49e2a1e974efb7b91bfe50981640b11 Mon Sep 17 00:00:00 2001 From: Marien Fressinaud Date: Thu, 14 Mar 2013 16:49:14 +0100 Subject: Bien meilleure gestion des formulaires --- app/views/configure/categorize.phtml | 37 +++++++---- app/views/configure/display.phtml | 114 ++++++++++++++++++++------------- app/views/configure/feed.phtml | 60 +++++++++++------ app/views/configure/importExport.phtml | 24 ++++--- app/views/configure/shortcut.phtml | 97 ++++++++++++++++++---------- app/views/index/index.phtml | 2 +- app/views/javascript/main.phtml | 40 ++++++------ public/data/Configuration.array.php | 9 +++ public/theme/base.css | 97 ++++++++++++++++++++++++---- 9 files changed, 327 insertions(+), 153 deletions(-) diff --git a/app/views/configure/categorize.phtml b/app/views/configure/categorize.phtml index 567859ea5..5d649a93a 100644 --- a/app/views/configure/categorize.phtml +++ b/app/views/configure/categorize.phtml @@ -1,18 +1,31 @@ partial ('aside_configure'); ?> -
-
-

Gérer les catégories

- +
+ + Gestion des catégories + categories as $cat) { $i++; ?> - - - +
+ +
+ + +
+
- - - - - + +
+ +
+ +
+
+ +
+
+ + +
+
diff --git a/app/views/configure/display.phtml b/app/views/configure/display.phtml index d90f48240..bf488dbe0 100644 --- a/app/views/configure/display.phtml +++ b/app/views/configure/display.phtml @@ -1,53 +1,77 @@ partial ('aside_configure'); ?> -
-
-

Configuration générale

- - - - - -

+
+ + Configuration générale + +
+ +
+ mois +
+
+ +
+ conf->mailLogin (); ?> - -
- -

Configuration de l'affichage

- - - - - -
- - +
+ + +
- - - - -
- - + Configuration de l'affichage + +
+ +
+ +
+
+ +
+ +
+ + +
+
+ +
+ +
+ +
+
+ +
+ +
+ + +
+
+ +
+
+ + +
- -
diff --git a/app/views/configure/feed.phtml b/app/views/configure/feed.phtml index dc1d7ff96..11a194071 100644 --- a/app/views/configure/feed.phtml +++ b/app/views/configure/feed.phtml @@ -1,32 +1,52 @@ partial ('aside_feed'); ?> flux) { ?> -
+

flux->name (); ?>

flux->description (); ?> + + + Informations + +
+ +
+ flux->website (); ?> +
+
- - flux->website (); ?> +
+ +
+ flux->nbEntries (); ?> +
+
- - flux->nbEntries (); ?> + categories)) { ?> +
+ +
+ categories as $cat) { ?> + + +
+
- categories)) { ?> - -
- categories as $cat) { ?> - +
+
+ + +
+
-
- - - - - - + +
+
+ +
Aucun flux sélectionné. Pensez à en ajouter !
diff --git a/app/views/configure/importExport.phtml b/app/views/configure/importExport.phtml index d7a84df78..e660274d6 100644 --- a/app/views/configure/importExport.phtml +++ b/app/views/configure/importExport.phtml @@ -13,15 +13,23 @@ partial ('aside_configure'); ?> -
+
-

Exporter au format OPML

- - -

Importer au format OPML

- - - + Import / export au format OPML +
+ +
+ +
+
+ +
+
+ + ou + +
+
diff --git a/app/views/configure/shortcut.phtml b/app/views/configure/shortcut.phtml index dd29b5f99..efc637141 100644 --- a/app/views/configure/shortcut.phtml +++ b/app/views/configure/shortcut.phtml @@ -1,6 +1,6 @@ partial ('aside_configure'); ?> -
+
list_keys as $key) { ?>
diff --git a/app/views/index/index.phtml b/app/views/index/index.phtml index 995e6738a..bccb6588b 100644 --- a/app/views/index/index.phtml +++ b/app/views/index/index.phtml @@ -17,7 +17,7 @@
-
+
  • conf) || is_logged ()) { ?> diff --git a/app/views/javascript/main.phtml b/app/views/javascript/main.phtml index 87af760d3..8eb7caf2a 100644 --- a/app/views/javascript/main.phtml +++ b/app/views/javascript/main.phtml @@ -104,7 +104,7 @@ function mark_favorite (active) { } function init_img () { - $(".post.flux .content img").each (function () { + $(".flux .content img").each (function () { if ($(this).width () > ($("#stream").width()) / 2) { $(this).addClass("big"); } @@ -115,11 +115,11 @@ function init_posts () { init_img (); if (hide_posts) { - $(".post.flux:not(.active) .content").slideUp (); + $(".flux:not(.active) .content").slideUp (); } - $(".post.flux").click (function () { - old_active = $(".post.flux.active"); + $(".flux").click (function () { + old_active = $(".flux.active"); new_active = $(this); if (old_active[0] != new_active[0]) { @@ -127,21 +127,21 @@ function init_posts () { } }); - $(".post.flux a.read").click (function () { - active = $(this).parents (".post.flux"); + $(".flux a.read").click (function () { + active = $(this).parents (".flux"); mark_read (active); return false; }); - $(".post.flux a.bookmark").click (function () { - active = $(this).parents (".post.flux"); + $(".flux a.bookmark").click (function () { + active = $(this).parents (".flux"); mark_favorite (active); return false; }); - $(".post.flux .content a").click (function () { + $(".flux .content a").click (function () { $(this).attr ('target', '_blank'); }); } @@ -152,7 +152,7 @@ $(document).ready (function () { // Touches de manipulation shortcut.add("", function () { // on marque comme lu ou non lu - active = $(".post.flux.active"); + active = $(".flux.active"); mark_read (active); }); shortcut.add("shift+", function () { @@ -162,14 +162,14 @@ $(document).ready (function () { }); shortcut.add("", function () { // on marque comme favori ou non favori - active = $(".post.flux.active"); + active = $(".flux.active"); mark_favorite (active); }); // Touches de navigation shortcut.add("", function () { - old_active = $(".post.flux.active"); - last_active = $(".post.flux:last"); + old_active = $(".flux.active"); + last_active = $(".flux:last"); new_active = old_active.prev (); if (new_active[0] instanceof HTMLDivElement) { @@ -179,16 +179,16 @@ $(document).ready (function () { } }); shortcut.add("shift+", function () { - old_active = $(".post.flux.active"); - first = $(".post.flux:first"); + old_active = $(".flux.active"); + first = $(".flux:first"); if (first[0] instanceof HTMLDivElement) { slide (first, old_active); } }); shortcut.add("", function () { - old_active = $(".post.flux.active"); - first_active = $(".post.flux:first"); + old_active = $(".flux.active"); + first_active = $(".flux:first"); new_active = old_active.next (); if (new_active[0] instanceof HTMLDivElement) { @@ -198,8 +198,8 @@ $(document).ready (function () { } }); shortcut.add("shift+", function () { - old_active = $(".post.flux.active"); - last = $(".post.flux:last"); + old_active = $(".flux.active"); + last = $(".flux:last"); if (last[0] instanceof HTMLDivElement) { slide (last, old_active); @@ -222,7 +222,7 @@ $(document).ready (function () { redirect (url, false); }); shortcut.add("", function () { - url = $(".post.flux.active .link a").attr ("href"); + url = $(".flux.active .link a").attr ("href"); redirect (url, true); }); diff --git a/public/data/Configuration.array.php b/public/data/Configuration.array.php index d00f08233..af7d4e48f 100644 --- a/public/data/Configuration.array.php +++ b/public/data/Configuration.array.php @@ -6,4 +6,13 @@ return array ( 'sort_order' => 'low_to_high', 'old_entries' => 3, 'mail_login' => '', + 'shortcuts' => array ( + 'mark_read' => 'r', + 'mark_favorite' => 'f', + 'go_website' => 'space', + 'next_entry' => 'page_down', + 'prev_entry' => 'page_up', + 'next_page' => 'right', + 'prev_page' => 'left', + ), ); diff --git a/public/theme/base.css b/public/theme/base.css index 64a5b83a2..1a709af83 100644 --- a/public/theme/base.css +++ b/public/theme/base.css @@ -26,7 +26,7 @@ ul, ol { /* TITRES */ h1, h2, h3 { min-height: 40px; - padding: 10px 0 0; + margin: 15px 0 5px; line-height: 40px; } @@ -40,19 +40,30 @@ img { } /* FORMULAIRES */ +legend { + display: block; + margin: 20px 0 5px; + padding: 5px 0; + border-bottom: 1px solid #ddd; + font-size: 150%; + clear: both; +} label { display: block; - margin: 5px 0; + min-height: 25px; + padding: 5px 0; + font-size: 14px; + line-height: 25px; } input { display: inline-block; min-height: 25px; padding: 5px 5px; - background: #fff; + background: #fdfdfd; border: 1px solid #bbb; border-radius: 3px; - color: #aaa; - line-height: 25px; + color: #666; + line-height: 30px; vertical-align: middle; box-shadow: 0 2px 2px #eee inset; } @@ -62,6 +73,41 @@ input { box-shadow: 0 2px 2px #DDDDFF inset; } +.form-group { + margin: 0; + clear: both; +} + .form-group.form-actions { + min-width: 250px; + padding: 5px 0; + background: #f4f4f4; + border-top: 1px solid #ddd; + } + .form-group.form-actions .btn { + margin: 0 10px; + } + .form-group .group-name { + display: block; + float: left; + width: 200px; + padding: 10px 0; + text-align: right; + } + .form-group .group-controls { + min-width: 250px; + min-height: 25px; + margin: 0 0 0 220px; + padding: 5px 0; + line-heigt: 25px; + } + .form-group .group-controls .control { + display: block; + min-height: 30px; + padding: 5px 0; + line-height: 25px; + font-size: 14px; + } + .btn { display: inline-block; min-height: 25px; @@ -74,14 +120,14 @@ input { border-bottom: 1px solid #aaa; border-right: 1px solid #aaa; color: #666; - text-shadow: 0px 1px 1px #ddd; + text-shadow: 0px -1px 0 #ddd; line-height: 25px; vertical-align: middle; cursor: pointer; } .btn:hover { - background: #f4f4f4; - background: linear-gradient(#fafafa, #f0f0f0); + background: #f0f0f0; + background: linear-gradient(#f8f8f8, #f0f0f0); text-decoration: none; } .btn.active, @@ -95,7 +141,7 @@ input { background: linear-gradient(#0084CC, #0045CC); color: #fff; border: 1px solid #0062B7; - text-shadow: 0px 1px 1px #aaa; + text-shadow: 0px -1px 0 #aaa; } .btn.btn-important:hover { background: linear-gradient(#0066CC, #0045CC); @@ -105,6 +151,21 @@ input { box-shadow: none; } + .btn.btn-attention { + background: #E95B57; + background: linear-gradient(#E95B57, #BD362F); + color: #fff; + border: 1px solid #C44742; + text-shadow: 0px -1px 0px #666; + } + .btn.btn-attention:hover { + background: linear-gradient(#D14641, #BD362F); + } + .btn.btn-attention:active { + background: #BD362F; + box-shadow: none; + } + /* NAVIGATION */ .nav.nav-list .nav-header, .nav.nav-list .item { @@ -239,7 +300,7 @@ input { width: 250px; } .header .item.title h1 { - padding: 0; + margin: 0; } .header .item.title a:hover { text-decoration: none; @@ -319,10 +380,17 @@ input { border-right: 1px solid #999; border-bottom: 1px solid #999; border-radius: 5px; - box-shadow: 0 3px 3px #999 inset; + box-shadow: 1px 3px 3px #999 inset; text-shadow: 0 0 1px #aaa; } +.post { + padding: 10px 50px; +} + .post form { + margin: 10px 0; + } + .flux { font-family: Palatino, "Times New Roman", serif; border-left: 10px solid #aaa; @@ -436,7 +504,7 @@ input { } .flux_header .item.title h1 { font-size: 12px; - padding: 0; + margin: 0; font-weight: normal; } .flux.not_read .flux_header .item.title h1 { @@ -547,7 +615,8 @@ input { } } @media(max-width: 450px) { - .nav_menu { - display: none; + .nav_menu .btn { + display: block; + margin: 5px 0; } } -- cgit v1.2.3