mirror of
https://github.com/Athou/commafeed.git
synced 2026-03-21 21:37:29 +00:00
initial mobile design (#54)
This commit is contained in:
Athou
@@ -1,4 +1,5 @@
|
||||
<div ng-controller="SubscribeCtrl">
|
||||
|
||||
<div class="btn-group">
|
||||
<button class="btn" ng-click="open()"><span class="icon-rss"></span> ${tree.subscribe}</button>
|
||||
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||
@@ -9,6 +10,13 @@
|
||||
<li><a ng-click="openCategory()"><i class="icon-plus"></i> ${tree.new_category}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn hidden-desktop" ng-click="MobileService.toggleLeftMenu()">
|
||||
<i class="icon-remove"></i> ${global.close}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div modal="isOpen" close="close()" options="opts">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" ng-click="close()">×</button>
|
||||
|
||||
@@ -1,60 +1,76 @@
|
||||
<div ng-controller="ToolbarCtrl">
|
||||
<div class="form-horizontal">
|
||||
<span>
|
||||
<div class="btn-group read-mode" data-toggle="buttons-radio">
|
||||
<button type="button" class="btn" ng-model="settingsService.settings.readingMode" btn-radio="'unread'">${toolbar.unread}</button>
|
||||
<button type="button" class="btn" ng-model="settingsService.settings.readingMode" btn-radio="'all'">${toolbar.all}</button>
|
||||
<div class="btn-group hidden-desktop">
|
||||
<button type="button" class="btn" ng-click="MobileService.toggleLeftMenu()">
|
||||
<i class="icon-list-alt"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<a type="button" class="btn" ng-click="previousEntry()" title="${toolbar.previous_entry}"><i class="icon-chevron-up"></i></a>
|
||||
<a type="button" class="btn" ng-click="nextEntry()" title="${toolbar.next_entry}"><i class="icon-chevron-down"></i></a>
|
||||
<a type="button" class="btn" ng-click="refresh()" title="${toolbar.refresh}"><i class="icon-refresh"></i></a>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<a type="button" class="btn" ng-click="markAllAsRead()" title="${toolbar.mark_all_as_read}"><i class="icon-check"></i></a>
|
||||
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
<ul class="dropdown-menu pull-right">
|
||||
<li><a ng-click="markAllDay()">${toolbar.mark_all_older_day}</a></li>
|
||||
<li><a ng-click="markAllWeek()">${toolbar.mark_all_older_week}</a></li>
|
||||
<li><a ng-click="markAllTwoWeeks()">${toolbar.mark_all_older_two_weeks}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="btn-group hidden-desktop">
|
||||
<button type="button" class="btn" ng-click="MobileService.toggleRightMenu()">
|
||||
<i class="icon-wrench"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="actions btn-group">
|
||||
<div class="visible-desktop">
|
||||
<div class="btn-group read-mode" data-toggle="buttons-radio">
|
||||
<button type="button" class="btn" ng-model="settingsService.settings.readingMode" btn-radio="'unread'">${toolbar.unread}</button>
|
||||
<button type="button" class="btn" ng-model="settingsService.settings.readingMode" btn-radio="'all'">${toolbar.all}</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<a type="button" class="btn" ng-click="toggleOrder()" title="${toolbar.sort_by_asc_desc}">
|
||||
<i ng-class="{'icon-arrow-up' : settingsService.settings.readingOrder == 'asc', 'icon-arrow-down': settingsService.settings.readingOrder == 'desc'}"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="btn-group" data-toggle="buttons-radio">
|
||||
<a type="button" class="btn" ng-model="settingsService.settings.viewMode" btn-radio="'title'" title="${toolbar.titles_only}"><i class="icon-list"></i></a>
|
||||
<a type="button" class="btn" ng-model="settingsService.settings.viewMode" btn-radio="'expanded'" title="${toolbar.expanded_view}"><i class="icon-th-list"></i></a>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<a class="btn" ng-click="toSettings()" title="${toolbar.settings}"><i class="icon-cog"></i></a>
|
||||
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
<ul class="dropdown-menu pull-right">
|
||||
<li><a ng-click="toProfile()"><i class="icon-user"></i> ${toolbar.profile}</a></li>
|
||||
<li ng-show="session.admin"><a ng-click="toAdmin()"><i class="icon-edit"></i> ${toolbar.admin}</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="logout"><i class="icon-off"></i> ${toolbar.logout}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<form ng-submit="search()" class="btn-group input-append hidden-phone hidden-tablet">
|
||||
<input type="text" ng-model="keywords"></input>
|
||||
<button class="btn" type="submit"><i class="icon-search"></i></button>
|
||||
</form>
|
||||
<div class="btn-group donate">
|
||||
<button class="btn btn-success" type="button" ng-click="toHelp()"><i class="icon-question-sign"></i> ${toolbar.about} / ${toolbar.donate}</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<a type="button" class="btn" ng-click="toggleOrder()" title="${toolbar.sort_by_asc_desc}">
|
||||
<i ng-class="{'icon-arrow-up' : settingsService.settings.readingOrder == 'asc', 'icon-arrow-down': settingsService.settings.readingOrder == 'desc'}"></i>
|
||||
</a>
|
||||
|
||||
<div class="btn-group" data-toggle="buttons-radio">
|
||||
<a type="button" class="btn" ng-model="settingsService.settings.viewMode" btn-radio="'title'" title="${toolbar.titles_only}"><i class="icon-list"></i></a>
|
||||
<a type="button" class="btn" ng-model="settingsService.settings.viewMode" btn-radio="'expanded'" title="${toolbar.expanded_view}"><i class="icon-th-list"></i></a>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<a type="button" class="btn" ng-click="previousEntry()" title="${toolbar.previous_entry}"><i class="icon-chevron-up"></i></a>
|
||||
<a type="button" class="btn" ng-click="nextEntry()" title="${toolbar.next_entry}"><i class="icon-chevron-down"></i></a>
|
||||
<a type="button" class="btn" ng-click="refresh()" title="${toolbar.refresh}"><i class="icon-refresh"></i></a>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<a type="button" class="btn" ng-click="markAllAsRead()" title="${toolbar.mark_all_as_read}"><i class="icon-check"></i></a>
|
||||
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
<ul class="dropdown-menu pull-right">
|
||||
<li><a ng-click="markAllDay()">${toolbar.mark_all_older_day}</a></li>
|
||||
<li><a ng-click="markAllWeek()">${toolbar.mark_all_older_week}</a></li>
|
||||
<li><a ng-click="markAllTwoWeeks()">${toolbar.mark_all_older_two_weeks}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="btn-group">
|
||||
<a class="btn" ng-click="toSettings()" title="${toolbar.settings}"><i class="icon-cog"></i></a>
|
||||
<button class="btn dropdown-toggle" data-toggle="dropdown">
|
||||
<span class="caret"></span>
|
||||
</button>
|
||||
<ul class="dropdown-menu pull-right">
|
||||
<li><a ng-click="toProfile()"><i class="icon-user"></i> ${toolbar.profile}</a></li>
|
||||
<li ng-show="session.admin"><a ng-click="toAdmin()"><i class="icon-edit"></i> ${toolbar.admin}</a></li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="logout"><i class="icon-off"></i> ${toolbar.logout}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</span>
|
||||
<form ng-submit="search()" class="input-append">
|
||||
<input type="text" ng-model="keywords"></input>
|
||||
<button class="btn" type="submit"><i class="icon-search"></i></button>
|
||||
</form>
|
||||
<div class="donate">
|
||||
<button class="btn btn-success" type="button" ng-click="toHelp()"><i class="icon-question-sign"></i> ${toolbar.about} / ${toolbar.donate}</button>
|
||||
</div>
|
||||
<div spinner shown="loading"></div>
|
||||
<span>{{ServerService.announcement}}</span>
|
||||
|
||||
<span class="hidden-phone hidden-tablet">{{ServerService.announcement}}</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,12 +1,12 @@
|
||||
<div class="container-fluid">
|
||||
<div class="row-fluid">
|
||||
<div class="span2">
|
||||
<div class="span2 left-menu">
|
||||
<div class="sidebar-nav-fixed" mousewheel-scrolling>
|
||||
<div ng-include="'templates/_subscribe.html'"></div>
|
||||
<div ng-include="'templates/_tree.html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span10">
|
||||
<div class="span10 main-content">
|
||||
<div class="toolbar" ng-include="'templates/_toolbar.html'"></div>
|
||||
<div class="entryList">
|
||||
<div ui-view></div>
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
on-scroll-middle="onScroll(entry)" ng-class="{current: current==entry}">
|
||||
<a href="{{entry.url}}" target="_blank" class="entry-heading" ng-click="noop($event)" ng-mouseup="entryClicked(entry, $event)"
|
||||
ng-class="{open: current == entry, closed: current != entry}">
|
||||
<span class="feed-name">
|
||||
<span class="feed-name visible-desktop">
|
||||
<span class="star" ng-mouseup="star(entry, !entry.starred, $event)">
|
||||
<i ng-class="{'icon-star icon-star-yellow': entry.starred, 'icon-star-empty': !entry.starred}"
|
||||
class="pointer"></i>
|
||||
@@ -18,7 +18,7 @@
|
||||
<favicon url="entry.feedLink" />
|
||||
{{entry.feedName}}
|
||||
</span>
|
||||
<span class="entry-date">{{entry.date | entryDate}}</span>
|
||||
<span class="entry-date visible-desktop">{{entry.date | entryDate}}</span>
|
||||
<span class="entry-name" ng-class="{unread: entry.read == false, shrink: true}" ng-bind-html-unsafe="entry.title"></span>
|
||||
|
||||
</a>
|
||||
|
||||
Reference in New Issue
Block a user