diff --git a/media/css/reader/modals.css b/media/css/reader/modals.css index 319f3b949..787b6dedc 100644 --- a/media/css/reader/modals.css +++ b/media/css/reader/modals.css @@ -273,6 +273,7 @@ fieldset legend { background: #DCDCDC; background: linear-gradient(to top, #DCDCDC, #D2D2D2); border-radius: 3px; + border: none; } .NB-modal-submit-green { diff --git a/media/css/reader/reader.css b/media/css/reader/reader.css index 401ff2a3c..a31cbb309 100644 --- a/media/css/reader/reader.css +++ b/media/css/reader/reader.css @@ -1454,13 +1454,14 @@ img.feed_favicon { padding: 0 0 0 38px; } .NB-feedbar .NB-feedbar-statistics { - background: transparent url("/media/embed/icons/circular/menu_icn_stats.png") no-repeat center center; + background: transparent url('/media/embed/icons/nouns/dialog-statistics.svg') no-repeat 0 0; background-size: 16px; width: 16px; height: 16px; cursor: pointer; margin:3px 0 0 -6px; padding:0 24px 0 6px; + filter: hue-rotate(284deg) saturate(18); } .NB-feedbar .NB-feedbar-mark-feed-read-container { @@ -5481,7 +5482,8 @@ background: transparent; } .NB-taskbar-options-popover-font-icon { - background: transparent url("/media/embed/icons/circular/menu_icn_settings.png") no-repeat center center; + background: transparent url('/media/embed/icons/nouns/settings.svg') no-repeat 0 0; + background-size: 16px; } .NB-filter-popover .segmented-control.NB-options-feed-size li, @@ -7166,8 +7168,8 @@ form.opml_import_form input { } .NB-account .NB-module .NB-module-account-settings { - background: transparent url("/media/embed/icons/circular/menu_icn_settings.png") no-repeat center center; - background-size: 12px; + background: transparent url('/media/embed/icons/nouns/settings.svg') no-repeat 0 0; + background-size: 16px; width: 16px; height: 16px; float: right; @@ -7332,7 +7334,9 @@ form.opml_import_form input { background: #fff url(/media/embed/icons/silk/flag_yellow.png) no-repeat center center; } .NB-module-gettingstarted .NB-intro-progress-goal.NB-done { - background: #fff url(/media/embed/icons/silk/accept.png) no-repeat center center; + background: transparent url('/media/embed/icons/nouns/accept.svg') no-repeat 0 0; + background-size: 16px; + filter: hue-rotate(20deg) saturate(18); } .NB-module-gettingstarted .NB-intro-goals { margin: 24px 0 0; @@ -7859,8 +7863,9 @@ form.opml_import_form input { width: 16px; height: 16px; cursor: pointer; - background: transparent url("/media/embed/icons/circular/menu_icn_stats.png") no-repeat center center; + background: transparent url('/media/embed/icons/nouns/dialog-statistics.svg') no-repeat 0 0; background-size: 16px; + filter: hue-rotate(284deg) saturate(18); } .NB-module-recommended .NB-recommended-favicon { width: 16px; @@ -8155,16 +8160,18 @@ form.opml_import_form input { } .NB-menu-manage .NB-menu-manage-feed-settings .NB-menu-manage-image, .NB-menu-manage .NB-menu-manage-folder-settings .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/menu_icn_settings.png') no-repeat 0 0; + background: transparent url('/media/embed/icons/nouns/settings.svg') no-repeat 0 0; background-size: 18px; } .NB-menu-manage .NB-menu-manage-feed-reload .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/menu_icn_fetch.png') no-repeat 0 0; + background: transparent url('/media/embed/icons/nouns/boomerang.svg') no-repeat 0 0; background-size: 18px; + filter: hue-rotate(320deg) saturate(16.5); } .NB-menu-manage .NB-menu-manage-feed-stats .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/menu_icn_stats.png') no-repeat 0 0; + background: transparent url('/media/embed/icons/nouns/dialog-statistics.svg') no-repeat 0 0; background-size: 18px; + filter: hue-rotate(284deg) saturate(18); } .NB-menu-manage .NB-menu-manage-mark-read .NB-menu-manage-image { background: transparent url("/media/embed/icons/nouns/mark-read.svg") no-repeat center center; @@ -8172,12 +8179,12 @@ form.opml_import_form input { filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-folder-subscribe .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/nav_icn_add.png') no-repeat 0 0; - background-size: 18px; + background: transparent url('/media/embed/icons/nouns/add.svg') no-repeat 0 0; + background-size: 16px; } .NB-menu-manage .NB-menu-manage-folder-subfolder .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/menu_icn_move.png') no-repeat 0 0; - background-size: 18px; + background: transparent url('/media/embed/icons/nouns/folder-open.svg') no-repeat 0 0; + background-size: 16px; } .NB-menu-manage .NB-menu-manage-social-profile .NB-menu-manage-image { background: transparent url('/media/embed/icons/nouns/subscribers.svg') no-repeat 0 0; @@ -8201,11 +8208,13 @@ form.opml_import_form input { .NB-menu-manage .NB-menu-manage-delete .NB-menu-manage-image, .NB-menu-manage .NB-menu-manage-delete-search .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/menu_icn_delete.png') no-repeat 0 0; + background: transparent url('/media/embed/icons/nouns/delete.svg') no-repeat 0 0; background-size: 18px; } .NB-menu-manage .NB-menu-manage-delete.NB-menu-manage-feed-delete-cancel .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/arrow_rotate_clockwise.png') no-repeat 0 1px; + background: transparent url('/media/embed/icons/nouns/cancel.svg') no-repeat 0 0; + background-size: 18px; + filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-delete-confirm .NB-menu-manage-image { background: transparent url('/media/embed/icons/circular/exclamation.png') no-repeat 0 1px; @@ -8213,14 +8222,18 @@ form.opml_import_form input { font-weight: bold; } .NB-menu-manage .NB-menu-manage-move .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/menu_icn_move.png') no-repeat 0 0; - background-size: 18px; + background: transparent url('/media/embed/icons/nouns/folder-closed.svg') no-repeat 0 0; + background-size: 16px; } .NB-menu-manage .NB-menu-manage-move.NB-active .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/accept.png') no-repeat 0 2px; + background: transparent url('/media/embed/icons/nouns/accept.svg') no-repeat 0 0; + background-size: 16px; + filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-move.NB-menu-manage-feed-move-cancel .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/arrow_rotate_clockwise.png') no-repeat 0 1px; + background: transparent url('/media/embed/icons/nouns/cancel.svg') no-repeat 0 0; + background-size: 18px; + filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-mute .NB-menu-manage-image, .NB-menu-manage .NB-menu-manage-unmute .NB-menu-manage-image { @@ -8228,24 +8241,32 @@ form.opml_import_form input { background-size: 18px; } .NB-menu-manage .NB-menu-manage-rename .NB-menu-manage-image { - background: transparent url('/media/embed/icons/circular/menu_icn_rename.png') no-repeat 0 0; + background: transparent url('/media/embed/icons/nouns/rename.svg') no-repeat 0 0; background-size: 18px; } .NB-menu-manage .NB-menu-manage-rename.NB-active .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/accept.png') no-repeat 0 2px; + background: transparent url('/media/embed/icons/nouns/accept.svg') no-repeat 0 0; + background-size: 16px; + filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-rename.NB-menu-manage-feed-rename-cancel .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/arrow_rotate_clockwise.png') no-repeat 0 1px; + background: transparent url('/media/embed/icons/nouns/cancel.svg') no-repeat 0 0; + background-size: 18px; + filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-story-share .NB-menu-manage-image { background: transparent url('/media/embed/icons/nouns/share.svg') no-repeat 0 2px; background-size: 16px; } .NB-menu-manage .NB-menu-manage-story-share.NB-active .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/accept.png') no-repeat 0 2px; + background: transparent url('/media/embed/icons/nouns/accept.svg') no-repeat 0 0; + background-size: 16px; + filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-story-share.NB-menu-manage-story-share-cancel .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/arrow_rotate_clockwise.png') no-repeat 0 1px; + background: transparent url('/media/embed/icons/nouns/cancel.svg') no-repeat 0 0; + background-size: 18px; + filter: hue-rotate(20deg) saturate(18); } .NB-menu-manage .NB-menu-manage-confirm .NB-menu-manage-image { background: transparent url('/media/embed/icons/nouns/right.svg') no-repeat 4px 3px; @@ -8422,6 +8443,11 @@ form.opml_import_form input { background-size: 18px; filter: hue-rotate(186deg) saturate(18); } +.NB-menu-manage .NB-menu-manage-statistics .NB-menu-manage-image { + background: transparent url("/media/embed/icons/nouns/dialog-statistics.svg") no-repeat center center; + background-size: 18px; + filter: hue-rotate(284deg) saturate(18); +} .NB-menu-manage .NB-menu-manage-newsletters .NB-menu-manage-image { background: transparent url("/media/embed/icons/nouns/email.svg") no-repeat center center; background-size: 18px; @@ -8532,8 +8558,9 @@ form.opml_import_form input { background-size: 18px; } .NB-menu-manage .NB-menu-manage-story-thirdparty .NB-menu-manage-image { - background: transparent url('/media/embed/reader/sendto.png') no-repeat 0 0; + background: transparent url('/media/embed/icons/nouns/sendto.svg') no-repeat 0 0; background-size: 16px; + filter: hue-rotate(338deg) saturate(18); } .NB-menu-manage .NB-menu-manage-story-thirdparty .NB-menu-manage-thirdparty-icon { width: 16px; @@ -8674,7 +8701,9 @@ form.opml_import_form input { background-size: 16px; } .NB-menu-manage .NB-menu-manage-story-open .NB-menu-manage-image { - background: transparent url('/media/embed/icons/silk/house.png') no-repeat 0 1px; + background: transparent url('/media/embed/icons/nouns/link.svg') no-repeat 0 0; + background-size: 16px; + filter: hue-rotate(168deg) saturate(18); } .NB-menu-manage.NB-story-starred .NB-menu-manage-story-star .NB-menu-manage-image { background: transparent url('/media/embed/icons/nouns/saved-stories.svg') no-repeat 0 0; @@ -8722,6 +8751,11 @@ form.opml_import_form input { .NB-modal-statistics { } +.NB-modal-statistics .NB-modal-title .NB-icon { + background: transparent url("/media/embed/icons/nouns/dialog-statistics.svg") no-repeat center center; + background-size: 28px; + filter: hue-rotate(284deg) saturate(18); +} .NB-modal-statistics .NB-statistics-stat { border: 1px solid #e6e6e6; clear: both; @@ -13593,10 +13627,13 @@ form.opml_import_form input { color: #6F716A; } .NB-filter-popover-stats-icon { - background: transparent url('/media/embed/icons/circular/menu_icn_stats.png') no-repeat center center; + background: transparent url('/media/embed/icons/nouns/dialog-statistics.svg') no-repeat 0 0; + background-size: 32px; + filter: hue-rotate(284deg) saturate(18); } .NB-filter-popover-filter-icon { - background: transparent url("/media/embed/icons/circular/menu_icn_settings.png") no-repeat center center; + background: transparent url('/media/embed/icons/nouns/settings.svg') no-repeat 0 0; + background-size: 32px; } .NB-filter-popover-notifications-icon { background: transparent url("/media/embed/icons/nouns/dialog-notifications.svg") no-repeat center center; @@ -13947,8 +13984,9 @@ form.opml_import_form input { width: 16px; height: 16px; cursor: pointer; - background: transparent url("/media/embed/icons/circular/menu_icn_stats.png") no-repeat center center; + background: transparent url('/media/embed/icons/nouns/dialog-statistics.svg') no-repeat 0 0; background-size: 16px; + filter: hue-rotate(284deg) saturate(18); } .NB-feed-badge .NB-feed-badge-stats { position: relative; diff --git a/media/img/icons/nouns/accept.svg b/media/img/icons/nouns/accept.svg new file mode 100644 index 000000000..c8ea94c8f --- /dev/null +++ b/media/img/icons/nouns/accept.svg @@ -0,0 +1,9 @@ + + + accept + + + + + + \ No newline at end of file diff --git a/media/img/icons/nouns/cancel.svg b/media/img/icons/nouns/cancel.svg new file mode 100644 index 000000000..c04ada7f9 --- /dev/null +++ b/media/img/icons/nouns/cancel.svg @@ -0,0 +1,9 @@ + + + cancel + + + + + + \ No newline at end of file diff --git a/media/img/icons/nouns/delete.svg b/media/img/icons/nouns/delete.svg new file mode 100644 index 000000000..baf32d875 --- /dev/null +++ b/media/img/icons/nouns/delete.svg @@ -0,0 +1,9 @@ + + + delete + + + + + + \ No newline at end of file diff --git a/media/img/icons/nouns/dialog-statistics.svg b/media/img/icons/nouns/dialog-statistics.svg new file mode 100644 index 000000000..eeb81ffcb --- /dev/null +++ b/media/img/icons/nouns/dialog-statistics.svg @@ -0,0 +1,9 @@ + + + dialog-statistics + + + + + + \ No newline at end of file diff --git a/media/img/icons/nouns/link.svg b/media/img/icons/nouns/link.svg new file mode 100644 index 000000000..7cb104fd9 --- /dev/null +++ b/media/img/icons/nouns/link.svg @@ -0,0 +1,9 @@ + + + link + + + + + + \ No newline at end of file diff --git a/media/img/icons/nouns/rename.svg b/media/img/icons/nouns/rename.svg new file mode 100644 index 000000000..7ae962d47 --- /dev/null +++ b/media/img/icons/nouns/rename.svg @@ -0,0 +1,9 @@ + + + rename + + + + + + \ No newline at end of file diff --git a/media/img/icons/nouns/sendto.svg b/media/img/icons/nouns/sendto.svg new file mode 100644 index 000000000..debba15b2 --- /dev/null +++ b/media/img/icons/nouns/sendto.svg @@ -0,0 +1,10 @@ + + + sendto + + + + + + + \ No newline at end of file diff --git a/media/img/icons/nouns/share 2.svg b/media/img/icons/nouns/share 2.svg new file mode 100644 index 000000000..94e7d570d --- /dev/null +++ b/media/img/icons/nouns/share 2.svg @@ -0,0 +1,10 @@ + + + share 2 + + + + + + + \ No newline at end of file diff --git a/media/img/originals/Nouns.sketch b/media/img/originals/Nouns.sketch index d5bf6a69b..a9ded602e 100644 Binary files a/media/img/originals/Nouns.sketch and b/media/img/originals/Nouns.sketch differ diff --git a/media/js/newsblur/reader/reader.js b/media/js/newsblur/reader/reader.js index cc92f3902..9135ed3d7 100644 --- a/media/js/newsblur/reader/reader.js +++ b/media/js/newsblur/reader/reader.js @@ -3520,6 +3520,10 @@ $.make('div', { className: 'NB-menu-manage-image' }), $.make('div', { className: 'NB-menu-manage-title' }, 'Goodies & Mobile Apps') ]), + $.make('li', { className: 'NB-menu-item NB-menu-manage-statistics', role: "button" }, [ + $.make('div', { className: 'NB-menu-manage-image' }), + $.make('div', { className: 'NB-menu-manage-title' }, 'Statistics & History') + ]), $.make('li', { className: 'NB-menu-item NB-menu-manage-notifications', role: "button" }, [ $.make('div', { className: 'NB-menu-manage-image' }), $.make('div', { className: 'NB-menu-manage-title' }, 'Notifications') @@ -6452,6 +6456,14 @@ }); } }); + $.targetIs(e, { tagSelector: '.NB-menu-manage-statistics' }, function($t, $p){ + e.preventDefault(); + if (!$t.hasClass('NB-disabled')) { + $.modal.close(function() { + self.open_feed_statistics_modal(); + }); + } + }); $.targetIs(e, { tagSelector: '.NB-menu-manage-notifications' }, function($t, $p){ e.preventDefault(); if (!$t.hasClass('NB-disabled')) { diff --git a/media/js/newsblur/reader/reader_statistics.js b/media/js/newsblur/reader/reader_statistics.js index cb5b0edb5..4a203af69 100644 --- a/media/js/newsblur/reader/reader_statistics.js +++ b/media/js/newsblur/reader/reader_statistics.js @@ -1,10 +1,14 @@ NEWSBLUR.ReaderStatistics = function(feed_id, options) { var defaults = { - embedded: false + embedded: false, + width: 700 }; this.options = $.extend({}, defaults, options); this.model = NEWSBLUR.assets; + if (!feed_id) { + feed_id = NEWSBLUR.assets.feeds.first().id; + } this.feed_id = feed_id; if (this.options.embedded) { this.feed = NEWSBLUR.stats_feed; @@ -47,7 +51,11 @@ _.extend(NEWSBLUR.ReaderStatistics.prototype, { this.make_feed_chooser({skip_starred: true, feed_id: this.feed.id}) ])), $.make('div', { className: 'NB-modal-loading' }), - (!this.options.embedded && $.make('h2', { className: 'NB-modal-title' }, 'Statistics & History')), + (!this.options.embedded && $.make('h2', { className: 'NB-modal-title' }, [ + $.make('div', { className: 'NB-icon' }), + 'Statistics & History', + $.make('div', { className: 'NB-icon-dropdown' }) + ])), $.make('h2', { className: 'NB-modal-subtitle' }, [ $.make('img', { className: 'NB-modal-feed-image feed_favicon', src: $.favicon(this.feed) }), $.make('div', { className: 'NB-modal-feed-heading' }, [ diff --git a/templates/reader/manage_module.xhtml b/templates/reader/manage_module.xhtml index b314aeb9a..38e8b800a 100644 --- a/templates/reader/manage_module.xhtml +++ b/templates/reader/manage_module.xhtml @@ -100,6 +100,12 @@ Goodies & Apps +
  • +
    +
    + Statistics & History +
    +