hyperzlib
/
nodebb-theme-persona
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

mobile tweaks

Browse Source
main
barisusakli 10 years ago
parent 9dd5ca3ab5
commit 86934e1ac7
10 changed files with 55 additions and 34 deletions
Show Stats Download Patch File Download Diff File

23
less/categories.less
Unescape Escape View File

@ -4,11 +4,20 @@
> li { > li {
margin-bottom: 20px; padding-top: 10px;
padding-bottom: 10px;
@media (max-width: @screen-xs-max) {
border-top: 1px solid #eee;
&:last-child {
border-bottom: 1px solid #eee;
};
}
min-height: 53px; min-height: 53px;
.content { .content {
margin-top: 7px; padding-right: 0px;
.icon { .icon {
font-size: 17px; font-size: 17px;
@ -28,7 +37,7 @@
} }
h2 { h2 {
font-size: 20px; font-size: 18px;
line-height: 22px; line-height: 22px;
margin: 0; margin: 0;
margin-left: 62px; margin-left: 62px;
@ -57,6 +66,10 @@
} }
} }
.mobile-stat {
padding-left: 0px;
}
.card { .card {
border-left: 4px solid #ccc; border-left: 4px solid #ccc;
text-align: left; text-align: left;
@ -70,8 +83,8 @@
img { img {
border-radius: 50%; border-radius: 50%;
width: 30px; width: 24px;
height: 30px; height: 24px;
} }
p { p {

7
less/category.less
Unescape Escape View File

@ -1,4 +1,9 @@
.category { .category {
.topic-list {
margin-top: 10px;
}
> ul { > ul {
> li { > li {
list-style: none; list-style: none;
@ -88,8 +93,6 @@
font-weight: bold; font-weight: bold;
} }
} }
} }
.category, .categories, .subcategory { .category, .categories, .subcategory {

4
less/topic.less
Unescape Escape View File

@ -89,10 +89,6 @@
margin-top: -5px; margin-top: -5px;
} }
.topic-main-buttons a.btn {
margin-left: 20px;
}
.title { .title {
p { p {
margin-bottom: 4px; margin-bottom: 4px;

6
templates/category.tpl
Unescape Escape View File

@ -2,7 +2,7 @@
<!-- IMPORT partials/breadcrumbs.tpl --> <!-- IMPORT partials/breadcrumbs.tpl -->
<!-- IMPORT partials/category/subcategory.tpl --> <!-- IMPORT partials/category/subcategory.tpl -->
<!-- IF children.length --><hr /><!-- ENDIF children.length --> <!-- IF children.length --><hr class="hidden-xs"/><!-- ENDIF children.length -->
<div class="clearfix"> <div class="clearfix">
<!-- IF privileges.topics:create --> <!-- IF privileges.topics:create -->
@ -20,9 +20,9 @@
</span> </span>
</div> </div>
<hr /> <hr class="hidden-xs" />
<p>{name}</p> <p class="hidden-xs">{name}</p>
<!-- IF !topics.length --> <!-- IF !topics.length -->
<div class="alert alert-warning" id="category-no-topics"> <div class="alert alert-warning" id="category-no-topics">

6
templates/partials/post_bar.tpl
Unescape Escape View File

@ -1,11 +1,11 @@
<div class="clearfix"> <div class="clearfix">
<span class="tags"> <div class="tags pull-left">
<!-- BEGIN tags --> <!-- BEGIN tags -->
<a href="{config.relative_path}/tags/{tags.value}"> <a href="{config.relative_path}/tags/{tags.value}">
<span class="tag-item" data-tag="{tags.value}" style="<!-- IF tags.color -->color: {tags.color};<!-- ENDIF tags.color --><!-- IF tags.bgColor -->background-color: {tags.bgColor};<!-- ENDIF tags.bgColor -->">{tags.value}</span> <span class="tag-item" data-tag="{tags.value}" style="<!-- IF tags.color -->color: {tags.color};<!-- ENDIF tags.color --><!-- IF tags.bgColor -->background-color: {tags.bgColor};<!-- ENDIF tags.bgColor -->">{tags.value}</span>
<span class="tag-topic-count human-readable-number" title="{tags.score}">{tags.score}</span></a> <span class="tag-topic-count human-readable-number" title="{tags.score}">{tags.score}</span></a>
<!-- END tags --> <!-- END tags -->
</span> </div>
<div class="topic-main-buttons pull-right"> <div class="topic-main-buttons pull-right">
<span class="loading-indicator btn pull-left hidden" done="0"> <span class="loading-indicator btn pull-left hidden" done="0">
@ -14,8 +14,6 @@
<!-- IMPORT partials/topic/stats.tpl --> <!-- IMPORT partials/topic/stats.tpl -->
<br class="visible-xs"/>
<!-- IMPORT partials/topic/reply-button.tpl --> <!-- IMPORT partials/topic/reply-button.tpl -->
<!-- IMPORT partials/topic/watch.tpl --> <!-- IMPORT partials/topic/watch.tpl -->

3
templates/partials/topic/post.tpl
Unescape Escape View File

@ -24,7 +24,7 @@
<a component="post/reply" href="#" class="no-select <!-- IF !privileges.topics:reply -->hidden<!--ENDIF !privileges.topics:reply -->">[[topic:reply]]</a> <a component="post/reply" href="#" class="no-select <!-- IF !privileges.topics:reply -->hidden<!--ENDIF !privileges.topics:reply -->">[[topic:reply]]</a>
<a component="post/quote" href="#" class="no-select <!-- IF !privileges.topics:reply -->hidden<!--ENDIF !privileges.topics:reply -->">[[topic:quote]]</a> <a component="post/quote" href="#" class="no-select <!-- IF !privileges.topics:reply -->hidden<!--ENDIF !privileges.topics:reply -->">[[topic:quote]]</a>
<!-- IF posts.toPid --> <!-- IF posts.toPid -->
<button component="post/parent" class="btn btn-xs btn-default" data-topid="{posts.toPid}"><i class="fa fa-reply"></i> @{posts.parent.username} <i class="fa fa-caret-down"></i></button> <button component="post/parent" class="btn btn-xs btn-default" data-topid="{posts.toPid}"><i class="fa fa-reply"></i> @{posts.parent.username}</button>
<!-- ENDIF posts.toPid --> <!-- ENDIF posts.toPid -->
</span> </span>
<span> <span>
@ -64,5 +64,4 @@
<div component="post/signature" data-uid="{posts.user.uid}" class="post-signature">{posts.user.signature}</div> <div component="post/signature" data-uid="{posts.user.uid}" class="post-signature">{posts.user.signature}</div>
<!-- ENDIF posts.user.signature --> <!-- ENDIF posts.user.signature -->
<hr /> <hr />

32
templates/partials/topics_list.tpl
Unescape Escape View File

@ -1,10 +1,10 @@
<ul component="category" itemscope itemtype="http://www.schema.org/ItemList" data-nextstart="{nextStart}"> <ul component="category" class="topic-list" itemscope itemtype="http://www.schema.org/ItemList" data-nextstart="{nextStart}">
<meta itemprop="itemListOrder" content="descending"> <meta itemprop="itemListOrder" content="descending">
<!-- BEGIN topics --> <!-- BEGIN topics -->
<li component="category/topic" class="row clearfix {function.generateTopicClass}" <!-- IMPORT partials/data/category.tpl -->> <li component="category/topic" class="row clearfix {function.generateTopicClass}" <!-- IMPORT partials/data/category.tpl -->>
<meta itemprop="name" content="{function.stripTags, title}"> <meta itemprop="name" content="{function.stripTags, title}">
<div class="col-md-7 col-sm-9 col-xs-12 content"> <div class="col-md-7 col-sm-9 col-xs-10 content">
<div class="avatar pull-left"> <div class="avatar pull-left">
<!-- IF showSelect --> <!-- IF showSelect -->
<div class="select fa-square-o"> <div class="select fa-square-o">
@ -33,39 +33,49 @@
</small> </small>
<!-- ENDIF !template.category --> <!-- ENDIF !template.category -->
<span class="tag-list"> <span class="tag-list hidden-xs">
<!-- BEGIN tags --> <!-- BEGIN tags -->
<a href="{config.relative_path}/tags/{topics.tags.value}"><span class="tag" style="<!-- IF topics.tags.color -->color: {topics.tags.color};<!-- ENDIF topics.tags.color --><!-- IF topics.tags.bgColor -->background-color: {topics.tags.bgColor};<!-- ENDIF topics.tags.bgColor -->">{topics.tags.value}</span></a> <a href="{config.relative_path}/tags/{topics.tags.value}"><span class="tag" style="<!-- IF topics.tags.color -->color: {topics.tags.color};<!-- ENDIF topics.tags.color --><!-- IF topics.tags.bgColor -->background-color: {topics.tags.bgColor};<!-- ENDIF topics.tags.bgColor -->">{topics.tags.value}</span></a>
<!-- END tags --> <!-- END tags -->
<!-- IF topics.tags.length --><small>&bull;</small><!-- ENDIF topics.tags.length --> <!-- IF topics.tags.length --><small>&bull;</small><!-- ENDIF topics.tags.length -->
</span> </span>
<small>[[global:posted_ago, <span class="timeago" title="{topics.relativeTime}"></span>]]</small> <small class="hidden-xs"><span class="timeago" title="{topics.relativeTime}"></span></small>
<small class="visible-xs-inline">
<small class="clearfix"><span class="visible-xs"><span class="pull-right"><i class="fa fa-pencil"></i> {topics.postcount} &bull; <a href="{config.relative_path}/topic/{topics.slug}/{topics.teaser.index}"><i class="fa fa-arrow-circle-right"></i></a></span> <!-- IF topics.teaser.timestamp -->
</span></small> <span class="timeago" title="{topics.teaser.timestamp}"></span>
<!-- ELSE -->
<span class="timeago" title="{topics.relativeTime}"></span>
<!-- ENDIF topics.teaser.timestamp -->
</small>
</h2> </h2>
</div> </div>
<div class="mobile-stat col-xs-2 visible-xs text-right">
<span class="human-readable-number">{topics.postcount}</span> <a href="{config.relative_path}/topic/{topics.slug}/{topics.teaser.index}"><i class="fa fa-arrow-circle-right"></i></a>
</div>
<div class="col-md-1 hidden-sm hidden-xs stats"> <div class="col-md-1 hidden-sm hidden-xs stats">
<span class="human-readable-number" title="{topics.postcount}">{topics.postcount}</span><br /> <span class="human-readable-number" title="{topics.postcount}">{topics.postcount}</span><br />
<small>[[global:posts]]</small> <small>[[global:posts]]</small>
</div> </div>
<div class="col-md-1 hidden-sm hidden-xs stats"> <div class="col-md-1 hidden-sm hidden-xs stats">
<span class="human-readable-number" title="{topics.viewcount}">{topics.viewcount}</span><br /> <span class="human-readable-number" title="{topics.viewcount}">{topics.viewcount}</span><br />
<small>[[global:views]]</small> <small>[[global:views]]</small>
</div> </div>
<div class="col-md-3 col-sm-3 teaser hidden-xs"> <div class="col-md-3 col-sm-3 teaser hidden-xs">
<div class="card" style="border-color: {topics.category.bgColor}"> <div class="card" style="border-color: {topics.category.bgColor}">
<!-- IF topics.unreplied --> <!-- IF topics.unreplied -->
<p class="hidden-xs"> <p>
[[category:no_replies]] [[category:no_replies]]
</p> </p>
<!-- ELSE --> <!-- ELSE -->
<p class="hidden-xs"> <p>
<strong>{topics.teaser.user.username}</strong> <a href="{config.relative_path}/user/{topics.teaser.user.userslug}"><img title="{topics.teaser.user.username}" class="user-img" src="{topics.teaser.user.picture}" /></a>
<a class="permalink" href="{config.relative_path}/topic/{topics.slug}/{topics.teaser.index}"> <a class="permalink" href="{config.relative_path}/topic/{topics.slug}/{topics.teaser.index}">
<small class="timeago" title="{topics.teaser.timestamp}"></small> <span class="timeago" title="{topics.teaser.timestamp}"></span>
</a> </a>
</p> </p>
<div class="post-content"> <div class="post-content">

2
templates/recent.tpl
Unescape Escape View File

@ -13,7 +13,7 @@
</div> </div>
</div> </div>
<hr /> <hr class="hidden-xs"/>
<div class="category"> <div class="category">
<!-- IF !topics.length --> <!-- IF !topics.length -->

4
templates/topic.tpl
Unescape Escape View File

@ -1,7 +1,7 @@
<div class="topic"> <div class="topic">
<!-- IMPORT partials/breadcrumbs.tpl --> <!-- IMPORT partials/breadcrumbs.tpl -->
<h1 component="post/header" itemprop="name"> <h1 component="post/header" class="hidden-xs" itemprop="name">
<i class="fa fa-thumb-tack <!-- IF !pinned -->hidden<!-- ENDIF !pinned -->"></i> <i class="fa fa-lock <!-- IF !locked -->hidden<!-- ENDIF !locked -->"></i> <span class="topic-title" component="topic/title">{title}</span> <i class="fa fa-thumb-tack <!-- IF !pinned -->hidden<!-- ENDIF !pinned -->"></i> <i class="fa fa-lock <!-- IF !locked -->hidden<!-- ENDIF !locked -->"></i> <span class="topic-title" component="topic/title">{title}</span>
@ -17,6 +17,8 @@
<div component="topic/deleted/message" class="alert alert-warning<!-- IF !deleted --> hidden<!-- ENDIF !deleted -->">[[topic:deleted_message]]</div> <div component="topic/deleted/message" class="alert alert-warning<!-- IF !deleted --> hidden<!-- ENDIF !deleted -->">[[topic:deleted_message]]</div>
<hr class="visible-xs" />
<ul component="topic" class="posts" data-tid="{tid}"> <ul component="topic" class="posts" data-tid="{tid}">
<!-- BEGIN posts --> <!-- BEGIN posts -->
<li component="post" class="<!-- IF posts.deleted -->deleted<!-- ENDIF posts.deleted -->" <!-- IMPORT partials/data/topic.tpl -->> <li component="post" class="<!-- IF posts.deleted -->deleted<!-- ENDIF posts.deleted -->" <!-- IMPORT partials/data/topic.tpl -->>

2
templates/unread.tpl
Unescape Escape View File

@ -45,7 +45,7 @@
</div> </div>
</div> </div>
<hr /> <hr class="hidden-xs"/>
<div class="category"> <div class="category">
<div id="category-no-topics" class="alert alert-warning <!-- IF topics.length -->hidden<!-- ENDIF topics.length -->">[[unread:no_unread_topics]]</div> <div id="category-no-topics" class="alert alert-warning <!-- IF topics.length -->hidden<!-- ENDIF topics.length -->">[[unread:no_unread_topics]]</div>

Write Preview
Loading…
Cancel
Save