rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

notes list scroll css fix

Browse Source
This commit is contained in:
Mo Bitar
2017-01-31 10:59:50 -06:00
parent b74d709f4d
commit 69b636f2b4
4 changed files with 28 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/app/services/directives/functional/infiniteScroll.js
View File

@@ -2,8 +2,8 @@ angular.module('app.frontend').directive('infiniteScroll', [
'$rootScope', '$window', '$timeout', function($rootScope, $window, $timeout) { '$rootScope', '$window', '$timeout', function($rootScope, $window, $timeout) {
return { return {
link: function(scope, elem, attrs) { link: function(scope, elem, attrs) {
elem.css('overflow-x', 'hidden'); // elem.css('overflow-x', 'hidden');
elem.css('height', 'inherit'); // elem.css('height', 'inherit');
var offset = parseInt(attrs.threshold) || 0; var offset = parseInt(attrs.threshold) || 0;
var e = elem[0] var e = elem[0]

7
app/assets/stylesheets/app/_main.scss
View File

@@ -145,12 +145,17 @@ $section-header-height: 70px;
height: 100%; height: 100%;
max-height: calc(100vh - #{$header-height}); max-height: calc(100vh - #{$header-height});
float: left; float: left;
overflow-y: auto; overflow-y: auto;;
overflow-x: hidden; overflow-x: hidden;
min-width: 0; min-width: 0;
font-size: 17px; font-size: 17px;
.scrollable {
overflow-y: auto;
overflow-x: hidden;
}
> .content { > .content {
height: 100%; height: 100%;
max-height: 100%; max-height: 100%;

11
app/assets/stylesheets/app/_notes.scss
View File

@@ -2,6 +2,8 @@
width: 25%; width: 25%;
border-left: 1px solid #dddddd; border-left: 1px solid #dddddd;
border-right: 1px solid #dddddd; border-right: 1px solid #dddddd;
// overflow-y: hidden !important;
// height: calc(100vh - 130px) !important;
.notes-title-bar { .notes-title-bar {
color: rgba(black, 0.40); color: rgba(black, 0.40);
@@ -39,6 +41,15 @@
} }
} }
.scrollable {
height: calc(100vh - (130px + #{$header-height}));
}
.infinite-scroll {
overflow-x: hidden;
height: inherit;
}
.note { .note {
width: 100%; width: 100%;
padding: 15px; padding: 15px;

17
app/assets/templates/frontend/notes.html.haml
View File

@@ -18,11 +18,12 @@
%li %li
%a.text{"ng-click" => "ctrl.selectedMenuItem(); ctrl.selectedTagDelete()"} Delete Tag %a.text{"ng-click" => "ctrl.selectedMenuItem(); ctrl.selectedTagDelete()"} Delete Tag
%div{"infinite-scroll" => "ctrl.paginate()", "can-load" => "true", "threshold" => "200"} .scrollable
.note{"ng-repeat" => "note in ctrl.tag.notes | limitTo:ctrl.notesToDisplay | filter: ctrl.filterNotes", .infinite-scroll{"infinite-scroll" => "ctrl.paginate()", "can-load" => "true", "threshold" => "200"}
"ng-click" => "ctrl.selectNote(note)", "ng-class" => "{'selected' : ctrl.selectedNote == note}"} .note{"ng-repeat" => "note in ctrl.tag.notes | limitTo:ctrl.notesToDisplay | filter: ctrl.filterNotes",
.name{"ng-if" => "note.title"} "ng-click" => "ctrl.selectNote(note)", "ng-class" => "{'selected' : ctrl.selectedNote == note}"}
{{note.title}} .name{"ng-if" => "note.title"}
.note-preview {{note.title}}
{{note.text}} .note-preview
.date {{(note.created_at | appDateTime) || 'Now'}} {{note.text}}
.date {{(note.created_at | appDateTime) || 'Now'}}