diff --git a/browser/components/SideNavFilter.js b/browser/components/SideNavFilter.js index a3fc1ff9..dba26f92 100644 --- a/browser/components/SideNavFilter.js +++ b/browser/components/SideNavFilter.js @@ -41,7 +41,7 @@ const SideNavFilter = ({
@@ -55,7 +55,7 @@ const SideNavFilter = ({
diff --git a/browser/components/TodoListPercentage.js b/browser/components/TodoListPercentage.js index f152130c..3be63ca5 100644 --- a/browser/components/TodoListPercentage.js +++ b/browser/components/TodoListPercentage.js @@ -16,7 +16,9 @@ const TodoListPercentage = ({ }) => (
-

{percentageOfTodo}%

+
+

{percentageOfTodo}%

+
) diff --git a/browser/components/TodoListPercentage.styl b/browser/components/TodoListPercentage.styl index 66fc62ee..7f44fd08 100644 --- a/browser/components/TodoListPercentage.styl +++ b/browser/components/TodoListPercentage.styl @@ -16,17 +16,26 @@ border-radius 2px transition 0.4s cubic-bezier(0.4, 0.4, 0, 1) +.progressBarInner + padding 0 10px + min-width 1px + height 100% + display -webkit-box + display box + justify-content center + align-items center + + .percentageText color #f4f4f4 - padding: 2px 43% font-weight 600 body[data-theme="dark"] .percentageBar - background-color #363A3D + background-color #444444 .progressBar - background-color: alpha(#939395, 50%) + background-color: #1EC38B .percentageText color $ui-dark-text-color \ No newline at end of file diff --git a/browser/main/Detail/InfoButton.styl b/browser/main/Detail/InfoButton.styl index 67618fb3..9a2604df 100644 --- a/browser/main/Detail/InfoButton.styl +++ b/browser/main/Detail/InfoButton.styl @@ -1,7 +1,6 @@ .control-infoButton top 10px - margin-bottom 10px - topBarButtonLight() + topBarButtonRight() .infoButton padding 0px diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js index f4c805c1..6621c4df 100644 --- a/browser/main/Detail/MarkdownNoteDetail.js +++ b/browser/main/Detail/MarkdownNoteDetail.js @@ -233,7 +233,7 @@ class MarkdownNoteDetail extends React.Component { } getToggleLockButton () { - return this.state.isLocked ? '../resources/icon/icon-lock.svg' : '../resources/icon/icon-unlock.svg' + return this.state.isLocked ? '../resources/icon/icon-edit-lock.svg' : '../resources/icon/icon-edit.svg' } handleDeleteKeyDown (e) { @@ -392,8 +392,8 @@ class MarkdownNoteDetail extends React.Component { ) diff --git a/browser/main/Detail/MarkdownNoteDetail.styl b/browser/main/Detail/MarkdownNoteDetail.styl index 22de44dd..b7177303 100644 --- a/browser/main/Detail/MarkdownNoteDetail.styl +++ b/browser/main/Detail/MarkdownNoteDetail.styl @@ -12,9 +12,8 @@ padding-bottom 3px .control-lockButton - top 160px - margin-bottom 10px - topBarButtonLight() + top 150px + topBarButtonRight() .trashed-infopanel top 40px @@ -22,7 +21,7 @@ .control-fullScreenButton top 80px - topBarButtonLight() + topBarButtonRight() .body absolute left right @@ -43,7 +42,7 @@ body[data-theme="dark"] .root background-color $ui-dark-noteDetail-backgroundColor box-shadow none - border none + border-left 1px solid $ui-dark-borderColor .control-lockButton topBarButtonDark() diff --git a/browser/main/Detail/SnippetNoteDetail.styl b/browser/main/Detail/SnippetNoteDetail.styl index df8132a7..948e71af 100644 --- a/browser/main/Detail/SnippetNoteDetail.styl +++ b/browser/main/Detail/SnippetNoteDetail.styl @@ -69,7 +69,7 @@ .control-fullScreenButton top 80px margin-bottom 10px - topBarButtonLight() + topBarButtonRight() body[data-theme="white"] .root diff --git a/browser/main/Detail/StarButton.styl b/browser/main/Detail/StarButton.styl index b1880a8e..1e5bf239 100644 --- a/browser/main/Detail/StarButton.styl +++ b/browser/main/Detail/StarButton.styl @@ -1,6 +1,6 @@ .root top 45px - topBarButtonLight() + topBarButtonRight() &:hover transition 0.2s color alpha($ui-favorite-star-button-color, 0.6) diff --git a/browser/main/Detail/TrashButton.styl b/browser/main/Detail/TrashButton.styl index b1edbb5f..0acd60a5 100644 --- a/browser/main/Detail/TrashButton.styl +++ b/browser/main/Detail/TrashButton.styl @@ -1,11 +1,10 @@ .control-trashButton - top 120px - margin-bottom 10px - topBarButtonLight() + top 115px + topBarButtonRight() .control-trashButton--in-trash top 60px - topBarButtonLight() + topBarButtonRight() .trashButton padding 0px diff --git a/browser/main/SideNav/SideNav.styl b/browser/main/SideNav/SideNav.styl index 607a3f22..45e5ae94 100644 --- a/browser/main/SideNav/SideNav.styl +++ b/browser/main/SideNav/SideNav.styl @@ -138,7 +138,7 @@ body[data-theme="white"] body[data-theme="dark"] .root, .root--folded - border-color $ui-dark-borderColor + border-right 1px solid $ui-dark-borderColor background-color $ui-dark-backgroundColor color $ui-dark-text-color diff --git a/browser/styles/index.styl b/browser/styles/index.styl index 2c3381ac..03f125b0 100644 --- a/browser/styles/index.styl +++ b/browser/styles/index.styl @@ -174,20 +174,20 @@ modal() overflow hidden border-radius $modal-border-radius -topBarButtonLight() +topBarButtonRight() position absolute width 34px height 34px border-radius 17px font-size 14px border none - color alpha($ui-button-color, 0.4) + color alpha($ui-button-color, 0.2) fill $ui-button-color background-color transparent &:active border-color $ui-button--active-backgroundColor &:hover - transform scale(1.1) + // transform scale(1.1) transition 0.4s color $ui-button-color .control-lockButton-tooltip @@ -223,10 +223,12 @@ $ui-button--focus-borderColor = lighten(#369DCD, 25%) /******* Dark theme ********/ $ui-dark-active-color = #3A404C -$ui-dark-borderColor = lighten(#21252B, 20%) -$ui-dark-backgroundColor = #1E2124 -$ui-dark-noteList-backgroundColor = #282C30 -$ui-dark-noteDetail-backgroundColor = #2D3033 + +$ui-dark-borderColor = #444444 +$ui-dark-backgroundColor = #2C3033 +$ui-dark-noteList-backgroundColor = #2C3033 +$ui-dark-noteDetail-backgroundColor = #2C3033 + $ui-dark-tag-backgroundColor = #3A404C $dark-background-color = lighten($ui-dark-backgroundColor, 10%) $ui-dark-text-color = #DDDDDD diff --git a/resources/icon/icon-edit-lock.svg b/resources/icon/icon-edit-lock.svg new file mode 100644 index 00000000..12ede4cc --- /dev/null +++ b/resources/icon/icon-edit-lock.svg @@ -0,0 +1,13 @@ + + + + icon-edit-lock + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/resources/icon/icon-edit.svg b/resources/icon/icon-edit.svg new file mode 100644 index 00000000..3707c6fe --- /dev/null +++ b/resources/icon/icon-edit.svg @@ -0,0 +1,13 @@ + + + + icon-edit + Created with Sketch. + + + + + + + + \ No newline at end of file diff --git a/resources/icon/icon-info-24.svg b/resources/icon/icon-info-24.svg deleted file mode 100644 index 28b2afb5..00000000 --- a/resources/icon/icon-info-24.svg +++ /dev/null @@ -1,19 +0,0 @@ - - - - icon-info-24 - Created with Sketch. - - - - - - - - - - - - - - \ No newline at end of file diff --git a/resources/icon/icon-info.svg b/resources/icon/icon-info.svg index b7ac5bb1..253b8cab 100644 --- a/resources/icon/icon-info.svg +++ b/resources/icon/icon-info.svg @@ -8,10 +8,10 @@ - - - - + + + + diff --git a/resources/icon/icon-sidebar-24.svg b/resources/icon/icon-sidebar-24.svg deleted file mode 100644 index efdc3ebb..00000000 --- a/resources/icon/icon-sidebar-24.svg +++ /dev/null @@ -1,18 +0,0 @@ - - - - icon-sidebar-24 - Created with Sketch. - - - - - - - - - - - - - \ No newline at end of file diff --git a/resources/icon/icon-sidebar.svg b/resources/icon/icon-sidebar.svg index 26f2be2a..da4a0926 100644 --- a/resources/icon/icon-sidebar.svg +++ b/resources/icon/icon-sidebar.svg @@ -8,7 +8,7 @@ - + diff --git a/resources/icon/icon-star-24.svg b/resources/icon/icon-star-24.svg deleted file mode 100644 index 40b9bf45..00000000 --- a/resources/icon/icon-star-24.svg +++ /dev/null @@ -1,18 +0,0 @@ - - - - icon-star-24 - Created with Sketch. - - - - - - - - - - - - - \ No newline at end of file diff --git a/resources/icon/icon-star-sidenav.svg b/resources/icon/icon-star-sidenav.svg new file mode 100644 index 00000000..932f4d66 --- /dev/null +++ b/resources/icon/icon-star-sidenav.svg @@ -0,0 +1,20 @@ + + + + icon-star-sidenav + Created with Sketch. + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/resources/icon/icon-star.svg b/resources/icon/icon-star.svg index c9a6d84b..da4abb3d 100644 --- a/resources/icon/icon-star.svg +++ b/resources/icon/icon-star.svg @@ -1,20 +1,16 @@ - + icon-star Created with Sketch. - - - - - - - - - - - + + + + + + + diff --git a/resources/icon/icon-starred-24.svg b/resources/icon/icon-starred-24.svg deleted file mode 100644 index 3e44a3e2..00000000 --- a/resources/icon/icon-starred-24.svg +++ /dev/null @@ -1,18 +0,0 @@ - - - - icon-starred-24 - Created with Sketch. - - - - - - - - - - - - - \ No newline at end of file diff --git a/resources/icon/icon-trash-24.svg b/resources/icon/icon-trash-24.svg deleted file mode 100644 index a72ff7da..00000000 --- a/resources/icon/icon-trash-24.svg +++ /dev/null @@ -1,18 +0,0 @@ - - - - icon-trash-24 - Created with Sketch. - - - - - - - - - - - - - \ No newline at end of file diff --git a/resources/icon/icon-trash-sidenav.svg b/resources/icon/icon-trash-sidenav.svg new file mode 100644 index 00000000..ba87033b --- /dev/null +++ b/resources/icon/icon-trash-sidenav.svg @@ -0,0 +1,16 @@ + + + + icon-trash-sidenav + Created with Sketch. + + + + + + + + + + + \ No newline at end of file diff --git a/resources/icon/icon-trash.svg b/resources/icon/icon-trash.svg index 431972bd..64dedb87 100644 --- a/resources/icon/icon-trash.svg +++ b/resources/icon/icon-trash.svg @@ -5,10 +5,10 @@ Created with Sketch. - - - - + + + + diff --git a/resources/icon/icon-unlock.svg b/resources/icon/icon-unlock.svg index 75503cfb..0e20453f 100644 --- a/resources/icon/icon-unlock.svg +++ b/resources/icon/icon-unlock.svg @@ -8,7 +8,7 @@ - + diff --git a/resources/icon/info.svg b/resources/icon/info.svg deleted file mode 100644 index d724468b..00000000 --- a/resources/icon/info.svg +++ /dev/null @@ -1,18 +0,0 @@ - - - - info - Created with Sketch. - - - - - - - - - - - - - \ No newline at end of file