public-mirrors/NewsBlur
1
0
Fork 0
mirror of https://github.com/samuelclay/NewsBlur.git synced 2025-09-18 21:50:56 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Adding add site popover and complete popover view.

Browse source
This commit is contained in:
Samuel Clay 2013-01-24 18:23:10 -08:00
parent 6bf1ee286f
commit d628e59df9
8 changed files with 438 additions and 144 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
assets.yml
View file

@ -51,9 +51,6 @@ javascripts:
- media/js/vendor/jquery.chosen.js
- media/js/vendor/jquery.effects.core.js
- media/js/vendor/jquery.effects.slideOffscreen.js
- media/js/vendor/bootstrap-tooltip.js
- media/js/vendor/bootstrap-*.js
- media/js/vendor/bootstrapx-*.js
- media/js/vendor/audio.js
- media/js/vendor/socket.io-client.*.js
- media/js/vendor/inflector.js
@ -65,6 +62,7 @@ javascripts:
- media/js/newsblur/views/*.js
- media/js/newsblur/reader/reader_utils.js
- media/js/newsblur/reader/reader.js
- media/js/newsblur/reader/reader_popover.js
- media/js/newsblur/reader/*.js
- media/js/newsblur/welcome/*.js
mobile:

167
media/css/reader.css
View file

@ -3186,8 +3186,11 @@ background: transparent;
/* ============ */
.NB-taskbar-container {
background: #e0e0e0 url('/media/embed/reader/taskbar_background.png') repeat-x top left;
border-top: 1px solid #777D86;
border-top: 1px solid #FFF;
text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
background-image: -webkit-gradient(linear, left top, left bottom, from(#F4F5F2), to(#E8EBE4));
background: -moz-linear-gradient(center top , #F4F5F2 0%, #E8EBE4 100%);
background-image: linear-gradient(top, #F4F5F2, #E8EBE4);
z-index: 10;
}
@ -3542,6 +3545,9 @@ background: transparent;
border-left: 1px solid #C2C5BE;
width: 2px;
}
.left-south {
border-top: 1px solid #C2C5BE;
}
.ui-layout-toggler {
/* display: none !important;*/
}
@ -4069,14 +4075,14 @@ form.opml_import_form input {
}
.NB-add input[type=text] {
width: 300px;
width: 100px;
margin-bottom: 16px;
}
.NB-add input[type=text].ui-autocomplete-loading {
background: white url('/media/embed/reader/recycle_spinner.gif') no-repeat right 2px;
}
.NB-add .NB-add-add-folder input[type=text] {
width: 376px;
width: 176px;
}
.NB-add .NB-folder-icon {
@ -9111,4 +9117,155 @@ form.opml_import_form input {
}
.NB-static-form .NB-errors {
margin-left: 200px;
}
}
/* =========== */
/* = Popover = */
/* =========== */
.NB-popover {
position: absolute;
top: 0;
left: 0;
z-index: 10;
background-color: #FFF;
}
.popover {
position: absolute;
top: 0;
left: 0;
z-index: 1010;
width: 236px;
padding: 1px;
text-align: left;
background-color: #ffffff;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 4px;
-webkit-box-shadow: 1px 4px 4px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 1px 4px 4px rgba(0, 0, 0, 0.4);
box-shadow: 1px 4px 4px rgba(0, 0, 0, 0.4);
white-space: normal;
}
.popover.top {
margin-top: -10px;
}
.popover.right {
margin-left: 10px;
}
.popover.bottom {
margin-top: 10px;
}
.popover.left {
margin-left: -10px;
}
.popover-title {
margin: 0;
padding: 8px 14px;
font-size: 14px;
font-weight: normal;
line-height: 18px;
background-color: #f7f7f7;
border-bottom: 1px solid #ebebeb;
border-radius: 5px 5px 0 0;
}
.popover-content {
padding: 9px 14px;
}
.popover .arrow,
.popover .arrow:after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
}
.popover .arrow {
border-width: 11px;
}
.popover .arrow:after {
border-width: 10px;
content: "";
}
.popover.top-left .arrow,
.popover.top-right .arrow,
.popover.top .arrow {
left: 50%;
margin-left: -11px;
border-bottom-width: 0;
border-top-color: #999;
border-top-color: rgba(0, 0, 0, 0.25);
bottom: -11px;
}
.popover.top-left .arrow {
left: 18px;
}
.popover.top-right .arrow {
left: 90%;
}
.popover.top-left .arrow:after,
.popover.top-right .arrow:after,
.popover.top .arrow:after {
bottom: 1px;
margin-left: -10px;
border-bottom-width: 0;
border-top-color: #ffffff;
}
.popover.right .arrow {
top: 50%;
left: -11px;
margin-top: -11px;
border-left-width: 0;
border-right-color: #999;
border-right-color: rgba(0, 0, 0, 0.25);
}
.popover.right .arrow:after {
left: 1px;
bottom: -10px;
border-left-width: 0;
border-right-color: #ffffff;
}
.popover.bottom .arrow {
left: 50%;
margin-left: -11px;
border-top-width: 0;
border-bottom-color: #999;
border-bottom-color: rgba(0, 0, 0, 0.25);
top: -11px;
}
.popover.bottom .arrow:after {
top: 1px;
margin-left: -10px;
border-top-width: 0;
border-bottom-color: #ffffff;
}
.popover.left .arrow {
top: 50%;
right: -11px;
margin-top: -11px;
border-right-width: 0;
border-left-color: #999;
border-left-color: rgba(0, 0, 0, 0.25);
}
.popover.left .arrow:after {
right: 1px;
border-right-width: 0;
border-left-color: #ffffff;
bottom: -10px;
}
.fade {
opacity: 0;
-webkit-transition: opacity 0.22s ease-in-out;
-moz-transition: opacity 0.22s ease-in-out;
-o-transition: opacity 0.22s ease-in-out;
transition: opacity 0.22s ease-in-out;
}
.fade.in {
opacity: 1;
}

19
media/js/newsblur/reader/reader.js
View file

@ -42,7 +42,8 @@
$tryfeed_header: $('.NB-feeds-header-tryfeed'),
$taskbar: $('.taskbar_nav'),
$feed_floater: $('.NB-feed-story-view-floater'),
$feedbar: $('.NB-feedbar')
$feedbar: $('.NB-feedbar'),
$add_button: $('.NB-task-add')
};
this.flags = {
'bouncing_callout': false,
@ -250,9 +251,9 @@
south__paneSelector: ".left-south",
south__size: 31,
south__resizable: false,
south__spacing_open: 0,
enableCursorHotkey: false,
togglerLength_open: 0
togglerLength_open: 0,
south__spacing_open: 1
});
this.layout.leftCenterLayout = $('.left-center').layout({
@ -2489,7 +2490,11 @@
clearInterval(this.flags['bouncing_callout']);
$.modal.close();
NEWSBLUR.add_feed = new NEWSBLUR.ReaderAddFeed(options);
if (NEWSBLUR.add_feed && NEWSBLUR.add_feed._open) {
NEWSBLUR.add_feed.close();
} else {
NEWSBLUR.add_feed = new NEWSBLUR.ReaderAddFeed(options);
}
},
open_manage_feed_modal: function(feed_id) {
@ -3082,7 +3087,7 @@
$manage_menu_container.data('item', $item && $item[0]);
$('.NB-task-manage').parents('.NB-taskbar').css('z-index', 2);
if (type == 'site') {
$manage_menu_container.align($('.NB-task-manage'), '-bottom -left', {
$manage_menu_container.align($('.NB-task-manage'), 'top -left', {
'top': -32,
'left': -2
});
@ -3112,7 +3117,7 @@
}
}
$manage_menu_container.align($align, '-bottom -left', {
$manage_menu_container.align($align, 'top -left', {
'top': -1 * top,
'left': left
});
@ -3142,7 +3147,7 @@
$align = $('.NB-storytitles-sentiment', $item);
}
}
$manage_menu_container.align($align, '-top -left', {
$manage_menu_container.align($align, '-bottom -left', {
'top': top,
'left': left
});

134
media/js/newsblur/reader/reader_add_feed.js
View file

@ -1,45 +1,58 @@
NEWSBLUR.ReaderAddFeed = function(options) {
var defaults = {
NEWSBLUR.ReaderAddFeed = NEWSBLUR.ReaderPopover.extend({
className: "NB-add-popover",
options: {
'anchor': function() {
return NEWSBLUR.reader.$s.$add_button;
},
'placement': 'top -left',
offset: {
top: -6,
left: 1
},
'onOpen': _.bind(function() {
this.focus_add_feed();
}, this)
};
},
this.options = $.extend({}, defaults, options);
this.model = NEWSBLUR.assets;
this.runner();
};
NEWSBLUR.ReaderAddFeed.prototype = new NEWSBLUR.Modal;
NEWSBLUR.ReaderAddFeed.prototype.constructor = NEWSBLUR.ReaderAddFeed;
_.extend(NEWSBLUR.ReaderAddFeed.prototype, {
runner: function() {
events: {
"click .NB-modal-cancel" : "close",
"click .NB-add-url-submit" : "save_add_url",
"click .NB-add-folder-submit" : "save_add_folder",
"click .NB-add-import-button" : "close_and_open_import",
"focus .NB-add-url" : "handle_focus_add_site",
"blur .NB-add-url" : "handle_blur_add_site"
},
initialize: function(options) {
this.options = _.extend({}, this.options, options);
this.model = NEWSBLUR.assets;
this.make_modal();
this.handle_cancel();
this.open_modal();
this.handle_keystrokes();
this.setup_autocomplete();
this.setup_chosen();
NEWSBLUR.ReaderPopover.prototype.initialize.apply(this);
// this.setup_chosen();
this.focus_add_feed();
},
on_show: function() {
this.options.onOpen();
},
on_hide: function() {
this.$modal.bind('click', $.rescope(this.handle_click, this));
var $add = $('.NB-add-url', this.$modal);
$add.bind('focus', $.rescope(this.handle_focus_add_site, this));
$add.bind('blur', $.rescope(this.handle_blur_add_site, this));
},
make_modal: function() {
var self = this;
this.$modal = $.make('div', { className: 'NB-add NB-modal' }, [
$.make('h2', { className: 'NB-modal-title' }, 'Add sites and folders'),
this.$el.html($.make('div', { className: 'NB-add' }, [
$.make('div', { className: 'NB-add-form' }, [
$.make('div', { className: 'NB-fieldset NB-add-add-url NB-modal-submit' }, [
$.make('h5', [
$.make('div', { className: 'NB-add-folders' }, NEWSBLUR.utils.make_folders(this.model, this.options.folder_title)),
'Add a new site'
]),
$.make('div', { className: 'NB-fieldset-fields' }, [
@ -53,11 +66,8 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
])
]),
$.make('div', { className: 'NB-fieldset NB-add-add-folder NB-modal-submit' }, [
$.make('h5', [
$.make('div', { className: 'NB-add-folders' }, NEWSBLUR.utils.make_folders(this.model, this.options.folder_title)),
'Add a new folder'
]),
$.make('div', { className: 'NB-fieldset-fields' }, [
$.make('div', { className: 'NB-add-folders' }, NEWSBLUR.utils.make_folders(this.model, this.options.folder_title)),
$.make('div', { className: 'NB-fieldset-fields NB-hidden' }, [
$.make('div', [
$.make('div', { className: 'NB-loading' }),
$.make('label', { 'for': 'NB-add-folder' }, [
@ -72,7 +82,7 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
// $.make('div', { className: 'NB-fieldset-divider' }, [
// 'Google Reader and OPML'
// ]),
$.make('div', { className: 'NB-fieldset NB-anonymous-ok NB-modal-submit' }, [
$.make('div', { className: 'NB-fieldset NB-anonymous-ok NB-modal-submit NB-hidden' }, [
$.make('h5', [
'Import feeds'
]),
@ -88,26 +98,19 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
])
])
])
]);
]));
if (NEWSBLUR.Globals.is_anonymous) {
this.$modal.addClass('NB-signed-out');
this.$el.addClass('NB-signed-out');
}
},
handle_cancel: function() {
var $cancel = $('.NB-modal-cancel', this.$modal);
$cancel.click(function(e) {
e.preventDefault();
$.modal.close();
});
return this;
},
focus_add_feed: function() {
var $add = this.options.init_folder ?
$('.NB-add-folder', this.$modal) :
$('.NB-add-url', this.$modal);
this.$('.NB-add-folder') :
this.$('.NB-add-url');
if (!NEWSBLUR.Globals.is_anonymous) {
_.delay(function() {
$add.focus();
@ -117,7 +120,7 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
setup_autocomplete: function() {
var self = this;
var $add = $('.NB-add-url', this.$modal);
var $add = this.$('.NB-add-url');
$add.autocomplete({
minLength: 1,
@ -160,29 +163,29 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
},
handle_focus_add_site: function() {
var $add = $('.NB-add-url', this.$modal);
var $add = this.$('.NB-add-url');
$add.autocomplete('search');
},
handle_blur_add_site: function() {
var $add = $('.NB-add-url', this.$modal);
var $add = this.$('.NB-add-url');
$add.autocomplete('close');
},
setup_chosen: function() {
var $select = $('select', this.$modal);
var $select = this.$('select');
$select.chosen();
},
handle_keystrokes: function() {
var self = this;
$('.NB-add-url', this.$modal).bind('keyup', 'return', function(e) {
this.$('.NB-add-url').bind('keyup', 'return', function(e) {
e.preventDefault();
self.save_add_url();
});
$('.NB-add-folder', this.$modal).bind('keyup', 'return', function(e) {
this.$('.NB-add-folder').bind('keyup', 'return', function(e) {
e.preventDefault();
self.save_add_folder();
});
@ -200,32 +203,9 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
// ===========
// = Actions =
// ===========
handle_click: function(elem, e) {
var self = this;
$.targetIs(e, { tagSelector: '.NB-add-url-submit' }, function($t, $p) {
e.preventDefault();
self.save_add_url();
});
$.targetIs(e, { tagSelector: '.NB-add-folder-submit' }, function($t, $p) {
e.preventDefault();
self.save_add_folder();
});
$.targetIs(e, { tagSelector: '.NB-add-import-button' }, function($t, $p) {
e.preventDefault();
self.close_and_open_import();
});
},
save_add_url: function() {
var $submit = $('.NB-add-add-url input[type=submit]', this.$modal);
var $submit = this.$('.NB-add-add-url input[type=submit]');
var $error = $('.NB-error', '.NB-fieldset.NB-add-add-url');
var $loading = $('.NB-loading', '.NB-fieldset.NB-add-add-url');
@ -241,7 +221,7 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
post_save_add_url: function(e, data) {
NEWSBLUR.log(['Data', data]);
var $submit = $('.NB-add-add-url input[type=submit]', this.$modal);
var $submit = this.$('.NB-add-add-url input[type=submit]');
var $loading = $('.NB-loading', '.NB-fieldset.NB-add-add-url');
$loading.removeClass('NB-active');
$submit.removeClass('NB-disabled');
@ -264,7 +244,7 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
},
error: function(data) {
var $submit = $('.NB-add-add-url input[type=submit]', this.$modal);
var $submit = this.$('.NB-add-add-url input[type=submit]');
var $error = $('.NB-error', '.NB-fieldset.NB-add-add-url');
$error.text(data.message || "Oh no, there was a problem grabbing that URL and there's no good explanation for what happened.");
$error.slideDown(300);
@ -272,7 +252,7 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
},
save_add_folder: function() {
var $submit = $('.NB-add-add-folder input[type=submit]', this.$modal);
var $submit = this.$('.NB-add-add-folder input[type=submit]');
var $error = $('.NB-error', '.NB-fieldset.NB-add-add-folder');
var $loading = $('.NB-loading', '.NB-fieldset.NB-add-add-folder');
@ -287,7 +267,7 @@ _.extend(NEWSBLUR.ReaderAddFeed.prototype, {
},
post_save_add_folder: function(e, data) {
var $submit = $('.NB-add-add-folder input[type=submit]', this.$modal);
var $submit = this.$('.NB-add-add-folder input[type=submit]');
var $loading = $('.NB-loading', '.NB-fieldset.NB-add-add-folder');
$loading.removeClass('NB-active');
$submit.removeClass('NB-disabled');

89
media/js/newsblur/reader/reader_popover.js Normal file
View file

@ -0,0 +1,89 @@
NEWSBLUR.ReaderPopover = Backbone.View.extend({
_open: false,
events: {
"click .NB-modal-cancel": "close"
},
initialize: function(options) {
this.options = _.extend({}, {
animate: true,
offset: {
top: 0,
left: 0
}
}, this.options, options);
console.log(["options", options, this.options]);
this.render();
},
render: function() {
var self = this;
this._open = true;
console.log(["popover render", this.$el, this.options]);
var $popover = $.make("div", { className: "NB-popover popover fade" }, [
$.make('div', { className: "arrow" }),
$.make('div', { className: "popover-inner" }, [
$.make('div', { className: "popover-content" }, [
this.$el
])
])
]);
this.setElement($popover);
$('body').append(this.$el);
this.$el.addClass(this.options.placement.replace('-', '').replace(' ', '-'));
this.$el.align(this.options.anchor(), this.options.placement, this.options.offset);
this.$el.autohide({
clickable: true,
onHide: _.bind(this.close, this)
});
if (this.options.animate) {
this.$el.addClass("in");
}
return this;
},
close: function(e, hide_callback) {
console.log(["close", hide_callback, this.$el, $.support.transition, this.$el.hasClass('fade')]);
var $el = this.$el;
var self = this;
if (_.isFunction(e)) hide_callback = e;
hide_callback = hide_callback || $.noop;
this.$el.removeClass('in');
this.options.on_hide && this.options.on_hide();
function removeWithAnimation() {
var timeout = setTimeout(function () {
console.log(["transition timeout", $el]);
$el.off($.support.transition.end);
self._open = false;
self.remove();
hide_callback();
}, 500);
$el.one($.support.transition.end, function () {
clearTimeout(timeout);
self._open = false;
self.remove();
hide_callback();
console.log(["transition end", $el]);
});
}
if ($.support.transition && this.$el.hasClass('fade')) {
removeWithAnimation();
} else {
this._open = false;
this.remove();
hide_callback();
}
return false;
}
});

9
media/js/vendor/bootstrapx-clickover.js vendored
View file

@ -39,7 +39,8 @@
this.init( type, element, options );
// setup our own handlers
this.$element.on( 'click', this.options.selector, $.proxy(this.clickery, this) );
// this.$element.on( 'click', this.options.selector, $.proxy(this.clickery, this) );
// REMOVED: Handle click events in NewsBlur's modal view.
// soon add click hanlder to body to close this element
// will need custom handler inside here
@ -152,9 +153,15 @@
case 'bottom':
tp = {top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2}
break
case 'bottom-left':
tp = {top: pos.top + pos.height, left: pos.left}
break
case 'top':
tp = {top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2}
break
case 'top-left':
tp = {top: pos.top - actualHeight, left: pos.left}
break
case 'left':
tp = {top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth}
break

78
media/js/vendor/jquery.newsblur.js vendored
View file

@ -90,6 +90,8 @@ NEWSBLUR.log = function(msg) {
var b = {
left : scrollLeft,
top : scrollTop,
right : $(window).width() - scrollLeft,
bottom : $(window).height() - scrollTop,
width : $(window).width(),
height : $(window).height()
};
@ -99,42 +101,44 @@ NEWSBLUR.log = function(msg) {
var b = {
left : targOff.left,
top : targOff.top,
right : clientWidth - targOff.left,
bottom : clientHeight - targOff.top,
width : target.innerWidth(),
height : target.innerHeight()
};
}
console.log(["target", targOff.top, target.innerHeight(), b.top, b.bottom]);
var elb = {
width : el.innerWidth(),
height : el.innerHeight()
};
var left, top;
var left, top, bottom, right;
if (pos.indexOf('-left') >= 0) {
left = b.left;
} else if (pos.indexOf('left') >= 0) {
left = b.left - elb.width;
} else if (pos.indexOf('-right') >= 0) {
left = b.left + b.width - elb.width;
right = b.right - elb.width;
} else if (pos.indexOf('right') >= 0) {
left = b.left + b.width;
right = b.right;
} else { // Centered.
left = b.left + (b.width - elb.width) / 2;
}
if (pos.indexOf('-top') >= 0) {
top = b.top;
bottom = b.bottom - elb.height;
} else if (pos.indexOf('top') >= 0) {
top = b.top - elb.height;
bottom = b.bottom;
} else if (pos.indexOf('-bottom') >= 0) {
top = b.top + b.height - elb.height;
top = b.top;
} else if (pos.indexOf('bottom') >= 0) {
top = b.top + b.height;
top = b.top - elb.height;
} else { // Centered.
top = b.top + (b.height - elb.height) / 2;
}
console.log(["align", pos.indexOf('bottom') >= 0, bottom, top, b.top, elb.height, b.height]);
var constrain = (pos.indexOf('no-constraint') >= 0) ? false : true;
left += offset.left || 0;
@ -143,6 +147,8 @@ NEWSBLUR.log = function(msg) {
if (constrain) {
left = Math.max(scrollLeft, Math.min(left, scrollLeft + clientWidth - elb.width));
top = Math.max(scrollTop, Math.min(top, scrollTop + clientHeight - elb.height));
// bottom = Math.max(scrollTop, Math.min(bottom, scrollTop + clientHeight - elb.height));
// right = Math.max(scrollTop, Math.min(right, scrollLeft + clientWidth - elb.height));
}
// var offParent;
@ -150,9 +156,59 @@ NEWSBLUR.log = function(msg) {
// left -= offParent.offset().left;
// top -= offParent.offset().top;
// }
$(el).css({position : 'absolute', left : left + 'px', top : top + 'px'});
$(el).css({position : 'absolute'});
if (pos.indexOf('bottom') >= 0) {
$(el).css({top : top + 'px', bottom: 'auto'});
} else {
$(el).css({bottom : bottom + 'px', top: 'auto'});
}
if (pos.indexOf('right') >= 0) {
$(el).css({right : right + 'px', left: 'auto'});
} else {
$(el).css({left : left + 'px', right: 'auto'});
}
return el;
},
// When the next click or keypress happens, anywhere on the screen, hide the
// element. 'clickable' makes the element and its contents clickable without
// hiding. The 'onHide' callback runs when the hide fires, and has a chance
// to cancel it.
autohide : function(options) {
var me = this;
options = _.extend({clickable : null, onHide : null}, options || {});
me._autoignore = true;
setTimeout(function(){ delete me._autoignore; }, 0);
if (!me._autohider) {
me.forceHide = function(e) {
console.log(["forceHide", e]);
if (!e && options.onHide) options.onHide();
me.hide();
$(document).unbind('click', me._autohider);
$(document).unbind('keypress', me._autohider);
$(document).unbind('keyup', me._checkesc);
me._autohider = null;
me._checkesc = null;
me.forceHide = null;
};
me._autohider = function(e) {
if (me._autoignore) return;
if (options.clickable && (me[0] == e.target || _.include($(e.target).parents(), me[0]))) return;
if (options.onHide && !options.onHide(e, _.bind(me.forceHide, me))) return;
me.forceHide(e);
};
me._checkesc = function(e) {
console.log(["keyup", e.keyCode]);
if (e.keyCode == 27) {
options.clickable = false;
me._autohider(e);
}
};
$(document).bind('click', this._autohider);
$(document).bind('keypress', this._autohider);
$(document).bind('keyup', this._checkesc);
}
}
});

82
templates/reader/feeds_skeleton.xhtml
View file

@ -17,12 +17,12 @@
{% endif %}
</div>
<div class="NB-feeds-header-user-name">{{ social_profile.username }}</div>
<div class="NB-feeds-header-user-notifications">
<img src="{{ MEDIA_URL }}/img/circular/header/icon_activity.png">
</div>
<div class="NB-feeds-header-user-dashboard">
<img src="{{ MEDIA_URL }}/img/circular/header/circular_avatar.png">
</div>
<div class="NB-feeds-header-user-notifications">
<img src="{{ MEDIA_URL }}/img/circular/header/icon_activity.png">
</div>
</div>
<div class="NB-feeds-header-dashboard"></div>
<div class="NB-feeds-selector">
@ -110,46 +110,48 @@
</div>
<div class="NB-taskbar-container left-south">
<div class="NB-taskbar">
<div class="NB-callout-ftux NB-callout">
<div class="NB-callout-container">
<div class="NB-callout-text"></div>
<div class="NB-callout-arrow"></div>
</div>
</div>
<ul class="taskbar_nav taskbar_nav_feeds">
<li class="task_button task_button_menu NB-task-add">
<div class="NB-task-button-wrapper">
<div class="task_button_background"></div>
<div class="NB-task-image"></div>
<div class="left-south">
<div class="NB-taskbar-container">
<div class="NB-taskbar">
<div class="NB-callout-ftux NB-callout">
<div class="NB-callout-container">
<div class="NB-callout-text"></div>
<div class="NB-callout-arrow"></div>
</div>
</li>
<li class="task_button task_button_menu NB-task-manage NB-disabled">
<div class="NB-task-button-wrapper">
<div class="task_button_background"></div>
<div class="NB-task-image"></div>
</div>
</li>
</ul>
<div class="NB-taskbar-intelligence">
<div class="NB-intelligence-slider">
<ul class="segmented-control">
<li class="NB-intelligence-slider-control NB-intelligence-slider-red">
All
</li>
<li class="NB-intelligence-slider-control NB-intelligence-slider-yellow">
<img src="{{ MEDIA_URL }}embed/icons/silk/bullet_yellow.png">
<span class="NB-intelligence-label">Unread</span>
</li>
<li class="NB-intelligence-slider-control NB-intelligence-slider-green">
<img src="{{ MEDIA_URL }}embed/icons/silk/bullet_green.png">
<span class="NB-intelligence-label">Focus</span>
</li>
</ul>
</div>
<ul class="taskbar_nav taskbar_nav_feeds">
<li class="task_button task_button_menu NB-task-add">
<div class="NB-task-button-wrapper">
<div class="task_button_background"></div>
<div class="NB-task-image"></div>
</div>
</li>
<li class="task_button task_button_menu NB-task-manage NB-disabled">
<div class="NB-task-button-wrapper">
<div class="task_button_background"></div>
<div class="NB-task-image"></div>
</div>
</li>
</ul>
<div class="NB-taskbar-intelligence">
<div class="NB-intelligence-slider">
<ul class="segmented-control">
<li class="NB-intelligence-slider-control NB-intelligence-slider-red">
All
</li>
<li class="NB-intelligence-slider-control NB-intelligence-slider-yellow">
<img src="{{ MEDIA_URL }}embed/icons/silk/bullet_yellow.png">
<span class="NB-intelligence-label">Unread</span>
</li>
<li class="NB-intelligence-slider-control NB-intelligence-slider-green">
<img src="{{ MEDIA_URL }}embed/icons/silk/bullet_green.png">
<span class="NB-intelligence-label">Focus</span>
</li>
</ul>
</div>
</div>
{# <div class="NB-taskbar-sidebar-toggle-close" title="Hide sidebar (shift + u)"></div> #}
</div>
{# <div class="NB-taskbar-sidebar-toggle-close" title="Hide sidebar (shift + u)"></div> #}
</div>
</div>