Suppression code HTML inutile + amélioration CSS + restructuration du layout + correction bug mise à jour d'articles lorsqu'on visualise une catégorie

pull/136/head
Marien Fressinaud 12 years ago
parent c62ec2a144
commit 8c72acbacb
  1. 2
      app/layout/aside_configure.phtml
  2. 20
      app/layout/aside_feed.phtml
  3. 0
      app/layout/aside_flux.phtml
  4. 8
      app/layout/layout.phtml
  5. 2
      app/models/Entry.php
  6. 4
      app/views/configure/categorize.phtml
  7. 4
      app/views/configure/display.phtml
  8. 77
      app/views/configure/feed.phtml
  9. 4
      app/views/configure/importExport.phtml
  10. 4
      app/views/configure/shortcut.phtml
  11. 16
      app/views/helpers/pagination.phtml
  12. 4
      app/views/index/index.phtml
  13. 2
      app/views/javascript/main.phtml
  14. 372
      public/theme/base.css

@ -1,5 +1,5 @@
<div class="aside">
<ul id="menu">
<ul>
<li><h2>Configuration</h2></li>
<li <?php echo Request::actionName () == 'display' ? 'class="active"' : ''; ?>>
<a href="<?php echo Url::display (array ('c' => 'configure', 'a' => 'display')); ?>">Général et affichage</a>

@ -0,0 +1,20 @@
<div class="aside">
<ul>
<li><h2>Vox flux RSS</h2></li>
<?php if (!login_is_conf ($this->conf) || is_logged ()) { ?>
<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" />
<input type="submit" value="+" />
</form></li>
<?php } ?>
<?php if (!empty ($this->feeds)) { ?>
<?php foreach ($this->feeds as $feed) { ?>
<li <?php echo ($this->flux && $this->flux->id () == $feed->id ()) ? 'class="active"' : ''; ?>>
<a href="<?php echo Url::display (array ('c' => 'configure', 'a' => 'feed', 'params' => array ('id' => $feed->id ()))); ?>"><?php echo $feed->name (); ?></a>
</li>
<?php } ?>
<?php } else { ?>
<li class="disable"><span>Aucun flux</span></li>
<?php } ?>
</ul>
</div>

@ -11,13 +11,7 @@
<?php $this->partial ('header'); ?>
<div id="global">
<?php if (Request::controllerName () != 'configure') { ?>
<?php $this->partial ('aside'); ?>
<?php } ?>
<div id="main">
<?php $this->render (); ?>
</div>
<?php $this->render (); ?>
</div>
<?php $this->partial ('persona'); ?>

@ -297,7 +297,7 @@ class EntryDAO extends Model_pdo {
$deb = ($this->currentPage - 1) * $this->nbItemsPerPage;
$fin = $this->nbItemsPerPage;
$sql = 'SELECT * FROM entry e INNER JOIN feed f ON e.id_feed = f.id' . $where
$sql = 'SELECT e.* FROM entry e INNER JOIN feed f ON e.id_feed = f.id' . $where
. ' ORDER BY date' . $order
. ' LIMIT ' . $deb . ', ' . $fin;

@ -1,6 +1,6 @@
<div class="table">
<?php $this->partial ('configure_aside'); ?>
<?php $this->partial ('aside_configure'); ?>
<div class="table">
<form method="post" action="">
<h1>Gérer les catégories</h1>

@ -1,6 +1,6 @@
<div class="table">
<?php $this->partial ('configure_aside'); ?>
<?php $this->partial ('aside_configure'); ?>
<div class="table">
<form method="post" action="">
<h1>Configuration générale</h1>

@ -1,54 +1,31 @@
<div class="table">
<?php /* $this->partial ('configure_aside'); */ ?>
<?php $this->partial ('aside_feed'); ?>
<div class="aside">
<ul>
<li><h2>Vox flux RSS</h2></li>
<?php if (!login_is_conf ($this->conf) || is_logged ()) { ?>
<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" />
<input type="submit" value="+" />
</form></li>
<?php } ?>
<?php if (!empty ($this->feeds)) { ?>
<?php foreach ($this->feeds as $feed) { ?>
<li <?php echo ($this->flux && $this->flux->id () == $feed->id ()) ? 'class="active"' : ''; ?>>
<a href="<?php echo Url::display (array ('c' => 'configure', 'a' => 'feed', 'params' => array ('id' => $feed->id ()))); ?>"><?php echo $feed->name (); ?></a>
</li>
<?php } ?>
<?php } else { ?>
<li class="disable"><span>Aucun flux</span></li>
<?php } ?>
</ul>
</div>
<?php if ($this->flux) { ?>
<form method="post" action="">
<h1><?php echo $this->flux->name (); ?></h1>
<?php echo $this->flux->description (); ?>
<label>URL du site</label>
<span><a target="_blank" href="<?php echo $this->flux->website (); ?>"><?php echo $this->flux->website (); ?></a></span>
<label>Nombre d'articles</label>
<span><?php echo $this->flux->nbEntries (); ?></span>
<?php if ($this->flux) { ?>
<form method="post" action="">
<h1><?php echo $this->flux->name (); ?></h1>
<?php echo $this->flux->description (); ?>
<label>URL du site</label>
<span><a target="_blank" href="<?php echo $this->flux->website (); ?>"><?php echo $this->flux->website (); ?></a></span>
<label>Nombre d'articles</label>
<span><?php echo $this->flux->nbEntries (); ?></span>
<?php if (!empty ($this->categories)) { ?>
<label>Ranger dans une catégorie</label>
<div class="radio_group">
<?php foreach ($this->categories as $cat) { ?>
<input type="radio" name="category" id="cat_<?php echo $cat->id (); ?>" value="<?php echo $cat->id (); ?>"<?php echo $cat->id () == $this->flux->category () ? ' checked="checked"' : ''; ?> />
<label for="cat_<?php echo $cat->id (); ?>"><?php echo $cat->name (); ?></label>
<br />
<?php } ?>
</div>
<input type="submit" value="Valider" />
<?php if (!empty ($this->categories)) { ?>
<label>Ranger dans une catégorie</label>
<div class="radio_group">
<?php foreach ($this->categories as $cat) { ?>
<input type="radio" name="category" id="cat_<?php echo $cat->id (); ?>" value="<?php echo $cat->id (); ?>"<?php echo $cat->id () == $this->flux->category () ? ' checked="checked"' : ''; ?> />
<label for="cat_<?php echo $cat->id (); ?>"><?php echo $cat->name (); ?></label>
<br />
<?php } ?>
<button formaction="<?php echo Url::display (array ('c' => 'feed', 'a' => 'delete', 'params' => array ('id' => $this->flux->id ()))); ?>">Supprimer</button>
</form>
<?php } else { ?>
<div class="nothing">Aucun flux sélectionné</div>
</div>
<input type="submit" value="Valider" />
<?php } ?>
</div>
<button formaction="<?php echo Url::display (array ('c' => 'feed', 'a' => 'delete', 'params' => array ('id' => $this->flux->id ()))); ?>">Supprimer</button>
</form>
<?php } else { ?>
<div class="nothing">Aucun flux sélectionné</div>
<?php } ?>

@ -11,9 +11,9 @@
</body>
</opml>
<?php } else { ?>
<div class="table">
<?php $this->partial ('configure_aside'); ?>
<?php $this->partial ('aside_configure'); ?>
<div>
<form method="post" action="<?php echo Url::display (array ('c' => 'configure', 'a' => 'importExport', 'params' => array ('q' => 'import'))); ?>" enctype="multipart/form-data">
<h1>Exporter au format OPML</h1>
<button formaction="<?php echo Url::display (array ('c' => 'configure', 'a' => 'importExport', 'params' => array ('q' => 'export'))); ?>">Exporter</button>

@ -1,6 +1,6 @@
<div class="table">
<?php $this->partial ('configure_aside'); ?>
<?php $this->partial ('aside_configure'); ?>
<div>
<datalist id="keys">
<?php foreach ($this->list_keys as $key) { ?>
<option value="<?php echo $key; ?>">

@ -5,10 +5,10 @@
?>
<ul class="pagination">
<li class="item pager-next">
<?php if ($this->currentPage < $this->nbPage) { ?>
<?php $params[$getteur] = $this->currentPage + 1; ?>
<a href="<?php echo Url::display (array ('c' => $c, 'a' => $a, 'params' => $params)); ?>">Anciens</a>
<li class="item pager-previous">
<?php if ($this->currentPage > 1) { ?>
<?php $params[$getteur] = $this->currentPage - 1; ?>
<a href="<?php echo Url::display (array ('c' => $c, 'a' => $a, 'params' => $params)); ?>">plus récents</a>
<?php } else { ?>
&nbsp;
<?php } ?>
@ -16,10 +16,10 @@
<li class="item pager-current">page <?php echo $this->currentPage; ?> / <?php echo $this->nbPage; ?></li>
<li class="item pager-previous">
<?php if ($this->currentPage > 1) { ?>
<?php $params[$getteur] = $this->currentPage - 1; ?>
<a href="<?php echo Url::display (array ('c' => $c, 'a' => $a, 'params' => $params)); ?>">Récents ›</a>
<li class="item pager-next">
<?php if ($this->currentPage < $this->nbPage) { ?>
<?php $params[$getteur] = $this->currentPage + 1; ?>
<a href="<?php echo Url::display (array ('c' => $c, 'a' => $a, 'params' => $params)); ?>">plus anciens ›</a>
<?php } else { ?>
&nbsp;
<?php } ?>

@ -1,5 +1,7 @@
<?php $this->partial ('aside_flux'); ?>
<?php $items = $this->entryPaginator->items (true); ?>
<div id="top">
<div class="nav_menu">
<a class="btn" href="<?php echo Url::display (array ('c' => 'feed', 'a' => 'actualize')); ?>"><i class="icon refresh"></i></a>
<?php if (!login_is_conf ($this->conf) || is_logged ()) { ?>

@ -104,7 +104,7 @@ function mark_favorite (active) {
}
function init_img () {
var imgs = $(".post.flux .content img").each (function () {
$(".post.flux .content img").each (function () {
if ($(this).width () > ($("#stream").width()) / 2) {
$(this).addClass("big");
}

@ -109,37 +109,39 @@ img {
}
/* STRUCTURE */
#global {
.header {
display: table;
width: 100%;
height: 100%;
background: #fafafa;
background: #f4f4f4;
table-layout: fixed;
}
.header {
display: table;
width: 100%;
background: #f4f4f4;
table-layout: fixed;
.header .item {
display: table-cell;
padding: 10px 0;
border-bottom: 1px solid #aaa;
vertical-align: middle;
text-align: center;
}
.header .item {
display: table-cell;
padding: 10px 0;
border-bottom: 1px solid #aaa;
vertical-align: middle;
text-align: center;
.header .item.title {
width: 250px;
}
.header .item.title {
width: 250px;
.header .item.title h1 {
padding: 0;
}
.header .item.title h1 {
padding: 0;
}
.header .item.title a:hover {
text-decoration: none;
}
.header .item.configure {
width: 100px;
.header .item.title a:hover {
text-decoration: none;
}
.header .item.configure {
width: 100px;
}
#global {
display: table;
width: 100%;
height: 100%;
background: #fafafa;
table-layout: fixed;
}
.aside {
display: table-cell;
height: 100%;
@ -149,36 +151,16 @@ img {
border-right: 1px solid #aaa;
background: #fff;
}
#main {
display: table-cell;
height: 100%;
line-height: 180%;
.nav_menu {
width: 100%;
background: #fafafa;
vertical-align: top;
border-bottom: 1px solid #aaa;
text-align: center;
padding: 5px 0;
}
#top {
width: 100%;
background: #fafafa;
border-bottom: 1px solid #aaa;
text-align: center;
padding: 5px 0;
}
#top .btn {
margin: 0 10px;
}
#main .table {
display: table;
width: 100%;
height: 100%;
table-layout: fixed;
}
#main .nothing {
display: table-cell;
width: 100%;
height: 100%;
vertical-align: middle;
text-align: center;
.nav_menu .btn {
margin: 0 5px;
}
.categories {
@ -223,169 +205,173 @@ img {
text-shadow: 0 0 1px #aaa;
}
.post {
.post.flux {
font-family: Palatino, "Times New Roman", serif;
border-left: 10px solid #aaa;
background: #fafafa;
}
.post.flux {
font-family: Palatino, "Times New Roman", serif;
border-left: 10px solid #aaa;
background: #fafafa;
.post.flux:hover {
background: #fff;
}
.post.flux:hover {
background: #fff;
.post.flux .content {
padding: 20px 100px;
line-height: 170%;
}
.post.flux .content h1, .post.flux .content h2, .post.flux .content h3 {
margin: 20px 0 5px;
}
.post.flux .content {
padding: 20px 100px;
line-height: 170%;
.post.flux .content p {
margin: 10px 0;
}
.post.flux .content h1, .post.flux .content h2, .post.flux .content h3 {
margin: 20px 0 5px;
}
.post.flux .content p {
margin: 10px 0;
}
.post.flux .content img.big {
display: block;
margin: 10px 0;
width: 100%;
box-shadow: 0 0 5px #000;
border-radius: 5px;
}
.post.flux .content pre {
width: 90%;
margin: 10px auto;
padding: 10px;
overflow: auto;
background: #666;
border: 1px solid #000;
color: #fafafa;
border-radius: 5px;
}
.post.flux .content q, .post.flux .content blockquote {
display: block;
margin: 0;
padding: 10px 20px;
font-style: italic;
border-left: 4px solid #ccc;
color: #666;
}
.post.flux.active {
border-left: 10px solid #0062BE;
background: #fff;
.post.flux .content img.big {
display: block;
margin: 10px 0;
width: 100%;
box-shadow: 0 0 5px #000;
border-radius: 5px;
}
.post.flux.not_read {
border-left: 10px solid #FF5300;
background: #FFF3ED;
.post.flux .content pre {
width: 90%;
margin: 10px auto;
padding: 10px;
overflow: auto;
background: #666;
border: 1px solid #000;
color: #fafafa;
border-radius: 5px;
}
.post.flux.favorite {
border-left: 10px solid #FFC300;
background: #FFF6DA;
.post.flux .content q, .post.flux .content blockquote {
display: block;
margin: 0;
padding: 10px 20px;
font-style: italic;
border-left: 4px solid #ccc;
color: #666;
}
.flux_header {
display: table;
table-layout: fixed;
margin: 0;
padding: 0;
width: 100%;
height: 25px;
font-size: 12px;
line-height: 25px;
border-top: 1px solid #ddd;
}
.flux_header .item {
display: table-cell;
vertical-align: middle;
.post.flux.active {
border-left: 10px solid #0062BE;
background: #fff;
}
.post.flux.not_read {
border-left: 10px solid #FF5300;
background: #FFF3ED;
}
.post.flux.favorite {
border-left: 10px solid #FFC300;
background: #FFF6DA;
}
.flux_header .item.manage {
width: 50px;
.flux_header {
display: table;
table-layout: fixed;
margin: 0;
padding: 0;
width: 100%;
height: 25px;
font-size: 12px;
line-height: 25px;
border-top: 1px solid #ddd;
}
.flux_header .item {
display: table-cell;
vertical-align: middle;
}
.flux_header .item.manage .read {
display: inline-block;
width: 25px;
height: 25px;
background: url("icons/read.svg") center center no-repeat;
vertical-align: middle;
.flux_header .item.manage {
width: 50px;
}
.flux_header .item.manage .read:hover {
text-decoration: none;
.flux_header .item.manage .read {
display: inline-block;
width: 25px;
height: 25px;
background: url("icons/read.svg") center center no-repeat;
vertical-align: middle;
}
.post.flux.not_read .flux_header .item.manage .read {
background: url("icons/unread.svg") center center no-repeat;
.flux_header .item.manage .read:hover {
text-decoration: none;
}
.post.flux.not_read .flux_header .item.manage .read {
background: url("icons/unread.svg") center center no-repeat;
}
.flux_header .item.manage .bookmark {
display: inline-block;
width: 25px;
height: 25px;
background: url("icons/non-starred.svg") center center no-repeat;
vertical-align: middle;
}
.flux_header .item.manage .bookmark {
display: inline-block;
width: 25px;
height: 25px;
background: url("icons/non-starred.svg") center center no-repeat;
vertical-align: middle;
.flux_header .item.manage .bookmark:hover {
text-decoration: none;
}
.post.flux.favorite .flux_header .item.manage .bookmark {
background: url("icons/starred.svg") center center no-repeat;
}
.flux_header .item.website {
width: 200px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.flux_header .item.manage .bookmark:hover {
text-decoration: none;
}
.post.flux.favorite .flux_header .item.manage .bookmark {
background: url("icons/starred.svg") center center no-repeat;
}
.flux_header .item.website {
width: 200px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.flux_header .item.title {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.flux_header .item.title h1 {
font-size: 12px;
padding: 0;
font-weight: normal;
.flux_header .item.title {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.post.flux.not_read .flux_header .item.title h1 {
font-weight: bold;
.flux_header .item.title h1 {
font-size: 12px;
padding: 0;
font-weight: normal;
}
.flux_header .item.date {
width: 200px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: right;
font-size: 10px;
color: #666;
}
.flux_header .item.link {
width: 35px;
text-align: center;
}
.flux_header .item.link a {
display: inline-block;
width: 25px;
height: 25px;
background: url("website.svg") center center no-repeat;
vertical-align: middle;
.post.flux.not_read .flux_header .item.title h1 {
font-weight: bold;
}
.flux_header .item.date {
width: 200px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: right;
font-size: 10px;
color: #666;
}
.flux_header .item.link {
width: 35px;
text-align: center;
}
.flux_header .item.link a:hover {
text-decoration: none;
.flux_header .item.link a {
display: inline-block;
width: 25px;
height: 25px;
background: url("icons/website.svg") center center no-repeat;
vertical-align: middle;
}
.flux_header .item.link a:hover {
text-decoration: none;
}
/*** PAGINATION ***/
.pagination {
display: block;
display: table;
width: 100%;
margin: 0;
background: #fafafa;
text-align: center;
color: #333;
font-size: 80%;
line-height: 200%;
border-top: 1px solid #aaa;
table-layout: fixed;
}
.pagination .item {
display: inline-block;
display: table-cell;
padding: 5px 10px;
border-top: 1px solid #aaa;
}
.pagination .item a {
color: #333;
font-style: italic;
}
.pagination .pager-previous, .pagination .pager-next {
width: 200px;
}
.pagination .item.pager-current {
font-weight: bold;
}
@ -426,24 +412,8 @@ img {
}
@media(max-width: 840px) {
#global {
table-layout: fixed;
}
.header,
.aside {
display: none;
}
#main {
width: 100%;
padding: 0;
}
#top {
width: 100%;
position: static;
}
#stream {
padding: 0;
}
.aside,
.flux_header .item.website span,
.flux_header .item.date {
display: none;
@ -454,12 +424,12 @@ img {
.post.flux .content {
padding: 10px;
}
a#read_mode {
display: none;
.pagination .pager-previous, .pagination .pager-next {
width: 100px;
}
}
@media(max-width: 450px) {
#top {
.nav_menu {
display: none;
}
}

Loading…
Cancel
Save