diff options
author | Bernhard Posselt <dev@bernhard-posselt.com> | 2014-09-10 18:39:30 +0200 |
---|---|---|
committer | Bernhard Posselt <dev@bernhard-posselt.com> | 2014-09-10 18:39:30 +0200 |
commit | d8a83b85292a5309576afd1c0325f6103a7d2502 (patch) | |
tree | 8e828b06b1e44e703302d89fe53c1008fa495880 | |
parent | 36bacfcc0f53799ba07391bdb44004e9020a2f20 (diff) |
stylez em hard
-rw-r--r-- | css/content.css | 27 | ||||
-rw-r--r-- | templates/part.content.php | 9 |
2 files changed, 28 insertions, 8 deletions
diff --git a/css/content.css b/css/content.css index 8fbd55309..1f21aef12 100644 --- a/css/content.css +++ b/css/content.css @@ -51,6 +51,7 @@ */ #app-content .item { cursor: default; + border-bottom: 1px solid #eee; } #app-content .item:last-child .article { @@ -62,10 +63,14 @@ */ #app-content .utils { width: 100%; - border-bottom: 1px solid #eee; line-height: 52px; box-sizing: border-box; padding: 0 45px; + cursor: pointer; +} + +#app-content .expanded .utils { + padding-top: 45px; } #app-content .utils ul { @@ -158,14 +163,19 @@ } + + /** * Actual content */ #app-content .article { + display: none; min-height: 69px; padding: 10px 45px 45px 45px; - border-bottom: 1px solid #eee; - background-image: -moz-linear-gradient(center top , #F8F8F8 0px, #FFF 69px); +} + +#app-content .expanded .article { + display: block; } /** @@ -178,9 +188,18 @@ padding-bottom: 25px; } +#app-content .subtitle a { + color: #aaa; +} + +#app-content .subtitle a:hover { + text-decoration: underline; +} + #app-content .date { + color: #aaa; + white-space: nowrap; float: right; - display: inline-block; } /** diff --git a/templates/part.content.php b/templates/part.content.php index 459ffb88e..34269dc1d 100644 --- a/templates/part.content.php +++ b/templates/part.content.php @@ -7,7 +7,7 @@ <li class="item {{ Content.getFeed(item.feedId).cssClass }}" ng-repeat="item in Content.getItems() | orderBy:[Content.orderBy()] track by item.id" ng-click="Content.markRead(item.id)" - ng-class="{read: !item.unread}" + ng-class="{read: !item.unread, expanded: !Content.isCompactView() || item.show}" data-id="{{ item.id }}"> <div class="utils" ng-click="Content.toggleItem(item)"> @@ -38,11 +38,12 @@ </ul> </div> - <div class="article" ng-show="!Content.isCompactView() || item.show"> + <div class="article"> <div class="subtitle"> - <span class="author" ng-show="item.author"><?php p($l->t('By')) ?> {{ item.author }}</span> - <time class="date" title="{{ item.pubDate*1000|date:'yyyy-MM-dd HH:mm:ss' }}" + <span class="author" ng-show="item.author"><?php p($l->t('by')) ?> {{ item.author }}</span> + <?php p($l->t('from')) ?> <a ng-href="#/items/feeds/{{ item.feedId }}">{{ Content.getFeed(item.feedId).title }}</a> + <time class="date" class="date" title="{{ item.pubDate*1000|date:'yyyy-MM-dd HH:mm:ss' }}" datetime="{{ item.pubDate*1000|date:'yyyy-MM-ddTHH:mm:ssZ' }}"> {{ Content.getRelativeDate(item.pubDate) }} </time> |