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

Merge remote-tracking branch 'origin/master' into user-icons

Browse Source
main
Julian Lam 9 years ago
parent 276895a993 9dd5ca3ab5
commit 8e439e0b8c
23 changed files with 638 additions and 205 deletions
Show Stats Download Patch File Download Diff File

1
less/categories.less
Unescape Escape View File

@ -35,7 +35,6 @@
line-height: 22px;
margin: 0;
margin-left: 62px;
width: 85%;
strong {
color: @gray-dark;

8
less/category.less
Unescape Escape View File

@ -50,7 +50,6 @@
.transition(.2s ease-in-out opacity);
}
width: 50px;
float: left;
}
@ -70,8 +69,13 @@
font-size: 10px;
background: lighten(@gray-lighter, 2.5%);
padding: 5px;
white-space: nowrap;
}
}
.fa-stack {
font-size: 90%;
}
}
&:last-child li {
@ -84,6 +88,8 @@
font-weight: bold;
}
}
}
.category, .categories, .subcategory {

27
less/mobile.less
Unescape Escape View File

@ -1,8 +1,17 @@
#menu {
.slideout-menu {
position: fixed;
left: auto;
top: 0;
bottom: 0;
right: 0;
z-index: 0;
width: 256px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
display: none;
}
@media (max-width: 980px) {
body {
padding-top: 0;
@ -20,6 +29,7 @@
}
#menu {
padding-top: 100px;
background-color: #1D1F20;
background-image: linear-gradient(145deg, #1D1F20, #404348);
@ -120,19 +130,6 @@
}
}
.slideout-menu {
position: fixed;
left: auto;
top: 0;
bottom: 0;
right: 0;
z-index: 0;
width: 256px;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
display: none;
}
.slideout-panel {
position: relative;
z-index: 1;

41
less/topic.less
Unescape Escape View File

@ -64,6 +64,19 @@
right: 25px;
}
.bookmarked {
position: absolute;
top: 1px;
padding-top: 3px;
border-radius: 4px;
right: 72px;
font-size: 10px;
padding-bottom: 4px;
background: darken(@brand-info, 20%);
opacity: 0;
.transition(0.75s ease-in-out opacity);
}
[component="post/upvote"], [component="post/downvote"] {
color: @gray-light;
}
@ -110,9 +123,10 @@
.post-tools {
text-transform: lowercase;
:before {
a::before {
content: "\2022\0020";
}
a {
.pointer;
}
@ -241,13 +255,17 @@
border-color: darken(@brand-info, 20%);
box-shadow: 0px 0px 1px @brand-info;
}
&.highlight .bookmarked {
opacity: 1;
}
}
.content {
.fix-lists;
blockquote {
font-size: 85%;
font-size: 12px;
}
> blockquote {
@ -305,6 +323,25 @@
}
}
}
.pagination-block {
position: fixed;
width: 100%;
background-color: #eee;
bottom: 0px;
left: 0px;
z-index: 100;
.wrapper {
padding: 5px 0px 5px 0px;
}
.progress-bar {
background-color: @brand-info;
display:block;
z-index: -1;
position: absolute;
}
}
}
.thread_active_users {

486
lib/modules/slideout.min.js vendored
View File

File diff suppressed because one or more lines are too long

91
lib/persona.js
Unescape Escape View File

@ -6,7 +6,6 @@ $(document).ready(function() {
setupNProgress();
setupTaskbar();
setupEditedByIcon();
setupPaginator();
setupMobileMenu();
var env = utils.findBootstrapEnvironment();
@ -88,81 +87,13 @@ $(document).ready(function() {
$(window).on('action:posts.loaded', activateEditedTooltips);
}
function setupPaginator() {
function appendPageNumber(ev, data) {
var el = data.after ? data.after : data.before;
if (!el) {
return;
}
var page = Math.ceil((el.attr('data-index') - 1) / config.postsPerPage),
handle = $('<div class="page-number pointer">' + page + '</div>'),
shadow = $('<div class="shadow"></div>');
el.append(handle);
el.append(shadow);
handle.tooltip({
title: 'Slide to paginate',
placement: 'auto left'
});
var dragging = false, originalX = 0, toPage = page;
handle.on('touchstart', function(ev) {
dragging = true;
originalX = ev.originalEvent.touches[0].clientX;
});
$('#content').on('touchend', function() {
if (dragging === true) {
dragging = false;
if (page !== toPage) {
ajaxify.go('topic/' + ajaxify.data.slug + '/' + (toPage * config.postsPerPage));
}
shadow.removeClass('active');
}
});
$('#content').on('touchmove', function(ev) {
if (!dragging) {
return;
}
var distance = ev.originalEvent.touches[0].clientX - originalX,
handlePos = parseInt(handle.css('left'), 10),
postWidth = handle.parents('[component="post"]').width();
toPage = Math.ceil((handlePos + distance) / postWidth * ajaxify.data.pageCount);
if (toPage >= ajaxify.data.pageCount) {
toPage = (ajaxify.data.pageCount - 1);
}
if (toPage < 0) {
toPage = 0;
}
if (parseInt(handle.html(), 10) !== toPage) {
handle.html(toPage);
handle.removeClass('animated');
setTimeout(function() { handle.addClass('animated');}, 10);
}
shadow.addClass('active');
shadow.css('left', toPage / ajaxify.data.pageCount * postWidth + 'px');
});
handle.css('left', page / ajaxify.data.pageCount * handle.parents('[component="post"]').width() + 'px');
}
$(window).on('action:posts.loading', appendPageNumber);
}
function setupMobileMenu() {
if (!window.addEventListener) {
return;
}
$('#menu').removeClass('hidden');
var slideout = new Slideout({
'panel': document.getElementById('panel'),
'menu': document.getElementById('menu'),
@ -172,7 +103,6 @@ $(document).ready(function() {
});
$('#mobile-menu').on('click', function() {
$('#menu').show();
slideout.toggle();
});
@ -180,11 +110,7 @@ $(document).ready(function() {
slideout.close();
});
$(window).on('resize', function() {
slideout.close();
});
$(window).on('action:ajaxify.start', function() {
$(window).on('resize action:ajaxify.start', function() {
slideout.close();
});
@ -194,8 +120,6 @@ $(document).ready(function() {
}
function openingMenu() {
$('#menu').show();
$('#header-menu').css({
'top': $(window).scrollTop() + 'px',
'position': 'absolute'
@ -211,9 +135,13 @@ $(document).ready(function() {
});
}
slideout.on('beforeopen', openingMenuAndLoad);
slideout.on('open', openingMenuAndLoad);
slideout.on('translate', openingMenu);
slideout.on('touchmove', function(target) {
var $target = $(target);
if ($target.length && ($target.is('code') || $target.parents('code').length)) {
slideout._preventOpen = true;
}
});
slideout.on('close', function() {
$('#header-menu').css({
@ -221,7 +149,6 @@ $(document).ready(function() {
'position': 'fixed'
});
$('.slideout-open').removeClass('slideout-open');
$('#menu').hide();
});
$('#menu [data-section="navigation"] ul').html($('#main-nav').html() + ($('#logged-out-menu').html() || ''));

1
modules.less
Unescape Escape View File

@ -1,3 +1,2 @@
@import "modules/taskbar";
@import "modules/alerts";
@import "modules/paginator";

41
modules/paginator.less
Unescape Escape View File

@ -1,41 +0,0 @@
.topic {
.page-number {
position: absolute;
bottom: 6px;
background: rgb(219, 68, 55);
padding: 4px;
width: 26px;
height: 26px;
text-align: center;
border-radius: 50%;
color: white;
font-size: 11px;
z-index: 1;
.user-select(none);
&.animated {
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
-webkit-animation-duration: 0.5s;
animation-duration: 0.5s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
}
.shadow.active {
border-radius: 50%;
width: 13px;
height: 13px;
border: 1px solid #333;
position: absolute;
bottom: 13px;
}
@media (min-width: @screen-md-min) {
.page-number {
display: none;
}
}
}

4
package.json
Unescape Escape View File

@ -1,8 +1,8 @@
{
"name": "nodebb-theme-persona",
"version": "3.0.23",
"version": "3.0.38",
"nbbpm": {
"compatibility": "^0.9.0"
"compatibility": "^0.8.2"
},
"description": "Persona theme for NodeBB",
"main": "theme.less",

5
templates/account/edit.tpl
Unescape Escape View File

@ -145,6 +145,7 @@
<hr />
<!-- IF sso.length -->
<label class="control-label">[[user:sso.title]]</label>
<div class="list-group">
<!-- BEGIN sso -->
@ -155,10 +156,8 @@
</a>
<!-- END sso -->
</div>
<!-- ENDIF sso.length -->
</div>
</div>
<!-- IMPORT partials/modals/change_picture_modal.tpl -->
<!-- IMPORT partials/modals/upload_picture_from_url_modal.tpl -->
</div>

2
templates/footer.tpl
Unescape Escape View File

@ -1,7 +1,7 @@
</div><!--END container -->
</main>
<div class="hide tpl-500">
<div class="hide">
<!-- IMPORT 500.tpl -->
</div>

2
templates/header.tpl
Unescape Escape View File

@ -38,7 +38,7 @@
</head>
<body>
<nav id="menu">
<nav id="menu" class="hidden">
<section class="menu-profile">
<!-- IF user.picture -->
<img src="{user.picture}"/>

4
templates/partials/menu.tpl
Unescape Escape View File

@ -155,7 +155,7 @@
<i class="fa fa-angle-up pointer fa-fw pageup"></i>
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<span id="pagination"></span>
<span class="pagination-text"></span>
</a>
<i class="fa fa-angle-down pointer fa-fw pagedown"></i>
@ -175,7 +175,7 @@
<!-- BEGIN navigation -->
<!-- IF function.displayMenuItem, @index -->
<li class="{navigation.class}">
<a href="{relative_path}{navigation.route}" title="{navigation.title}" id="{navigation.id}"<!-- IF navigation.properties.targetBlank --> target="_blank"<!-- ENDIF navigation.properties.targetBlank -->>
<a href="{relative_path}{navigation.route}" title="{navigation.title}" <!-- IF navigation.id -->id="{navigation.id}"<!-- ENDIF navigation.id --><!-- IF navigation.properties.targetBlank --> target="_blank"<!-- ENDIF navigation.properties.targetBlank -->>
<!-- IF navigation.iconClass -->
<i class="fa fa-fw {navigation.iconClass}"></i>
<!-- ENDIF navigation.iconClass -->

8
templates/partials/modals/change_picture_modal.tpl
Unescape Escape View File

@ -1,4 +1,4 @@
<div id="change-picture-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="change-picture" aria-hidden="true">
<div id="change-picture-modal" class="modal" tabindex="-1" role="dialog" aria-labelledby="change-picture" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
@ -31,6 +31,6 @@
<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">[[global:close]]</button>
<button id="savePictureChangesBtn" class="btn btn-primary">[[global:save_changes]]</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
</div>
</div>
</div>

2
templates/partials/modals/upload_picture_from_url_modal.tpl
Unescape Escape View File

@ -1,4 +1,4 @@
<div id="upload-picture-from-url-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="upload-picture-url" aria-hidden="true">
<div id="upload-picture-from-url-modal" class="modal" tabindex="-1" role="dialog" aria-labelledby="upload-picture-url" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

2
templates/partials/modals/upload_picture_modal.tpl
Unescape Escape View File

@ -1,4 +1,4 @@
<div id="upload-picture-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="upload-picture" aria-hidden="true">
<div id="upload-picture-modal" class="modal" tabindex="-1" role="dialog" aria-labelledby="upload-picture" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">

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

@ -1,3 +1,4 @@
<div class="clearfix">
<span class="tags">
<!-- BEGIN tags -->
<a href="{config.relative_path}/tags/{tags.value}">
@ -11,20 +12,18 @@
<span class="hidden-xs">[[topic:loading_more_posts]]</span> <i class="fa fa-refresh fa-spin"></i>
</span>
<div class="stats">
<span component="topic/post-count" class="human-readable-number" title="{postcount}">{postcount}</span><br />
<small>[[global:posts]]</small>
</div>
<div class="stats">
<span class="human-readable-number" title="{viewcount}">{viewcount}</span><br />
<small>[[global:views]]</small>
</div>
<!-- IMPORT partials/topic/stats.tpl -->
<br class="visible-xs"/>
<!-- IMPORT partials/topic/reply-button.tpl -->
<!-- IMPORT partials/topic/watch.tpl -->
<!-- IMPORT partials/topic/sort.tpl -->
<!-- IMPORT partials/thread_tools.tpl -->
</div>
<div class="clearfix"></div>
</div>
<hr/>

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

@ -27,6 +27,9 @@
<span class="post-tools">
<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>
<!-- 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>
<!-- ENDIF posts.toPid -->
</span>
<span>
<!-- IF posts.user.custom_profile_info.length -->
@ -37,6 +40,7 @@
<!-- ENDIF posts.user.custom_profile_info.length -->
</span>
</div>
<span class="badge bookmarked"><i class="fa fa-star"></i></span>
<div class="votes">
<!-- IF !reputation:disabled -->
<a component="post/upvote" href="#" class="<!-- IF posts.upvoted -->upvoted<!-- ENDIF posts.upvoted -->">
@ -56,6 +60,7 @@
</div>
<br />
<div class="content" component="post/content" itemprop="text">
{posts.content}
</div>
@ -64,7 +69,4 @@
<!-- ENDIF posts.user.signature -->
<small data-editor="{posts.editor.userslug}" component="post/editor" class="hidden">[[global:last_edited_by_ago, <strong>{posts.editor.username}</strong>, <span class="timeago" title="{posts.relativeEditTime}"></span>]]</small>
<hr />

7
templates/partials/topic/sort.tpl
Unescape Escape View File

@ -1,7 +1,8 @@
<!-- IF loggedIn -->
<div class="btn-group hidden-xs hidden-sm" component="thread/sort">
<button class="btn dropdown-toggle" data-toggle="dropdown" type="button">[[topic:sort_by]] <span class="caret"></span></button>
<ul class="dropdown-menu">
<div class="btn-group" component="thread/sort">
<button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button"><span class="visible-sm-inline visible-md-inline visible-lg-inline">[[topic:sort_by]]</span>
<span class="visible-xs-inline"><i class="fa fa-fw fa-sort"></i></span> <span class="caret"></span></button>
<ul class="dropdown-menu dropdown-menu-right">
<li><a href="#" class="oldest_to_newest" data-sort="oldest_to_newest"><i class="fa fa-fw"></i> [[topic:oldest_to_newest]]</a></li>
<li><a href="#" class="newest_to_oldest" data-sort="newest_to_oldest"><i class="fa fa-fw"></i> [[topic:newest_to_oldest]]</a></li>
<li><a href="#" class="most_votes" data-sort="most_votes"><i class="fa fa-fw"></i> [[topic:most_votes]]</a></li>

8
templates/partials/topic/stats.tpl
Unescape Escape View File

@ -0,0 +1,8 @@
<div class="stats hidden-xs">
<span component="topic/post-count" class="human-readable-number" title="{postcount}">{postcount}</span><br />
<small>[[global:posts]]</small>
</div>
<div class="stats hidden-xs">
<span class="human-readable-number" title="{viewcount}">{viewcount}</span><br />
<small>[[global:views]]</small>
</div>

7
templates/partials/topic/watch.tpl
Unescape Escape View File

@ -0,0 +1,7 @@
<button component="topic/follow" class="btn btn-info <!-- IF isFollowing -->hidden<!-- ENDIF isFollowing -->">
<span class="visible-sm-inline visible-md-inline visible-lg-inline">[[topic:watch]]</span> <i class="fa fa-eye"></i>
</button>
<button component="topic/unfollow" class="btn btn-warning <!-- IF !isFollowing -->hidden<!-- ENDIF !isFollowing -->">
<span class="visible-sm-inline visible-md-inline visible-lg-inline">[[topic:unwatch]]</span> <i class="fa fa-eye-slash"></i>
</button>

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

@ -4,7 +4,7 @@
<li component="category/topic" class="row clearfix {function.generateTopicClass}" <!-- IMPORT partials/data/category.tpl -->>
<meta itemprop="name" content="{function.stripTags, title}">
<div class="col-md-7 col-sm-9 col-xs-11 content">
<div class="col-md-7 col-sm-9 col-xs-12 content">
<div class="avatar pull-left">
<!-- IF showSelect -->
<div class="select fa-square-o">
@ -37,7 +37,7 @@
<!-- IF !template.category -->
<small>
<a href="{config.relative_path}/category/{topics.category.slug}"><i class="fa {topics.category.icon}"></i> {topics.category.name}</a> &bull;
<a href="{config.relative_path}/category/{topics.category.slug}"><span class="fa-stack fa-lg"><i style="color:{topics.category.bgColor};"class="fa fa-circle fa-stack-2x"></i><i style="color:{topics.category.color};" class="fa {topics.category.icon} fa-stack-1x"></i></span> {topics.category.name}</a> &bull;
</small>
<!-- ENDIF !template.category -->
@ -49,6 +49,9 @@
</span>
<small>[[global:posted_ago, <span class="timeago" title="{topics.relativeTime}"></span>]]</small>
<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>
</span></small>
</h2>
</div>
@ -60,7 +63,7 @@
<span class="human-readable-number" title="{topics.viewcount}">{topics.viewcount}</span><br />
<small>[[global:views]]</small>
</div>
<div class="col-md-3 col-sm-3 col-xs-1 teaser hidden-xs">
<div class="col-md-3 col-sm-3 teaser hidden-xs">
<div class="card" style="border-color: {topics.category.bgColor}">
<!-- IF topics.unreplied -->
<p class="hidden-xs">

26
templates/topic.tpl
Unescape Escape View File

@ -4,15 +4,7 @@
<h1 component="post/header" 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>
<!-- IMPORT partials/topic/sort.tpl -->
<button component="topic/follow" class="btn hidden-xs hidden-sm <!-- IF isFollowing -->hidden<!-- ENDIF isFollowing -->">
<span>[[topic:watch]]</span> <i class="fa fa-eye"></i>
</button>
<button component="topic/unfollow" class="btn hidden-xs hidden-sm <!-- IF !isFollowing -->hidden<!-- ENDIF !isFollowing -->">
<span>[[topic:unwatch]]</span> <i class="fa fa-eye-slash"></i>
</button>
<span class="browsing-users hidden hidden-xs hidden-sm pull-right">
<span>[[category:browsing]]</span>
@ -27,8 +19,8 @@
<ul component="topic" class="posts" data-tid="{tid}">
<!-- BEGIN posts -->
<li component="post" class="clearfix <!-- IF posts.deleted -->deleted<!-- ENDIF posts.deleted -->" <!-- IMPORT partials/data/topic.tpl -->>
<a component="post/anchor" name="{posts.index}"></a>
<li component="post" class="<!-- IF posts.deleted -->deleted<!-- ENDIF posts.deleted -->" <!-- IMPORT partials/data/topic.tpl -->>
<a component="post/anchor" data-index="{posts.index}" name="{posts.index}"></a>
<meta itemprop="datePublished" content="{posts.relativeTime}">
<meta itemprop="dateModified" content="{posts.relativeEditTime}">
@ -39,6 +31,7 @@
<div class="post-bar" data-index="{posts.index}">
<!-- IMPORT partials/post_bar.tpl -->
</div>
<!-- ENDIF !posts.index -->
</li>
@ -49,10 +42,22 @@
<!-- IMPORT partials/post_bar.tpl -->
</div>
<!-- IF config.usePagination -->
<!-- IMPORT partials/paginator.tpl -->
<!-- ENDIF config.usePagination -->
<div class="visible-xs visible-sm pagination-block text-center">
<div class="progress-bar"></div>
<div class="wrapper">
<i class="fa fa-2x fa-angle-double-up pointer fa-fw pagetop"></i>
<i class="fa fa-2x fa-angle-up pointer fa-fw pageup"></i>
<span class="pagination-text"></span>
<i class="fa fa-2x fa-angle-down pointer fa-fw pagedown"></i>
<i class="fa fa-2x fa-angle-double-down pointer fa-fw pagebottom"></i>
</div>
</div>
</div>
<!-- IF !config.usePagination -->
@ -60,3 +65,4 @@
<!-- IMPORT partials/paginator.tpl -->
</noscript>
<!-- ENDIF !config.usePagination -->

Write Preview
Loading…
Cancel
Save