From 205451a31d214268af13d4e0ebaa13f55d49e701 Mon Sep 17 00:00:00 2001 From: William Grant Date: Sat, 22 Sep 2018 17:17:22 +0200 Subject: [PATCH 01/42] initial work for dracula theme done --- browser/components/MarkdownPreview.js | 1 + browser/components/NoteItem.styl | 73 +++++++++++++ browser/components/NoteItemSimple.styl | 66 +++++++++++- browser/components/RealtimeNotification.styl | 23 +++- browser/components/SideNavFilter.styl | 44 +++++++- browser/components/SnippetTab.styl | 46 +++++++- browser/components/StorageItem.styl | 21 +++- browser/components/TodoListPercentage.styl | 14 ++- browser/components/markdown.styl | 31 +++++- browser/components/render/MermaidRender.js | 6 +- browser/main/Detail/Detail.styl | 9 +- browser/main/Detail/FolderSelect.styl | 30 +++++- browser/main/Detail/InfoPanel.styl | 40 +++++++ browser/main/Detail/MarkdownNoteDetail.styl | 5 + browser/main/Detail/NoteDetailInfo.styl | 9 +- browser/main/Detail/SnippetNoteDetail.styl | 19 +++- browser/main/Detail/TagSelect.styl | 13 ++- browser/main/Detail/ToggleModeButton.styl | 7 ++ browser/main/Main.js | 2 +- browser/main/NewNoteButton/NewNoteButton.styl | 4 + browser/main/NoteList/NoteList.styl | 28 ++++- browser/main/SideNav/SideNav.styl | 7 +- browser/main/StatusBar/StatusBar.styl | 13 ++- browser/main/TopBar/TopBar.styl | 22 ++++ browser/main/global.styl | 9 ++ browser/main/lib/ConfigManager.js | 2 + browser/main/modals/CreateFolderModal.styl | 26 +++++ browser/main/modals/NewNoteModal.styl | 17 +++ .../modals/PreferencesModal/ConfigTab.styl | 53 ++++++++-- .../modals/PreferencesModal/Crowdfunding.styl | 8 +- .../modals/PreferencesModal/FolderItem.styl | 23 ++++ .../main/modals/PreferencesModal/InfoTab.styl | 9 +- .../PreferencesModal/PreferencesModal.styl | 26 ++++- .../modals/PreferencesModal/SnippetTab.styl | 16 +++ .../modals/PreferencesModal/StoragesTab.styl | 40 ++++++- browser/main/modals/PreferencesModal/UiTab.js | 1 + browser/styles/Detail/TagSelect.styl | 47 +++++--- browser/styles/index.styl | 26 +++++ yarn.lock | 100 +++++++++++++++++- 39 files changed, 879 insertions(+), 57 deletions(-) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index 5376a773..82285e08 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -397,6 +397,7 @@ export default class MarkdownPreview extends React.Component { case 'dark': case 'solarized-dark': case 'monokai': + case 'dracula': return scrollBarDarkStyle default: return scrollBarStyle diff --git a/browser/components/NoteItem.styl b/browser/components/NoteItem.styl index 017ef6d0..9a1cdbf2 100644 --- a/browser/components/NoteItem.styl +++ b/browser/components/NoteItem.styl @@ -394,3 +394,76 @@ body[data-theme="monokai"] .item-bottom-tagList-empty color $ui-inactive-text-color vertical-align middle + +body[data-theme="dracula"] + .root + border-color $ui-dracula-borderColor + background-color $ui-dracula-noteList-backgroundColor + + .item + border-color $ui-dracula-borderColor + background-color $ui-dracula-noteList-backgroundColor + &:hover + transition 0.15s + // background-color alpha($ui-dracula-noteList-backgroundColor, 20%) + color $ui-dracula-text-color + .item-title + .item-title-icon + .item-bottom-time + transition 0.15s + color $ui-dracula-text-color + .item-bottom-tagList-item + transition 0.15s + background-color alpha($ui-dracula-noteList-backgroundColor, 20%) + color $ui-dracula-text-color + &:active + transition 0.15s + background-color $ui-dracula-noteList-backgroundColor + color $ui-dracula-text-color + .item-title + .item-title-icon + .item-bottom-time + transition 0.15s + color $ui-dracula-text-color + .item-bottom-tagList-item + transition 0.15s + background-color alpha($ui-dracula-noteList-backgroundColor, 10%) + color $ui-dracula-text-color + + .item-wrapper + border-color alpha($ui-dracula-button-backgroundColor, 60%) + + .item--active + border-color $ui-dracula-borderColor + background-color $ui-dracula-button-backgroundColor + .item-wrapper + border-color transparent + .item-title + .item-title-icon + .item-bottom-time + color $ui-dracula-text-color + .item-bottom-tagList-item + background-color alpha(#f8f8f2, 10%) + color $ui-dracula-text-color + &:hover + // background-color alpha($ui-dracula-button--active-backgroundColor, 60%) + color #ff79c6 + .item-bottom-tagList-item + background-color alpha(#f8f8f2, 20%) + + .item-title + color $ui-inactive-text-color + + .item-title-icon + color $ui-inactive-text-color + + .item-title-empty + color $ui-inactive-text-color + + .item-bottom-tagList-item + background-color alpha($ui-dark-button--active-backgroundColor, 40%) + color $ui-inactive-text-color + + .item-bottom-tagList-empty + color $ui-inactive-text-color + vertical-align middle \ No newline at end of file diff --git a/browser/components/NoteItemSimple.styl b/browser/components/NoteItemSimple.styl index 04f57fdc..70b74be7 100644 --- a/browser/components/NoteItemSimple.styl +++ b/browser/components/NoteItemSimple.styl @@ -240,7 +240,7 @@ body[data-theme="monokai"] .item-simple-title-icon .item-simple-bottom-time transition 0.15s - color $ui-solarized-dark-text-color + color $ui-monokai-text-color .item-simple-bottom-tagList-item transition 0.15s background-color alpha(#fff, 20%) @@ -286,3 +286,67 @@ body[data-theme="monokai"] .item-simple-right-storageName padding-left 4px opacity 0.4 + +body[data-theme="dracula"] + .root + border-color $ui-dracula-borderColor + background-color $ui-dracula-noteList-backgroundColor + + .item-simple + border-color $ui-dracula-borderColor + background-color $ui-dracula-noteList-backgroundColor + &:hover + transition 0.15s + background-color alpha($ui-dracula-button-backgroundColor, 60%) + color $ui-dracula-text-color + .item-simple-title + .item-simple-title-empty + .item-simple-title-icon + .item-simple-bottom-time + transition 0.15s + color $ui-dracula-text-color + .item-simple-bottom-tagList-item + transition 0.15s + background-color alpha(#f8f8f2, 20%) + color $ui-dracula-text-color + &:active + transition 0.15s + background-color $ui-dracula-button--active-backgroundColor + color $ui-dracula-text-color + .item-simple-title + .item-simple-title-empty + .item-simple-title-icon + .item-simple-bottom-time + transition 0.15s + color $ui-dracula-text-color + .item-simple-bottom-tagList-item + transition 0.15s + background-color alpha(#f8f8f2, 10%) + color $ui-dracula-text-color + + .item-simple--active + border-color $ui-dracula-borderColor + background-color $ui-dracula-button--active-backgroundColor + .item-simple-wrapper + border-color transparent + .item-simple-title + .item-simple-title-empty + .item-simple-title-icon + .item-simple-bottom-time + color $ui-dracula-text-color + .item-simple-bottom-tagList-item + background-color alpha(#f8f8f2, 10%) + color $ui-dracula-text-color + &:hover + // background-color alpha($ui-dark-button--active-backgroundColor, 60%) + color #c0392b + .item-simple-bottom-tagList-item + background-color alpha(#f8f8f2, 20%) + .item-simple-title + color $ui-dark-text-color + border-bottom $ui-dark-borderColor + .item-simple-right + float right + .item-simple-right-storageName + padding-left 4px + opacity 0.4 \ No newline at end of file diff --git a/browser/components/RealtimeNotification.styl b/browser/components/RealtimeNotification.styl index 0365d8c9..203cc287 100644 --- a/browser/components/RealtimeNotification.styl +++ b/browser/components/RealtimeNotification.styl @@ -51,4 +51,25 @@ body[data-theme="monokai"] border none background-color $ui-monokai-button-backgroundColor &:hover - color #5CB85C \ No newline at end of file + color #5CB85C + +body[data-theme="monokai"] + .notification-area + background-color none + + .notification-link + color $ui-monokai-text-color + border none + background-color $ui-monokai-button-backgroundColor + &:hover + color #5CB85C +body[data-theme="dracula"] + .notification-area + background-color none + + .notification-link + color $ui-dracula-text-color + border none + background-color $ui-dracula-button-backgroundColor + &:hover + color #ff79c6 \ No newline at end of file diff --git a/browser/components/SideNavFilter.styl b/browser/components/SideNavFilter.styl index c9dbd861..1da8c7e4 100644 --- a/browser/components/SideNavFilter.styl +++ b/browser/components/SideNavFilter.styl @@ -263,4 +263,46 @@ body[data-theme="monokai"] background-color $ui-monokai-button-backgroundColor color $ui-monokai-text-color .menu-button-label - color $ui-monokai-text-color \ No newline at end of file + color $ui-monokai-text-color + +body[data-theme="dracula"] + .menu-button + &:active + background-color $ui-dracula-noteList-backgroundColor + color $ui-dracula-text-color + &:hover + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color + + .menu-button--active + color $ui-dracula-text-color + background-color $ui-dracula-button-backgroundColor + .menu-button-label + color $ui-dracula-text-color + &:hover + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color + .menu-button-label + color $ui-dracula-text-color + + .menu-button-star--active + color $ui-dracula-text-color + background-color $ui-dracula-button-backgroundColor + .menu-button-label + color $ui-dracula-text-color + &:hover + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color + .menu-button-label + color $ui-dracula-text-color + + .menu-button-trash--active + color $ui-dracula-text-color + background-color $ui-dracula-button-backgroundColor + .menu-button-label + color $ui-dracula-text-color + &:hover + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color + .menu-button-label + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/components/SnippetTab.styl b/browser/components/SnippetTab.styl index 02f88f8c..a31b8594 100644 --- a/browser/components/SnippetTab.styl +++ b/browser/components/SnippetTab.styl @@ -180,4 +180,48 @@ body[data-theme="monokai"] color $ui-monokai-text-color .deleteButton - color alpha($ui-monokai-text-color, 30%) \ No newline at end of file + color alpha($ui-monokai-text-color, 30%) + +body[data-theme="dracula"] + .root + color $ui-dracula-text-color + border-color $ui-dark-borderColor + &:hover + background-color $ui-dracula-noteDetail-backgroundColor + .deleteButton + color $ui-dracula-text-color + &:hover + background-color darken($ui-dracula-noteDetail-backgroundColor, 15%) + &:active + color $ui-dracula-text-color + background-color $ui-dark-button--active-backgroundColor + + .root--active + color $ui-dracula-text-color + border-color $ui-dracula-borderColor + &:hover + background-color $ui-dracula-noteDetail-backgroundColor + .deleteButton + color $ui-dracula-text-color + &:hover + background-color darken($ui-dracula-noteDetail-backgroundColor, 15%) + &:active + color $ui-dracula-text-color + background-color $ui-dark-button--active-backgroundColor + + .button + border none + color $ui-dracula-text-color + background-color transparent + transition color background-color 0.15s + border-left 4px solid transparent + &:hover + color $ui-dracula-text-color + background-color $ui-dracula-noteDetail-backgroundColor + + .input + background-color $ui-dracula-noteDetail-backgroundColor + color $ui-dracula-text-color + + .deleteButton + color alpha($ui-dracula-text-color, 30%) \ No newline at end of file diff --git a/browser/components/StorageItem.styl b/browser/components/StorageItem.styl index 0a1b4525..df8cbbc6 100644 --- a/browser/components/StorageItem.styl +++ b/browser/components/StorageItem.styl @@ -156,4 +156,23 @@ body[data-theme="monokai"] background-color $ui-monokai-button-backgroundColor &:hover color $ui-monokai-text-color - background-color $ui-monokai-button-backgroundColor \ No newline at end of file + background-color $ui-monokai-button-backgroundColor + +body[data-theme="dracula"] + .folderList-item + &:hover + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color + &:active + color $ui-dracula-text-color + background-color $ui-dracula-button-backgroundColor + + .folderList-item--active + @extend .folderList-item + color $ui-dracula-text-color + background-color $ui-dracula-button-backgroundColor + &:active + background-color $ui-dracula-button-backgroundColor + &:hover + color $ui-dracula-text-color + background-color $ui-dracula-button-backgroundColor \ No newline at end of file diff --git a/browser/components/TodoListPercentage.styl b/browser/components/TodoListPercentage.styl index 6116cd58..af4d25ab 100644 --- a/browser/components/TodoListPercentage.styl +++ b/browser/components/TodoListPercentage.styl @@ -39,7 +39,7 @@ body[data-theme="dark"] .percentageText color $ui-dark-text-color - + body[data-theme="solarized-dark"] .percentageBar background-color #002b36 @@ -58,4 +58,14 @@ body[data-theme="monokai"] background-color: #373831 .percentageText - color #fdf6e3 \ No newline at end of file + color #fdf6e3 + +body[data-theme="dracula"] + .percentageBar + background-color #50fa7b + + .progressBar + background-color: #44475a + + .percentageText + color #f8f8f2 \ No newline at end of file diff --git a/browser/components/markdown.styl b/browser/components/markdown.styl index fb30742d..7a9be256 100644 --- a/browser/components/markdown.styl +++ b/browser/components/markdown.styl @@ -361,7 +361,7 @@ for name, val in admonition_types .admonition.{name} @extend $admonition border-left-color: val[color] - + .admonition.{name}>.admonition-title @extend $admonition-title border-bottom-color: .1rem solid rgba(val[color], 0.2) @@ -476,5 +476,34 @@ body[data-theme="monokai"] border-color themeMonokaiTableBorder &:last-child border-right solid 1px themeMonokaiTableBorder + kbd + background-color themeDarkBackground + +themeDraculaTableOdd = $ui-dracula-noteDetail-backgroundColor +themeDraculaTableEven = darken($ui-dracula-noteDetail-backgroundColor, 10%) +themeDraculaTableHead = themeDraculaTableEven +themeDraculaTableBorder = themeDarkBorder + +body[data-theme="dracula"] + color $ui-dracula-text-color + border-color themeDarkBorder + background-color $ui-dracula-noteDetail-backgroundColor + table + thead + tr + background-color themeDraculaTableHead + th + border-color themeDraculaTableBorder + &:last-child + border-right solid 1px themeDraculaTableBorder + tbody + tr:nth-child(2n + 1) + background-color themeDraculaTableOdd + tr:nth-child(2n) + background-color themeDraculaTableEven + td + border-color themeDraculaTableBorder + &:last-child + border-right solid 1px themeDraculaTableBorder kbd background-color themeDarkBackground \ No newline at end of file diff --git a/browser/components/render/MermaidRender.js b/browser/components/render/MermaidRender.js index 12dce327..e8784d9d 100644 --- a/browser/components/render/MermaidRender.js +++ b/browser/components/render/MermaidRender.js @@ -2,8 +2,8 @@ import mermaidAPI from 'mermaid' // fixes bad styling in the mermaid dark theme const darkThemeStyling = ` -.loopText tspan { - fill: white; +.loopText tspan { + fill: white; }` function getRandomInt (min, max) { @@ -21,7 +21,7 @@ function getId () { function render (element, content, theme) { try { - let isDarkTheme = theme === 'dark' || theme === 'solarized-dark' || theme === 'monokai' + let isDarkTheme = theme === 'dark' || theme === 'solarized-dark' || theme === 'monokai' || theme === 'dracula' mermaidAPI.initialize({ theme: isDarkTheme ? 'dark' : 'default', themeCSS: isDarkTheme ? darkThemeStyling : '' diff --git a/browser/main/Detail/Detail.styl b/browser/main/Detail/Detail.styl index 49a634f3..1b7bd606 100644 --- a/browser/main/Detail/Detail.styl +++ b/browser/main/Detail/Detail.styl @@ -23,7 +23,7 @@ body[data-theme="dark"] border-left 1px solid $ui-dark-borderColor .empty-message color $ui-dark-inactive-text-color - + body[data-theme="solarized-dark"] .root background-color $ui-solarized-dark-noteDetail-backgroundColor @@ -37,3 +37,10 @@ body[data-theme="monokai"] border-left 1px solid $ui-monokai-borderColor .empty-message color $ui-monokai-text-color + +body[data-theme="dracula"] + .root + background-color $ui-dracula-noteDetail-backgroundColor + border-left 1px solid $ui-dracula-borderColor + .empty-message + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/Detail/FolderSelect.styl b/browser/main/Detail/FolderSelect.styl index cfdc2734..7232ab2d 100644 --- a/browser/main/Detail/FolderSelect.styl +++ b/browser/main/Detail/FolderSelect.styl @@ -36,7 +36,7 @@ height 34px width 20px line-height 34px - + .search-input vertical-align middle position relative @@ -71,7 +71,7 @@ overflow ellipsis cursor pointer &:hover - background-color $ui-button--hover-backgroundColor + background-color $ui-button--hover-backgroundColor .search-optionList-item--active @extend .search-optionList-item @@ -159,3 +159,29 @@ body[data-theme="monokai"] color $ui-monokai-button--active-color .search-optionList-item-name-surfix color $ui-monokai-inactive-text-color + +body[data-theme="dracula"] + .root + color $ui-dark-text-color + &:hover + color #f8f8f2 + background-color $ui-dracula-button--hover-backgroundColor + border-color $ui-dracula-borderColor + + .search-optionList + color #f8f8f2 + border-color $ui-dracula-borderColor + background-color $ui-dracula-button-backgroundColor + + .search-optionList-item + &:hover + background-color lighten($ui-dracula-button--hover-backgroundColor, 15%) + + .search-optionList-item--active + background-color $ui-dracula-button--active-backgroundColor + color $ui-dracula-button--active-color + &:hover + background-color $ui-dracula-button--active-backgroundColor + color $ui-dracula-button--active-color + .search-optionList-item-name-surfix + color $ui-dracula-inactive-text-color diff --git a/browser/main/Detail/InfoPanel.styl b/browser/main/Detail/InfoPanel.styl index 2a73ca7e..1f774174 100644 --- a/browser/main/Detail/InfoPanel.styl +++ b/browser/main/Detail/InfoPanel.styl @@ -257,3 +257,43 @@ body[data-theme="monokai"] color $ui-dark-inactive-text-color &:hover color $ui-monokai-text-color + +body[data-theme="dracula"] + .control-infoButton-panel + background-color $ui-dracula-noteList-backgroundColor + + .control-infoButton-panel-trash + background-color $ui-dracula-noteList-backgroundColor + + .modification-date + color $ui-dracula-text-color + + .modification-date-desc + color $ui-inactive-text-color + + .infoPanel-defaul-count + color $ui-dracula-text-color + + .infoPanel-sub-count + color $ui-inactive-text-color + + .infoPanel-default + color $ui-dracula-text-color + + .infoPanel-sub + color $ui-inactive-text-color + + .infoPanel-noteLink + background-color alpha($ui-dracula-borderColor, 20%) + color $ui-dracula-text-color + + [id=export-wrap] + button + color $ui-dark-inactive-text-color + &:hover + background-color alpha($ui-dracula-borderColor, 20%) + color $ui-dracula-text-color + p + color $ui-dark-inactive-text-color + &:hover + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/Detail/MarkdownNoteDetail.styl b/browser/main/Detail/MarkdownNoteDetail.styl index b27dc80e..cdfeaf3a 100644 --- a/browser/main/Detail/MarkdownNoteDetail.styl +++ b/browser/main/Detail/MarkdownNoteDetail.styl @@ -76,3 +76,8 @@ body[data-theme="monokai"] .root border-left 1px solid $ui-monokai-borderColor background-color $ui-monokai-noteDetail-backgroundColor + +body[data-theme="dracula"] + .root + border-left 1px solid $ui-dracula-borderColor + background-color $ui-dracula-noteDetail-backgroundColor \ No newline at end of file diff --git a/browser/main/Detail/NoteDetailInfo.styl b/browser/main/Detail/NoteDetailInfo.styl index 7166a497..1ca46516 100644 --- a/browser/main/Detail/NoteDetailInfo.styl +++ b/browser/main/Detail/NoteDetailInfo.styl @@ -98,8 +98,13 @@ body[data-theme="solarized-dark"] .info border-color $ui-solarized-dark-borderColor background-color $ui-solarized-dark-noteDetail-backgroundColor - + body[data-theme="monokai"] .info border-color $ui-monokai-borderColor - background-color $ui-monokai-noteDetail-backgroundColor \ No newline at end of file + background-color $ui-monokai-noteDetail-backgroundColor + +body[data-theme="dracula"] + .info + border-color $ui-dracula-borderColor + background-color $ui-dracula-noteDetail-backgroundColor \ No newline at end of file diff --git a/browser/main/Detail/SnippetNoteDetail.styl b/browser/main/Detail/SnippetNoteDetail.styl index f8ca48cc..e3bb31c6 100644 --- a/browser/main/Detail/SnippetNoteDetail.styl +++ b/browser/main/Detail/SnippetNoteDetail.styl @@ -169,4 +169,21 @@ body[data-theme="monokai"] .tabList background-color $ui-monokai-noteDetail-backgroundColor - color $ui-monokai-text-color \ No newline at end of file + color $ui-monokai-text-color + +body[data-theme="dracula"] + .root + border-left 1px solid $ui-dracula-borderColor + background-color $ui-dracula-noteDetail-backgroundColor + + .body + background-color $ui-dracula-noteDetail-backgroundColor + + .body .description textarea + background-color $ui-dracula-noteDetail-backgroundColor + color $ui-dracula-text-color + border 1px solid $ui-dracula-borderColor + + .tabList + background-color $ui-dracula-noteDetail-backgroundColor + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/Detail/TagSelect.styl b/browser/main/Detail/TagSelect.styl index 7dc9dfe4..e25e7868 100644 --- a/browser/main/Detail/TagSelect.styl +++ b/browser/main/Detail/TagSelect.styl @@ -74,4 +74,15 @@ body[data-theme="monokai"] background-color transparent .tag-label - color $ui-monokai-text-color \ No newline at end of file + color $ui-monokai-text-color + +body[data-theme="dracula"] + .tag + background-color $ui-dracula-button-backgroundColor + + .tag-removeButton + border-color $ui-dracula-button--focus-borderColor + background-color transparent + + .tag-label + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/Detail/ToggleModeButton.styl b/browser/main/Detail/ToggleModeButton.styl index 2e7ab5fa..21733af6 100644 --- a/browser/main/Detail/ToggleModeButton.styl +++ b/browser/main/Detail/ToggleModeButton.styl @@ -63,3 +63,10 @@ body[data-theme="monokai"] .active background-color #1EC38B box-shadow 2px 0px 7px #222222 + +body[data-theme="dracula"] + .control-toggleModeButton + background-color #282a36 + .active + background-color #ff79c6 + box-shadow 2px 0px 7px #222222 \ No newline at end of file diff --git a/browser/main/Main.js b/browser/main/Main.js index 0f31a591..25ff941b 100644 --- a/browser/main/Main.js +++ b/browser/main/Main.js @@ -141,7 +141,7 @@ class Main extends React.Component { componentDidMount () { const { dispatch, config } = this.props - const supportedThemes = ['dark', 'white', 'solarized-dark', 'monokai'] + const supportedThemes = ['dark', 'white', 'solarized-dark', 'monokai', 'dracula'] if (supportedThemes.indexOf(config.ui.theme) !== -1) { document.body.setAttribute('data-theme', config.ui.theme) diff --git a/browser/main/NewNoteButton/NewNoteButton.styl b/browser/main/NewNoteButton/NewNoteButton.styl index e8e4b5f0..75a9061c 100644 --- a/browser/main/NewNoteButton/NewNoteButton.styl +++ b/browser/main/NewNoteButton/NewNoteButton.styl @@ -79,3 +79,7 @@ body[data-theme="solarized-dark"] body[data-theme="monokai"] .root, .root--expanded background-color $ui-monokai-noteList-backgroundColor + +body[data-theme="dracula"] + .root, .root--expanded + background-color $ui-dracula-noteList-backgroundColor \ No newline at end of file diff --git a/browser/main/NoteList/NoteList.styl b/browser/main/NoteList/NoteList.styl index ea261208..73959c9b 100644 --- a/browser/main/NoteList/NoteList.styl +++ b/browser/main/NoteList/NoteList.styl @@ -84,7 +84,7 @@ body[data-theme="dark"] color $ui-dark-inactive-text-color &:hover color $ui-dark-text-color - + .control-button--active color $ui-dark-text-color &:active @@ -109,7 +109,7 @@ body[data-theme="solarized-dark"] color $ui-solarized-dark-inactive-text-color &:hover color $ui-solarized-dark-text-color - + .control-button--active color $ui-solarized-dark-text-color &:active @@ -138,3 +138,27 @@ body[data-theme="monokai"] color $ui-monokai-text-color &:active color $ui-monokai-text-color + +body[data-theme="dracula"] + .root + border-color $ui-dracula-borderColor + background-color $ui-dracula-noteList-backgroundColor + + .control + background-color $ui-dracula-noteList-backgroundColor + border-color $ui-dracula-borderColor + + .control-sortBy-select + &:hover + transition 0.2s + color $ui-dracula-text-color + + .control-button + color $ui-dracula-inactive-text-color + &:hover + color $ui-dracula-text-color + + .control-button--active + color $ui-dracula-text-color + &:active + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/SideNav/SideNav.styl b/browser/main/SideNav/SideNav.styl index ecab70d0..9fa6d4fa 100644 --- a/browser/main/SideNav/SideNav.styl +++ b/browser/main/SideNav/SideNav.styl @@ -19,7 +19,7 @@ text-align center - + .top-menu-label margin-left 5px overflow ellipsis @@ -122,3 +122,8 @@ body[data-theme="monokai"] .root, .root--folded background-color $ui-monokai-backgroundColor border-right 1px solid $ui-monokai-borderColor + +body[data-theme="dracula"] + .root, .root--folded + background-color $ui-dracula-backgroundColor + border-right 1px solid $ui-dracula-borderColor \ No newline at end of file diff --git a/browser/main/StatusBar/StatusBar.styl b/browser/main/StatusBar/StatusBar.styl index 52cc4b02..83cf2088 100644 --- a/browser/main/StatusBar/StatusBar.styl +++ b/browser/main/StatusBar/StatusBar.styl @@ -34,7 +34,7 @@ color $ui-active-color span margin-left 5px - + .update navButtonColor() height 24px @@ -80,3 +80,14 @@ body[data-theme="monokai"] color $ui-monokai-active-color &:active color $ui-monokai-active-color + +body[data-theme="dracula"] + navButtonColor() + .zoom + border-color $ui-dark-borderColor + color $ui-dracula-text-color + &:hover + transition 0.15s + color $ui-dracula-active-color + &:active + color $ui-dracula-active-color \ No newline at end of file diff --git a/browser/main/TopBar/TopBar.styl b/browser/main/TopBar/TopBar.styl index 7654f66f..61b21fc5 100644 --- a/browser/main/TopBar/TopBar.styl +++ b/browser/main/TopBar/TopBar.styl @@ -256,3 +256,25 @@ body[data-theme="monokai"] input background-color $ui-monokai-noteList-backgroundColor color $ui-monokai-text-color + +body[data-theme="dracula"] + .root, .root--expanded + background-color $ui-dracula-noteList-backgroundColor + + .control + border-color $ui-dracula-borderColor + .control-search + background-color $ui-dracula-noteList-backgroundColor + + .control-search-icon + absolute top bottom left + line-height 32px + width 35px + color $ui-dracula-inactive-text-color + background-color $ui-dracula-noteList-backgroundColor + + .control-search-input + background-color $ui-dracula-noteList-backgroundColor + input + background-color $ui-dracula-noteList-backgroundColor + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/global.styl b/browser/main/global.styl index 815cff4e..4b95e07b 100644 --- a/browser/main/global.styl +++ b/browser/main/global.styl @@ -162,6 +162,15 @@ body[data-theme="monokai"] .sortableItemHelper color: $ui-monokai-text-color +body[data-theme="dracula"] + ::-webkit-scrollbar-thumb + background-color rgba(0, 0, 0, 0.3) + .ModalBase + .modalBack + background-color $ui-dracula-backgroundColor + .sortableItemHelper + color: $ui-dracula-text-color + body[data-theme="default"] .SideNav ::-webkit-scrollbar-thumb background-color rgba(255, 255, 255, 0.3) diff --git a/browser/main/lib/ConfigManager.js b/browser/main/lib/ConfigManager.js index 2c601b57..7b7232c2 100644 --- a/browser/main/lib/ConfigManager.js +++ b/browser/main/lib/ConfigManager.js @@ -147,6 +147,8 @@ function set (updates) { document.body.setAttribute('data-theme', 'solarized-dark') } else if (newConfig.ui.theme === 'monokai') { document.body.setAttribute('data-theme', 'monokai') + } else if (newConfig.ui.theme === 'dracula') { + document.body.setAttribute('data-theme', 'dracula') } else { document.body.setAttribute('data-theme', 'default') } diff --git a/browser/main/modals/CreateFolderModal.styl b/browser/main/modals/CreateFolderModal.styl index 1b96e123..e5ebb8ea 100644 --- a/browser/main/modals/CreateFolderModal.styl +++ b/browser/main/modals/CreateFolderModal.styl @@ -128,3 +128,29 @@ body[data-theme="monokai"] .control-confirmButton colorMonokaiPrimaryButton() + +body[data-theme="Dracula"] + .root + modalDracula() + width 500px + height 270px + overflow hidden + position relative + + .header + background-color transparent + border-color $ui-dark-borderColor + color $ui-Dracula-text-color + + .control-folder-label + color $ui-Dracula-text-color + + .control-folder-input + border 1px solid $ui-input--create-folder-modal + color white + + .description + color $ui-inactive-text-color + + .control-confirmButton + colorDraculaPrimaryButton() \ No newline at end of file diff --git a/browser/main/modals/NewNoteModal.styl b/browser/main/modals/NewNoteModal.styl index db14133f..c82b9376 100644 --- a/browser/main/modals/NewNoteModal.styl +++ b/browser/main/modals/NewNoteModal.styl @@ -97,3 +97,20 @@ body[data-theme="monokai"] .description color $ui-monokai-text-color + +body[data-theme="dracula"] + .root + background-color transparent + + .header + color $ui-dracula-text-color + + .control-button + border-color $ui-dracula-borderColor + color $ui-dracula-text-color + background-color transparent + &:focus + colorDraculaPrimaryButton() + + .description + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/modals/PreferencesModal/ConfigTab.styl b/browser/main/modals/PreferencesModal/ConfigTab.styl index 31994d97..3b8b37ab 100644 --- a/browser/main/modals/PreferencesModal/ConfigTab.styl +++ b/browser/main/modals/PreferencesModal/ConfigTab.styl @@ -127,7 +127,7 @@ colorDarkControl() border-color $ui-dark-borderColor background-color $ui-dark-backgroundColor color $ui-dark-text-color - + colorSolarizedDarkControl() border none background-color $ui-solarized-dark-button-backgroundColor @@ -138,6 +138,10 @@ colorMonokaiControl() background-color $ui-monokai-button-backgroundColor color $ui-monokai-text-color +colorDraculaControl() + border none + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color body[data-theme="dark"] .root @@ -165,27 +169,27 @@ body[data-theme="dark"] .group-section-control select, .group-section-control-input colorDarkControl() - - + + body[data-theme="solarized-dark"] .root color $ui-solarized-dark-text-color .group-header color $ui-solarized-dark-text-color - border-color $ui-solarized-dark-borderColor + border-color $ui-solarized-dark-borderColor .group-header2 color $ui-solarized-dark-text-color .group-section-control-input - border-color $ui-solarized-dark-borderColor + border-color $ui-solarized-dark-borderColor .group-control - border-color $ui-solarized-dark-borderColor + border-color $ui-solarized-dark-borderColor .group-control-leftButton colorDarkDefaultButton() - border-color $ui-solarized-dark-borderColor + border-color $ui-solarized-dark-borderColor .group-control-rightButton colorSolarizedDarkPrimaryButton() .group-hint @@ -200,19 +204,19 @@ body[data-theme="monokai"] .group-header color $ui-monokai-text-color - border-color $ui-monokai-borderColor + border-color $ui-monokai-borderColor .group-header2 color $ui-monokai-text-color .group-section-control-input - border-color $ui-monokai-borderColor + border-color $ui-monokai-borderColor .group-control - border-color $ui-monokai-borderColor + border-color $ui-monokai-borderColor .group-control-leftButton colorDarkDefaultButton() - border-color $ui-monokai-borderColor + border-color $ui-monokai-borderColor .group-control-rightButton colorMonokaiPrimaryButton() .group-hint @@ -220,3 +224,30 @@ body[data-theme="monokai"] .group-section-control select, .group-section-control-input colorMonokaiControl() + +body[data-theme="dracula"] + .root + color $ui-dracula-text-color + + .group-header + color $ui-dracula-text-color + border-color $ui-dracula-borderColor + + .group-header2 + color $ui-dracula-text-color + + .group-section-control-input + border-color $ui-dracula-borderColor + + .group-control + border-color $ui-dracula-borderColor + .group-control-leftButton + colorDarkDefaultButton() + border-color $ui-dracula-borderColor + .group-control-rightButton + colorDraculaPrimaryButton() + .group-hint + colorDraculaControl() + .group-section-control + select, .group-section-control-input + colorDraculaControl() \ No newline at end of file diff --git a/browser/main/modals/PreferencesModal/Crowdfunding.styl b/browser/main/modals/PreferencesModal/Crowdfunding.styl index 326867d3..6d72290b 100644 --- a/browser/main/modals/PreferencesModal/Crowdfunding.styl +++ b/browser/main/modals/PreferencesModal/Crowdfunding.styl @@ -29,7 +29,7 @@ p body[data-theme="dark"] p color $ui-dark-text-color - + body[data-theme="solarized-dark"] .root color $ui-solarized-dark-text-color @@ -41,3 +41,9 @@ body[data-theme="monokai"] color $ui-monokai-text-color p color $ui-monokai-text-color + +body[data-theme="dracula"] + .root + color $ui-dracula-text-color + p + color $ui-dracula-text-color \ No newline at end of file diff --git a/browser/main/modals/PreferencesModal/FolderItem.styl b/browser/main/modals/PreferencesModal/FolderItem.styl index 8bcf2b02..ea837aed 100644 --- a/browser/main/modals/PreferencesModal/FolderItem.styl +++ b/browser/main/modals/PreferencesModal/FolderItem.styl @@ -149,3 +149,26 @@ body[data-theme="monokai"] .folderItem-right-dangerButton colorMonokaiPrimaryButton() + +body[data-theme="dracula"] + .folderItem + &:hover + background-color $ui-dracula-button-backgroundColor + + .folderItem-left-danger + color $danger-color + + .folderItem-left-key + color $ui-dark-inactive-text-color + + .folderItem-left-colorButton + colorDraculaPrimaryButton() + + .folderItem-right-button + colorDraculaPrimaryButton() + + .folderItem-right-confirmButton + colorDraculaPrimaryButton() + + .folderItem-right-dangerButton + colorDraculaPrimaryButton() \ No newline at end of file diff --git a/browser/main/modals/PreferencesModal/InfoTab.styl b/browser/main/modals/PreferencesModal/InfoTab.styl index 491fc4d4..44f2d9ae 100644 --- a/browser/main/modals/PreferencesModal/InfoTab.styl +++ b/browser/main/modals/PreferencesModal/InfoTab.styl @@ -60,7 +60,7 @@ body[data-theme="dark"] .root color alpha($tab--dark-text-color, 80%) - + body[data-theme="solarized-dark"] .root @@ -75,3 +75,10 @@ body[data-theme="monokai"] .list a color $ui-monokai-active-color + +body[data-theme="dracula"] + .root + color $ui-dracula-text-color +.list + a + color $ui-dracula-active-color diff --git a/browser/main/modals/PreferencesModal/PreferencesModal.styl b/browser/main/modals/PreferencesModal/PreferencesModal.styl index d21f6c28..7004259b 100644 --- a/browser/main/modals/PreferencesModal/PreferencesModal.styl +++ b/browser/main/modals/PreferencesModal/PreferencesModal.styl @@ -90,7 +90,7 @@ body[data-theme="dark"] background-color $dark-primary-button-background--active &:hover color white - + body[data-theme="solarized-dark"] .root @@ -139,3 +139,27 @@ body[data-theme="monokai"] background-color $ui-monokai-button--active-backgroundColor &:hover color white + +body[data-theme="dracula"] + .root + background-color transparent + .top-bar + background-color transparent + border-color $ui-dracula-borderColor + p + color $ui-dracula-text-color + .nav + background-color transparent + border-color $ui-dracula-borderColor + .nav-button + background-color transparent + color $ui-dracula-text-color + &:hover + color $ui-dracula-text-color + + .nav-button--active + @extend .nav-button + color $ui-dracula-button--active-color + background-color $ui-dracula-button--active-backgroundColor + &:hover + color #f8f8f2 \ No newline at end of file diff --git a/browser/main/modals/PreferencesModal/SnippetTab.styl b/browser/main/modals/PreferencesModal/SnippetTab.styl index 02307b64..dd22b72e 100644 --- a/browser/main/modals/PreferencesModal/SnippetTab.styl +++ b/browser/main/modals/PreferencesModal/SnippetTab.styl @@ -196,3 +196,19 @@ body[data-theme="monokai"] color white .group-control-button colorMonokaiPrimaryButton() + +body[data-theme="dracula"] + .snippets + background $ui-dracula-backgroundColor + .snippet-item + color #f8f8f2 + &::after + background $ui-dracula-borderColor + &:hover + background darken($ui-dracula-backgroundColor, 5) + .snippet-item-selected + background darken($ui-dracula-backgroundColor, 5) + .snippet-detail + color #f8f8f2 + .group-control-button + colorDraculaPrimaryButton() \ No newline at end of file diff --git a/browser/main/modals/PreferencesModal/StoragesTab.styl b/browser/main/modals/PreferencesModal/StoragesTab.styl index 9804d7e7..9a1a0ef8 100644 --- a/browser/main/modals/PreferencesModal/StoragesTab.styl +++ b/browser/main/modals/PreferencesModal/StoragesTab.styl @@ -158,7 +158,7 @@ body[data-theme="dark"] .addStorage-body-control-cancelButton colorDarkDefaultButton() border-color $ui-dark-borderColor - + body[data-theme="solarized-dark"] @@ -236,3 +236,41 @@ body[data-theme="monokai"] .addStorage-body-control-cancelButton colorDarkDefaultButton() border-color $ui-monokai-borderColor + +body[data-theme="dracula"] + .root + color $ui-dracula-text-color + + .folderList-item + border-bottom $ui-dracula-borderColor + + .folderList-empty + color $ui-dracula-text-color + + .list-empty + color $ui-dracula-text-color + .list-control-addStorageButton + border-color $ui-dracula-button-backgroundColor + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color + + .addStorage-header + color $ui-dracula-text-color + border-color $ui-dracula-borderColor + + .addStorage-body-section-name-input + border-color $$ui-dracula-borderColor + + .addStorage-body-section-type-description + color $ui-dracula-text-color + + .addStorage-body-section-path-button + colorPrimaryButton() + .addStorage-body-control + border-color $ui-dracula-borderColor + + .addStorage-body-control-createButton + colorDarkPrimaryButton() + .addStorage-body-control-cancelButton + colorDarkDefaultButton() + border-color $ui-dracula-borderColor \ No newline at end of file diff --git a/browser/main/modals/PreferencesModal/UiTab.js b/browser/main/modals/PreferencesModal/UiTab.js index 1b7d3672..9748e4d6 100644 --- a/browser/main/modals/PreferencesModal/UiTab.js +++ b/browser/main/modals/PreferencesModal/UiTab.js @@ -187,6 +187,7 @@ class UiTab extends React.Component { + diff --git a/browser/styles/Detail/TagSelect.styl b/browser/styles/Detail/TagSelect.styl index 84fd74c2..69adc72b 100644 --- a/browser/styles/Detail/TagSelect.styl +++ b/browser/styles/Detail/TagSelect.styl @@ -14,18 +14,18 @@ list-style none padding 0 margin 0 - + border-radius 4px margin .2em 0 0 background-color $ui-noteList-backgroundColor border 1px solid rgba(0,0,0,.3) box-shadow .05em .2em .6em rgba(0,0,0,.2) text-shadow none - + &:empty, &[hidden] display none - + &:before content "" position absolute @@ -39,12 +39,12 @@ border-bottom 0 -webkit-transform rotate(45deg) transform rotate(45deg) - + li position relative padding 6px 18px 6px 10px cursor pointer - + li[aria-selected="true"] background-color alpha($ui-button--active-backgroundColor, 40%) color $ui-text-color @@ -53,15 +53,15 @@ body[data-theme="dark"] .TagSelect .react-autosuggest__input color $ui-dark-text-color - + ul border-color $ui-dark-borderColor background-color $ui-dark-noteList-backgroundColor color $ui-dark-text-color - + &:before background-color $ui-dark-noteList-backgroundColor - + li[aria-selected="true"] background-color $ui-dark-button--active-backgroundColor color $ui-dark-text-color @@ -70,32 +70,49 @@ body[data-theme="monokai"] .TagSelect .react-autosuggest__input color $ui-monokai-text-color - + ul border-color $ui-monokai-borderColor background-color $ui-monokai-noteList-backgroundColor color $ui-monokai-text-color - + &:before background-color $ui-dark-noteList-backgroundColor - + li[aria-selected="true"] background-color $ui-monokai-button-backgroundColor color $ui-monokai-text-color +body[data-theme="dracula"] + .TagSelect + .react-autosuggest__input + color $ui-dracula-text-color + + ul + border-color $ui-dracula-borderColor + background-color $ui-dracula-noteList-backgroundColor + color $ui-dracula-text-color + + &:before + background-color $ui-dark-noteList-backgroundColor + + li[aria-selected="true"] + background-color $ui-dracula-button-backgroundColor + color $ui-dracula-text-color + body[data-theme="solarized-dark"] .TagSelect .react-autosuggest__input color $ui-solarized-dark-text-color - + ul border-color $ui-solarized-dark-borderColor background-color $ui-solarized-dark-noteList-backgroundColor color $ui-solarized-dark-text-color - + &:before background-color $ui-solarized-dark-noteList-backgroundColor - + li[aria-selected="true"] background-color $ui-dark-button--active-backgroundColor color $ui-solarized-dark-text-color @@ -104,6 +121,6 @@ body[data-theme="white"] .TagSelect ul background-color $ui-white-noteList-backgroundColor - + li[aria-selected="true"] background-color $ui-button--active-backgroundColor \ No newline at end of file diff --git a/browser/styles/index.styl b/browser/styles/index.styl index a490b41c..e5eae141 100644 --- a/browser/styles/index.styl +++ b/browser/styles/index.styl @@ -383,4 +383,30 @@ modalMonokai() width 100% background-color $ui-monokai-backgroundColor overflow hidden + border-radius $modal-border-radius + +/******* Dracula theme ********/ +$ui-dracula-backgroundColor = #282a36 +$ui-dracula-noteList-backgroundColor = #282a36 +$ui-dracula-noteDetail-backgroundColor = #282a36 + +$ui-dracula-text-color = #f8f8f2 +$ui-dracula-active-color = #50fa7b + +$ui-dracula-borderColor = #44475a + +$ui-dracula-tag-backgroundColor = #50fa7b + +$ui-dracula-button-backgroundColor = #44475a +$ui-dracula-button--active-color = #ff79c6 +$ui-dracula-button--active-backgroundColor = #50fa7b +$ui-dracula-button--hover-backgroundColor = lighten($ui-dracula-backgroundColor, 10%) +$ui-dracula-button--focus-borderColor = lighten(#bd93f9, 25%) + +modalDracula() + position relative + z-index $modal-z-index + width 100% + background-color $ui-dracula-backgroundColor + overflow hidden border-radius $modal-border-radius \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 50374f74..1cc5fb08 100644 --- a/yarn.lock +++ b/yarn.lock @@ -188,6 +188,12 @@ ansi-escapes@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.1.0.tgz#f73207bb81207d75fd6c83f125af26eea378ca30" +ansi-red@^0.1.1: + version "0.1.1" + resolved "https://registry.yarnpkg.com/ansi-red/-/ansi-red-0.1.1.tgz#8c638f9d1080800a353c9c28c8a81ca4705d946c" + dependencies: + ansi-wrap "0.1.0" + ansi-regex@^0.2.0, ansi-regex@^0.2.1: version "0.2.1" resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-0.2.1.tgz#0d8e946967a3d8143f93e24e298525fc1b2235f9" @@ -218,6 +224,10 @@ ansi-styles@~1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-1.0.0.tgz#cb102df1c56f5123eab8b67cd7b98027a0279178" +ansi-wrap@0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/ansi-wrap/-/ansi-wrap-0.1.0.tgz#a82250ddb0015e9a27ca82e82ea603bbfa45efaf" + anymatch@^1.3.0: version "1.3.2" resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-1.3.2.tgz#553dcb8f91e3c889845dfdba34c77721b90b9d7a" @@ -255,7 +265,7 @@ argparse@^1.0.7, argparse@~1.0.3: dependencies: sprintf-js "~1.0.2" -"argparse@~ 0.1.11": +"argparse@~ 0.1.11", argparse@~0.1.15: version "0.1.16" resolved "https://registry.yarnpkg.com/argparse/-/argparse-0.1.16.tgz#cfd01e0fbba3d6caed049fbd758d40f65196f57c" dependencies: @@ -459,6 +469,10 @@ auto-bind@^1.1.0: version "1.2.0" resolved "https://registry.yarnpkg.com/auto-bind/-/auto-bind-1.2.0.tgz#8b7e318aad53d43ba8a8ecaf0066d85d5f798cd6" +autolinker@~0.15.0: + version "0.15.3" + resolved "https://registry.yarnpkg.com/autolinker/-/autolinker-0.15.3.tgz#342417d8f2f3461b14cf09088d5edf8791dc9832" + autoprefixer@^6.3.1: version "6.7.7" resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.7.tgz#1dbd1c835658e35ce3f9984099db00585c782014" @@ -1793,7 +1807,7 @@ codemirror@^5.39.0: version "5.39.0" resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.39.0.tgz#4654f7d2f7e525e04a62e72d9482348ccb37dce5" -coffee-script@^1.10.0: +coffee-script@^1.10.0, coffee-script@^1.12.4: version "1.12.7" resolved "https://registry.yarnpkg.com/coffee-script/-/coffee-script-1.12.7.tgz#c05dae0cb79591d05b3070a8433a98c9a89ccc53" @@ -2666,6 +2680,10 @@ devtron@^1.1.0: highlight.js "^9.3.0" humanize-plus "^1.8.1" +diacritics-map@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/diacritics-map/-/diacritics-map-0.1.0.tgz#6dfc0ff9d01000a2edf2865371cac316e94977af" + diff@^3.2.0: version "3.5.0" resolved "https://registry.yarnpkg.com/diff/-/diff-3.5.0.tgz#800c0dd1e0a8bfbc95835c202ad220fe317e5a12" @@ -4030,6 +4048,16 @@ graphlibrary@^2.2.0: dependencies: lodash "^4.17.5" +gray-matter@^2.1.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/gray-matter/-/gray-matter-2.1.1.tgz#3042d9adec2a1ded6a7707a9ed2380f8a17a430e" + dependencies: + ansi-red "^0.1.1" + coffee-script "^1.12.4" + extend-shallow "^2.0.1" + js-yaml "^3.8.1" + toml "^2.3.2" + growly@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081" @@ -5254,6 +5282,13 @@ js-yaml@^3.10.0, js-yaml@^3.5.1, js-yaml@^3.7.0: argparse "^1.0.7" esprima "^4.0.0" +js-yaml@^3.8.1: + version "3.12.0" + resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.0.tgz#eaed656ec8344f10f527c6bfa1b6e2244de167d1" + dependencies: + argparse "^1.0.7" + esprima "^4.0.0" + js-yaml@~2.0.5: version "2.0.5" resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-2.0.5.tgz#a25ae6509999e97df278c6719da11bd0687743a8" @@ -5487,6 +5522,12 @@ lazy-cache@^1.0.3: version "1.0.4" resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-1.0.4.tgz#a1d78fc3a50474cb80845d3b3b6e1da49a446e8e" +lazy-cache@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-2.0.2.tgz#b9190a4f913354694840859f8a8f7084d8822264" + dependencies: + set-getter "^0.1.0" + lcid@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/lcid/-/lcid-1.0.0.tgz#308accafa0bc483a3867b4b6f2b9506251d1b835" @@ -5514,6 +5555,15 @@ linkify-it@~1.2.0, linkify-it@~1.2.2: dependencies: uc.micro "^1.0.1" +list-item@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/list-item/-/list-item-1.1.1.tgz#0c65d00e287cb663ccb3cb3849a77e89ec268a56" + dependencies: + expand-range "^1.8.1" + extend-shallow "^2.0.1" + is-number "^2.1.0" + repeat-string "^1.5.2" + load-json-file@^1.0.0: version "1.1.0" resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0" @@ -5783,6 +5833,27 @@ markdown-it@^6.0.1: mdurl "~1.0.1" uc.micro "^1.0.1" +markdown-link@^0.1.1: + version "0.1.1" + resolved "https://registry.yarnpkg.com/markdown-link/-/markdown-link-0.1.1.tgz#32c5c65199a6457316322d1e4229d13407c8c7cf" + +markdown-toc@^1.2.0: + version "1.2.0" + resolved "https://registry.yarnpkg.com/markdown-toc/-/markdown-toc-1.2.0.tgz#44a15606844490314afc0444483f9e7b1122c339" + dependencies: + concat-stream "^1.5.2" + diacritics-map "^0.1.0" + gray-matter "^2.1.0" + lazy-cache "^2.0.2" + list-item "^1.1.1" + markdown-link "^0.1.1" + minimist "^1.2.0" + mixin-deep "^1.1.3" + object.pick "^1.2.0" + remarkable "^1.7.1" + repeat-string "^1.6.1" + strip-color "^0.1.0" + match-at@^0.1.1: version "0.1.1" resolved "https://registry.yarnpkg.com/match-at/-/match-at-0.1.1.tgz#25d040d291777704d5e6556bbb79230ec2de0540" @@ -6028,7 +6099,7 @@ minizlib@^1.1.0: dependencies: minipass "^2.2.1" -mixin-deep@^1.2.0: +mixin-deep@^1.1.3, mixin-deep@^1.2.0: version "1.3.1" resolved "https://registry.yarnpkg.com/mixin-deep/-/mixin-deep-1.3.1.tgz#a49e7268dce1a0d9698e45326c5626df3543d0fe" dependencies: @@ -6400,7 +6471,7 @@ object.omit@^2.0.0: for-own "^0.1.4" is-extendable "^0.1.1" -object.pick@^1.3.0: +object.pick@^1.2.0, object.pick@^1.3.0: version "1.3.0" resolved "https://registry.yarnpkg.com/object.pick/-/object.pick-1.3.0.tgz#87a10ac4c1694bd2e1cbf53591a66141fb5dd747" dependencies: @@ -7544,6 +7615,13 @@ release-zalgo@^1.0.0: dependencies: es6-error "^4.0.1" +remarkable@^1.7.1: + version "1.7.1" + resolved "https://registry.yarnpkg.com/remarkable/-/remarkable-1.7.1.tgz#aaca4972100b66a642a63a1021ca4bac1be3bff6" + dependencies: + argparse "~0.1.15" + autolinker "~0.15.0" + remove-trailing-separator@^1.0.1: version "1.1.0" resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef" @@ -7879,6 +7957,12 @@ set-blocking@^2.0.0, set-blocking@~2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7" +set-getter@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/set-getter/-/set-getter-0.1.0.tgz#d769c182c9d5a51f409145f2fba82e5e86e80376" + dependencies: + to-object-path "^0.3.0" + set-immediate-shim@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz#4b2b1b27eb808a9f8dcc481a58e5e56f599f3f61" @@ -8325,6 +8409,10 @@ strip-bom@^2.0.0: dependencies: is-utf8 "^0.2.0" +strip-color@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/strip-color/-/strip-color-0.1.0.tgz#106f65d3d3e6a2d9401cac0eb0ce8b8a702b4f7b" + strip-eof@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/strip-eof/-/strip-eof-1.0.0.tgz#bb43ff5598a6eb05d89b59fcd129c983313606bf" @@ -8606,6 +8694,10 @@ toggle-selection@^1.0.3: version "1.0.6" resolved "https://registry.yarnpkg.com/toggle-selection/-/toggle-selection-1.0.6.tgz#6e45b1263f2017fa0acc7d89d78b15b8bf77da32" +toml@^2.3.2: + version "2.3.3" + resolved "https://registry.yarnpkg.com/toml/-/toml-2.3.3.tgz#8d683d729577cb286231dfc7a8affe58d31728fb" + touch@0.0.3: version "0.0.3" resolved "https://registry.yarnpkg.com/touch/-/touch-0.0.3.tgz#51aef3d449571d4f287a5d87c9c8b49181a0db1d" From 610503472a50c534419a412267bdb7653edc7558 Mon Sep 17 00:00:00 2001 From: William Grant Date: Sun, 23 Sep 2018 16:35:26 +0200 Subject: [PATCH 02/42] finished styling --- browser/components/NoteItem.styl | 2 +- browser/main/Detail/FolderSelect.styl | 6 +++--- browser/main/Detail/TagSelect.styl | 4 ++-- browser/main/Detail/ToggleModeButton.styl | 4 ++-- browser/styles/index.styl | 18 ++++++++++++++---- 5 files changed, 22 insertions(+), 12 deletions(-) diff --git a/browser/components/NoteItem.styl b/browser/components/NoteItem.styl index 9a1cdbf2..6659fd05 100644 --- a/browser/components/NoteItem.styl +++ b/browser/components/NoteItem.styl @@ -441,7 +441,7 @@ body[data-theme="dracula"] .item-title .item-title-icon .item-bottom-time - color $ui-dracula-text-color + color $ui-dracula-active-color .item-bottom-tagList-item background-color alpha(#f8f8f2, 10%) color $ui-dracula-text-color diff --git a/browser/main/Detail/FolderSelect.styl b/browser/main/Detail/FolderSelect.styl index 7232ab2d..fe045e3a 100644 --- a/browser/main/Detail/FolderSelect.styl +++ b/browser/main/Detail/FolderSelect.styl @@ -162,10 +162,10 @@ body[data-theme="monokai"] body[data-theme="dracula"] .root - color $ui-dark-text-color + color $ui-dracula-text-color &:hover color #f8f8f2 - background-color $ui-dracula-button--hover-backgroundColor + background-color $ui-dark-button--hover-backgroundColor border-color $ui-dracula-borderColor .search-optionList @@ -181,7 +181,7 @@ body[data-theme="dracula"] background-color $ui-dracula-button--active-backgroundColor color $ui-dracula-button--active-color &:hover - background-color $ui-dracula-button--active-backgroundColor + background-color $ui-dark-button--hover-backgroundColor color $ui-dracula-button--active-color .search-optionList-item-name-surfix color $ui-dracula-inactive-text-color diff --git a/browser/main/Detail/TagSelect.styl b/browser/main/Detail/TagSelect.styl index e25e7868..68a9816b 100644 --- a/browser/main/Detail/TagSelect.styl +++ b/browser/main/Detail/TagSelect.styl @@ -78,11 +78,11 @@ body[data-theme="monokai"] body[data-theme="dracula"] .tag - background-color $ui-dracula-button-backgroundColor + background-color $ui-dracula-tag-backgroundColor .tag-removeButton border-color $ui-dracula-button--focus-borderColor background-color transparent .tag-label - color $ui-dracula-text-color \ No newline at end of file + color $ui-dracula-borderColor \ No newline at end of file diff --git a/browser/main/Detail/ToggleModeButton.styl b/browser/main/Detail/ToggleModeButton.styl index 21733af6..ddcd2cbd 100644 --- a/browser/main/Detail/ToggleModeButton.styl +++ b/browser/main/Detail/ToggleModeButton.styl @@ -68,5 +68,5 @@ body[data-theme="dracula"] .control-toggleModeButton background-color #282a36 .active - background-color #ff79c6 - box-shadow 2px 0px 7px #222222 \ No newline at end of file + background-color #bd93f9 + box-shadow 2px 0px 7px #222222 diff --git a/browser/styles/index.styl b/browser/styles/index.styl index e5eae141..72a8c5b3 100644 --- a/browser/styles/index.styl +++ b/browser/styles/index.styl @@ -128,6 +128,16 @@ colorMonokaiPrimaryButton() &:active:hover background-color $dark-primary-button-background--active +colorDraculaPrimaryButton() + color $ui-dracula-text-color + background-color $ui-dracula-button-backgroundColor + border none + &:hover + background-color $ui-dracula-button--active-backgroundColor + &:active + &:active:hover + background-color $ui-dracula-button--active-backgroundColor + // Danger button(Brand color) $danger-button-background = #c9302c @@ -391,17 +401,17 @@ $ui-dracula-noteList-backgroundColor = #282a36 $ui-dracula-noteDetail-backgroundColor = #282a36 $ui-dracula-text-color = #f8f8f2 -$ui-dracula-active-color = #50fa7b +$ui-dracula-active-color = #bd93f9 $ui-dracula-borderColor = #44475a $ui-dracula-tag-backgroundColor = #50fa7b $ui-dracula-button-backgroundColor = #44475a -$ui-dracula-button--active-color = #ff79c6 -$ui-dracula-button--active-backgroundColor = #50fa7b +$ui-dracula-button--active-color = #f8f8f2 +$ui-dracula-button--active-backgroundColor = #bd93f9 $ui-dracula-button--hover-backgroundColor = lighten($ui-dracula-backgroundColor, 10%) -$ui-dracula-button--focus-borderColor = lighten(#bd93f9, 25%) +$ui-dracula-button--focus-borderColor = lighten(#44475a, 25%) modalDracula() position relative From f41f4939bc73a54fcf9ebc416781ed7ecc703a43 Mon Sep 17 00:00:00 2001 From: William Grant Date: Sun, 23 Sep 2018 17:10:39 +0200 Subject: [PATCH 03/42] fix for the new folder modal --- browser/main/modals/CreateFolderModal.styl | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/browser/main/modals/CreateFolderModal.styl b/browser/main/modals/CreateFolderModal.styl index e5ebb8ea..93848683 100644 --- a/browser/main/modals/CreateFolderModal.styl +++ b/browser/main/modals/CreateFolderModal.styl @@ -129,7 +129,7 @@ body[data-theme="monokai"] .control-confirmButton colorMonokaiPrimaryButton() -body[data-theme="Dracula"] +body[data-theme="dracula"] .root modalDracula() width 500px @@ -140,10 +140,10 @@ body[data-theme="Dracula"] .header background-color transparent border-color $ui-dark-borderColor - color $ui-Dracula-text-color + color $ui-dracula-text-color .control-folder-label - color $ui-Dracula-text-color + color $ui-dracula-text-color .control-folder-input border 1px solid $ui-input--create-folder-modal From 496090610f311c37c11e2ae045b00834fb4bc729 Mon Sep 17 00:00:00 2001 From: William Grant Date: Mon, 24 Sep 2018 17:20:01 +0200 Subject: [PATCH 04/42] updated tag color to cyan, fixed togglemodebutton styling --- browser/main/Detail/ToggleModeButton.styl | 2 +- browser/styles/index.styl | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/browser/main/Detail/ToggleModeButton.styl b/browser/main/Detail/ToggleModeButton.styl index ddcd2cbd..7abdbdd9 100644 --- a/browser/main/Detail/ToggleModeButton.styl +++ b/browser/main/Detail/ToggleModeButton.styl @@ -66,7 +66,7 @@ body[data-theme="monokai"] body[data-theme="dracula"] .control-toggleModeButton - background-color #282a36 + background-color #44475a .active background-color #bd93f9 box-shadow 2px 0px 7px #222222 diff --git a/browser/styles/index.styl b/browser/styles/index.styl index 72a8c5b3..5c7ecb38 100644 --- a/browser/styles/index.styl +++ b/browser/styles/index.styl @@ -405,7 +405,7 @@ $ui-dracula-active-color = #bd93f9 $ui-dracula-borderColor = #44475a -$ui-dracula-tag-backgroundColor = #50fa7b +$ui-dracula-tag-backgroundColor = #8be9fd $ui-dracula-button-backgroundColor = #44475a $ui-dracula-button--active-color = #f8f8f2 From 686b9bc82ce732bebe81bdb0da57242b1bebb64f Mon Sep 17 00:00:00 2001 From: William Grant Date: Mon, 24 Sep 2018 17:46:31 +0200 Subject: [PATCH 05/42] cleanup duplicated code --- browser/components/RealtimeNotification.styl | 10 ---------- 1 file changed, 10 deletions(-) diff --git a/browser/components/RealtimeNotification.styl b/browser/components/RealtimeNotification.styl index 203cc287..36330c48 100644 --- a/browser/components/RealtimeNotification.styl +++ b/browser/components/RealtimeNotification.styl @@ -53,16 +53,6 @@ body[data-theme="monokai"] &:hover color #5CB85C -body[data-theme="monokai"] - .notification-area - background-color none - - .notification-link - color $ui-monokai-text-color - border none - background-color $ui-monokai-button-backgroundColor - &:hover - color #5CB85C body[data-theme="dracula"] .notification-area background-color none From 504b6af3f6d7a654680409c4e5762c41603deb4e Mon Sep 17 00:00:00 2001 From: William Grant Date: Fri, 28 Sep 2018 17:58:30 +0200 Subject: [PATCH 06/42] fixed TodoListPercentage styling --- browser/components/TodoListPercentage.styl | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/browser/components/TodoListPercentage.styl b/browser/components/TodoListPercentage.styl index af4d25ab..1aef0f4d 100644 --- a/browser/components/TodoListPercentage.styl +++ b/browser/components/TodoListPercentage.styl @@ -62,10 +62,10 @@ body[data-theme="monokai"] body[data-theme="dracula"] .percentageBar - background-color #50fa7b + background-color $ui-dracula-borderColor .progressBar - background-color: #44475a + background-color: $ui-dracula-active-color .percentageText - color #f8f8f2 \ No newline at end of file + color $ui-dracula-text-color \ No newline at end of file From b29c0fe8cbab43e99edb863d7985228ef25e6f80 Mon Sep 17 00:00:00 2001 From: jacobherrington Date: Sat, 29 Sep 2018 23:17:19 -0500 Subject: [PATCH 07/42] Fix TypeError thrown on the Snippets page This commit protects from a TypeError that is consistently thrown on the Snippets page. --- browser/main/modals/PreferencesModal/SnippetTab.js | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/browser/main/modals/PreferencesModal/SnippetTab.js b/browser/main/modals/PreferencesModal/SnippetTab.js index e35ecd69..0e154c29 100644 --- a/browser/main/modals/PreferencesModal/SnippetTab.js +++ b/browser/main/modals/PreferencesModal/SnippetTab.js @@ -27,12 +27,14 @@ class SnippetTab extends React.Component { handleSnippetSelect (snippet) { const { currentSnippet } = this.state - if (currentSnippet === null || currentSnippet.id !== snippet.id) { - dataApi.fetchSnippet(snippet.id).then(changedSnippet => { - // notify the snippet editor to load the content of the new snippet - this.snippetEditor.onSnippetChanged(changedSnippet) - this.setState({currentSnippet: changedSnippet}) - }) + if (snippet !== null) { + if (currentSnippet === null || currentSnippet.id !== snippet.id) { + dataApi.fetchSnippet(snippet.id).then(changedSnippet => { + // notify the snippet editor to load the content of the new snippet + this.snippetEditor.onSnippetChanged(changedSnippet) + this.setState({currentSnippet: changedSnippet}) + }) + } } } From 818ee16e397700ac8ebe02a03596401048b16623 Mon Sep 17 00:00:00 2001 From: Baptiste Augrain Date: Sun, 30 Sep 2018 22:41:49 +0200 Subject: [PATCH 08/42] update codemirror --- package.json | 2 +- yarn.lock | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/package.json b/package.json index f4e5f532..e27370c5 100644 --- a/package.json +++ b/package.json @@ -53,7 +53,7 @@ "aws-sdk": "^2.48.0", "aws-sdk-mobile-analytics": "^0.9.2", "chart.js": "^2.7.2", - "codemirror": "^5.39.0", + "codemirror": "^5.40.2", "codemirror-mode-elixir": "^1.1.1", "electron-config": "^1.0.0", "electron-gh-releases": "^2.0.2", diff --git a/yarn.lock b/yarn.lock index 687bb6de..541cf4a8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1803,9 +1803,9 @@ codemirror@^5.18.2, codemirror@^5.20.2: version "5.38.0" resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.38.0.tgz#26a9551446e51dbdde36aabe60f72469724fd332" -codemirror@^5.39.0: - version "5.39.0" - resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.39.0.tgz#4654f7d2f7e525e04a62e72d9482348ccb37dce5" +codemirror@^5.40.2: + version "5.40.2" + resolved "https://registry.yarnpkg.com/codemirror/-/codemirror-5.40.2.tgz#f4a41fee2d84e679543591b3680af259d903330b" coffee-script@^1.10.0, coffee-script@^1.12.4: version "1.12.7" From d365aaf270be134ab043f97e0b877529b52c7d3d Mon Sep 17 00:00:00 2001 From: Baptiste Augrain Date: Sun, 30 Sep 2018 23:21:48 +0200 Subject: [PATCH 09/42] fix graphical bugs --- browser/main/global.styl | 3 +++ browser/main/modals/PreferencesModal/SnippetList.js | 6 +++++- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/browser/main/global.styl b/browser/main/global.styl index 815cff4e..5f1b14c9 100644 --- a/browser/main/global.styl +++ b/browser/main/global.styl @@ -18,6 +18,9 @@ body ::-webkit-scrollbar width 12px +::-webkit-scrollbar-corner + background-color: transparent; + ::-webkit-scrollbar-thumb background-color rgba(0, 0, 0, 0.15) diff --git a/browser/main/modals/PreferencesModal/SnippetList.js b/browser/main/modals/PreferencesModal/SnippetList.js index 512ae997..3790eb3f 100644 --- a/browser/main/modals/PreferencesModal/SnippetList.js +++ b/browser/main/modals/PreferencesModal/SnippetList.js @@ -55,7 +55,11 @@ class SnippetList extends React.Component { defineSnippetStyleName (snippet) { const { currentSnippet } = this.props - if (currentSnippet == null) return + + if (currentSnippet == null) { + return 'snippet-item' + } + if (currentSnippet.id === snippet.id) { return 'snippet-item-selected' } else { From 3e2a366dc6084ec99e7ba85009be1bda019a8781 Mon Sep 17 00:00:00 2001 From: jacobherrington Date: Sun, 30 Sep 2018 16:57:58 -0500 Subject: [PATCH 10/42] Add a Copy button the Snippets tab --- browser/main/modals/PreferencesModal/SnippetTab.js | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/browser/main/modals/PreferencesModal/SnippetTab.js b/browser/main/modals/PreferencesModal/SnippetTab.js index e35ecd69..f16bac7b 100644 --- a/browser/main/modals/PreferencesModal/SnippetTab.js +++ b/browser/main/modals/PreferencesModal/SnippetTab.js @@ -6,6 +6,7 @@ import i18n from 'browser/lib/i18n' import dataApi from 'browser/main/lib/dataApi' import SnippetList from './SnippetList' import eventEmitter from 'browser/main/lib/eventEmitter' +import copy from 'copy-to-clipboard' class SnippetTab extends React.Component { constructor (props) { @@ -54,6 +55,10 @@ class SnippetTab extends React.Component { } } + handleCopySnippet (e) { + copy(this.state.currentSnippet.content) + } + render () { const { config, storageKey } = this.props const { currentSnippet } = this.state @@ -70,6 +75,13 @@ class SnippetTab extends React.Component { onSnippetDeleted={this.handleDeleteSnippet.bind(this)} currentSnippet={currentSnippet} />
+
+
+ +
+
{i18n.__('Snippet name')}
From babc5626a9e5361b5629fe1e8880ad9e683b4052 Mon Sep 17 00:00:00 2001 From: jacob Date: Mon, 1 Oct 2018 00:07:15 -0500 Subject: [PATCH 11/42] Update ISSUE_TEMPLATE.md --- ISSUE_TEMPLATE.md | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/ISSUE_TEMPLATE.md b/ISSUE_TEMPLATE.md index 1f5ada57..d3fce4c1 100644 --- a/ISSUE_TEMPLATE.md +++ b/ISSUE_TEMPLATE.md @@ -1,15 +1,25 @@ # Current behavior # Expected behavior + + # Steps to reproduce + + 1. 2. 3. From 1ff4206bed7720b5f578b471f49e778156d727bf Mon Sep 17 00:00:00 2001 From: jacob Date: Mon, 1 Oct 2018 00:14:44 -0500 Subject: [PATCH 12/42] Capitalize Boostnote --- ISSUE_TEMPLATE.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ISSUE_TEMPLATE.md b/ISSUE_TEMPLATE.md index d3fce4c1..5554c4b8 100644 --- a/ISSUE_TEMPLATE.md +++ b/ISSUE_TEMPLATE.md @@ -5,7 +5,7 @@ Let us know what is currently happening. Please include some **screenshots** with the **developer tools** open (console tab) when you report a bug. -If your issue is regarding boostnote mobile, please open an issue in the Boostnote Mobile repo 👉 https://github.com/BoostIO/boostnote-mobile. +If your issue is regarding Boostnote mobile, please open an issue in the Boostnote Mobile repo 👉 https://github.com/BoostIO/boostnote-mobile. --> # Expected behavior From 33b40bf35fbd04e1895ca74598716a6a0bbfca2f Mon Sep 17 00:00:00 2001 From: jacobherrington Date: Tue, 2 Oct 2018 05:26:30 -0500 Subject: [PATCH 13/42] Add notification for copying snippets --- .../modals/PreferencesModal/SnippetTab.js | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/browser/main/modals/PreferencesModal/SnippetTab.js b/browser/main/modals/PreferencesModal/SnippetTab.js index f16bac7b..460d33d6 100644 --- a/browser/main/modals/PreferencesModal/SnippetTab.js +++ b/browser/main/modals/PreferencesModal/SnippetTab.js @@ -8,6 +8,8 @@ import SnippetList from './SnippetList' import eventEmitter from 'browser/main/lib/eventEmitter' import copy from 'copy-to-clipboard' +const path = require('path') + class SnippetTab extends React.Component { constructor (props) { super(props) @@ -17,6 +19,17 @@ class SnippetTab extends React.Component { this.changeDelay = null } + notify (title, options) { + if (global.process.platform === 'win32') { + options.icon = path.join( + 'file://', + global.__dirname, + '../../resources/app.png' + ) + } + return new window.Notification(title, options) + } + handleSnippetNameOrPrefixChange () { clearTimeout(this.changeDelay) this.changeDelay = setTimeout(() => { @@ -56,7 +69,14 @@ class SnippetTab extends React.Component { } handleCopySnippet (e) { + const showCopyNotification = this.props.config.ui.showCopyNotification copy(this.state.currentSnippet.content) + if (showCopyNotification) { + this.notify('Saved to Clipboard!', { + body: 'Paste it wherever you want!', + silent: true + }) + } } render () { From 14fec7473ab4c82b1addec5012b193cff0e4db9a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nguy=E1=BB=85n=20Vi=E1=BB=87t=20H=C6=B0ng?= Date: Tue, 2 Oct 2018 20:52:51 +0700 Subject: [PATCH 14/42] added linethrough checkbox and make it optional --- browser/components/MarkdownPreview.js | 1 + browser/components/markdown.styl | 3 +++ browser/lib/markdown.js | 12 ++++++++++-- browser/main/lib/ConfigManager.js | 3 ++- browser/main/modals/PreferencesModal/UiTab.js | 11 +++++++++++ 5 files changed, 27 insertions(+), 3 deletions(-) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index b3d59b47..0114f515 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -483,6 +483,7 @@ export default class MarkdownPreview extends React.Component { eventEmitter.on('export:save-md', this.saveAsMdHandler) eventEmitter.on('export:save-html', this.saveAsHtmlHandler) eventEmitter.on('print', this.printHandler) + eventEmitter.on('config-renew', this.rewriteIframe.bind(this)) } componentWillUnmount () { diff --git a/browser/components/markdown.styl b/browser/components/markdown.styl index fb30742d..c7252c11 100644 --- a/browser/components/markdown.styl +++ b/browser/components/markdown.styl @@ -80,6 +80,9 @@ li &.checked text-decoration line-through opacity 0.5 + &.taskListItem.checked + text-decoration line-through + opacity 0.5 div.math-rendered text-align center .math-failed diff --git a/browser/lib/markdown.js b/browser/lib/markdown.js index ed4fbca1..20782a81 100644 --- a/browser/lib/markdown.js +++ b/browser/lib/markdown.js @@ -7,6 +7,7 @@ import _ from 'lodash' import ConfigManager from 'browser/main/lib/ConfigManager' import katex from 'katex' import { lastFindInArray } from './utils' +import ee from 'browser/main/lib/eventEmitter' function createGutter (str, firstLineNumber) { if (Number.isNaN(firstLineNumber)) firstLineNumber = 1 @@ -20,7 +21,7 @@ function createGutter (str, firstLineNumber) { class Markdown { constructor (options = {}) { - const config = ConfigManager.get() + let config = ConfigManager.get() const defaultOptions = { typographer: config.preview.smartQuotes, linkify: true, @@ -223,7 +224,11 @@ class Markdown { if (!liToken.attrs) { liToken.attrs = [] } - liToken.attrs.push(['class', 'taskListItem']) + if (config.preview.lineThroughCheckbox) { + liToken.attrs.push(['class', `taskListItem${match[1] !== ' ' ? ' checked' : ''}`]) + } else { + liToken.attrs.push(['class', 'taskListItem']) + } } content = `` } @@ -260,6 +265,9 @@ class Markdown { } // FIXME We should not depend on global variable. window.md = this.md + ee.on('config-renew', () => { + config = ConfigManager.get() + }) } render (content) { diff --git a/browser/main/lib/ConfigManager.js b/browser/main/lib/ConfigManager.js index 5ffb1bc7..41198eb5 100644 --- a/browser/main/lib/ConfigManager.js +++ b/browser/main/lib/ConfigManager.js @@ -65,7 +65,8 @@ export const DEFAULT_CONFIG = { smartArrows: false, allowCustomCSS: false, customCSS: '', - sanitize: 'STRICT' // 'STRICT', 'ALLOW_STYLES', 'NONE' + sanitize: 'STRICT', // 'STRICT', 'ALLOW_STYLES', 'NONE' + lineThroughCheckbox: true }, blog: { type: 'wordpress', // Available value: wordpress, add more types in the future plz diff --git a/browser/main/modals/PreferencesModal/UiTab.js b/browser/main/modals/PreferencesModal/UiTab.js index a45e1387..374cbe34 100644 --- a/browser/main/modals/PreferencesModal/UiTab.js +++ b/browser/main/modals/PreferencesModal/UiTab.js @@ -107,6 +107,7 @@ class UiTab extends React.Component { smartArrows: this.refs.previewSmartArrows.checked, sanitize: this.refs.previewSanitize.value, allowCustomCSS: this.refs.previewAllowCustomCSS.checked, + lineThroughCheckbox: this.refs.lineThroughCheckbox.checked, customCSS: this.customCSSCM.getCodeMirror().getValue() } } @@ -512,6 +513,16 @@ class UiTab extends React.Component {
+
+ +
) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index e69f312e..47f30ecc 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -484,10 +484,6 @@ export default class MarkdownPreview extends React.Component { eventEmitter.on('export:save-md', this.saveAsMdHandler) eventEmitter.on('export:save-html', this.saveAsHtmlHandler) eventEmitter.on('print', this.printHandler) - eventEmitter.on('config-renew', () => { - this.markdown.updateConfig() - this.rewriteIframe() - }) } componentWillUnmount () { @@ -531,7 +527,8 @@ export default class MarkdownPreview extends React.Component { prevProps.smartQuotes !== this.props.smartQuotes || prevProps.sanitize !== this.props.sanitize || prevProps.smartArrows !== this.props.smartArrows || - prevProps.breaks !== this.props.breaks + prevProps.breaks !== this.props.breaks || + prevProps.lineThroughCheckbox !== this.props.lineThroughCheckbox ) { this.initMarkdown() this.rewriteIframe() diff --git a/browser/components/MarkdownSplitEditor.js b/browser/components/MarkdownSplitEditor.js index d714125a..208a29b4 100644 --- a/browser/components/MarkdownSplitEditor.js +++ b/browser/components/MarkdownSplitEditor.js @@ -192,6 +192,7 @@ class MarkdownSplitEditor extends React.Component { noteKey={noteKey} customCSS={config.preview.customCSS} allowCustomCSS={config.preview.allowCustomCSS} + lineThroughCheckbox={config.preview.lineThroughCheckbox} />
) From 3c404f36784548675f4569e0cb86c4a3c8163f27 Mon Sep 17 00:00:00 2001 From: Baptiste Augrain Date: Thu, 11 Oct 2018 15:09:26 +0200 Subject: [PATCH 26/42] remove unused method --- browser/lib/markdown.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/browser/lib/markdown.js b/browser/lib/markdown.js index 248dbb4b..49260740 100644 --- a/browser/lib/markdown.js +++ b/browser/lib/markdown.js @@ -21,7 +21,7 @@ function createGutter (str, firstLineNumber) { class Markdown { constructor (options = {}) { - let config = ConfigManager.get() + const config = ConfigManager.get() const defaultOptions = { typographer: config.preview.smartQuotes, linkify: true, @@ -265,9 +265,6 @@ class Markdown { } // FIXME We should not depend on global variable. window.md = this.md - this.updateConfig = () => { - config = ConfigManager.get() - } } render (content) { From e536d203d22401f0ae7214b4efe75796aa4fe56d Mon Sep 17 00:00:00 2001 From: antogyn Date: Sat, 13 Oct 2018 14:21:46 +0200 Subject: [PATCH 27/42] feat(editor): add ability to jump to line --- browser/components/CodeEditor.js | 10 +++++++++- browser/components/MarkdownPreview.js | 9 +++++++++ 2 files changed, 18 insertions(+), 1 deletion(-) diff --git a/browser/components/CodeEditor.js b/browser/components/CodeEditor.js index c36a50c1..9953f9bf 100644 --- a/browser/components/CodeEditor.js +++ b/browser/components/CodeEditor.js @@ -57,6 +57,7 @@ export default class CodeEditor extends React.Component { } this.searchHandler = (e, msg) => this.handleSearch(msg) this.searchState = null + this.scrollToLineHandeler = this.scrollToLine.bind(this) this.formatTable = () => this.handleFormatTable() this.editorActivityHandler = () => this.handleEditorActivity() @@ -125,6 +126,7 @@ export default class CodeEditor extends React.Component { componentDidMount () { const { rulers, enableRulers } = this.props const expandSnippet = this.expandSnippet.bind(this) + eventEmitter.on('line:jump', this.scrollToLineHandeler) const defaultSnippet = [ { @@ -475,7 +477,13 @@ export default class CodeEditor extends React.Component { moveCursorTo (row, col) {} - scrollToLine (num) {} + scrollToLine (event, num) { + const cursor = { + line: num, + ch: 1 + } + this.editor.setCursor(cursor) + } focus () { this.editor.focus() diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index e69f312e..dbb2acd7 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -860,6 +860,15 @@ export default class MarkdownPreview extends React.Component { return } + const regexIsLine = /^:line:[0-9]/ + if (regexIsLine.test(linkHash)) { + const numberPattern = /\d+/g + + const lineNumber = parseInt(linkHash.match(numberPattern)[0]) + eventEmitter.emit('line:jump', lineNumber) + return + } + // this will match the old link format storage.key-note.key // e.g. // 877f99c3268608328037-1c211eb7dcb463de6490 From 1da477d1d1992b5741dc4686e9a501ca857a90c5 Mon Sep 17 00:00:00 2001 From: Baptiste Augrain Date: Mon, 15 Oct 2018 08:09:50 +0200 Subject: [PATCH 28/42] add context menu to delete tag --- browser/components/TagListItem.js | 4 +- browser/main/Detail/MarkdownNoteDetail.js | 2 +- browser/main/Main.js | 2 +- browser/main/SideNav/index.js | 59 +++++++++++++++++++ .../TagListItem.snapshot.test.js.snap | 1 + 5 files changed, 64 insertions(+), 4 deletions(-) diff --git a/browser/components/TagListItem.js b/browser/components/TagListItem.js index 6cd50c9c..19f11791 100644 --- a/browser/components/TagListItem.js +++ b/browser/components/TagListItem.js @@ -14,8 +14,8 @@ import CSSModules from 'browser/lib/CSSModules' * @param {bool} isRelated */ -const TagListItem = ({name, handleClickTagListItem, handleClickNarrowToTag, isActive, isRelated, count}) => ( -
+const TagListItem = ({name, handleClickTagListItem, handleClickNarrowToTag, handleContextMenu, isActive, isRelated, count}) => ( +
handleContextMenu(e, name)}> {isRelated ?
this.handleSwitchMode(e)} editorType={editorType} /> From ff3026686ff7a8c8954d94527dbfb4538c9addcd Mon Sep 17 00:00:00 2001 From: Junyoung Choi Date: Fri, 19 Oct 2018 19:04:53 +0900 Subject: [PATCH 34/42] v0.11.10 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index be70464b..d39d6f37 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "boost", "productName": "Boostnote", - "version": "0.11.9", + "version": "0.11.10", "main": "index.js", "description": "Boostnote", "license": "GPL-3.0", From 5aaecfc0fe8a4ac76b62c669c27a159205b05271 Mon Sep 17 00:00:00 2001 From: Baptiste Augrain Date: Fri, 19 Oct 2018 14:06:21 +0200 Subject: [PATCH 35/42] fix color for even rows in table --- extra_scripts/codemirror/mode/bfm/bfm.css | 5 +-- extra_scripts/codemirror/mode/bfm/bfm.js | 3 ++ gruntfile.js | 44 ++++++++++++++++++++--- 3 files changed, 45 insertions(+), 7 deletions(-) diff --git a/extra_scripts/codemirror/mode/bfm/bfm.css b/extra_scripts/codemirror/mode/bfm/bfm.css index cb6fd638..f14d6f7c 100644 --- a/extra_scripts/codemirror/mode/bfm/bfm.css +++ b/extra_scripts/codemirror/mode/bfm/bfm.css @@ -34,11 +34,12 @@ .cm-s-rubyblue.CodeMirror .cm-table-row-even { background-color: rgb(41, 58, 73); } .cm-s-seti.CodeMirror .cm-table-row-even { background-color: rgb(40, 42, 43); } .cm-s-shadowfox.CodeMirror .cm-table-row-even { background-color: rgb(56, 56, 59); } -.cm-s-solarized.CodeMirror .cm-table-row-even { background-color: rgb(242, 242, 242); } .cm-s-the-matrix.CodeMirror .cm-table-row-even { background-color: rgb(0, 26, 0); } .cm-s-tomorrow-night-bright.CodeMirror .cm-table-row-even { background-color: rgb(23, 23, 23); } .cm-s-tomorrow-night-eighties.CodeMirror .cm-table-row-even { background-color: rgb(20, 20, 20); } .cm-s-twilight.CodeMirror .cm-table-row-even { background-color: rgb(43, 43, 43); } .cm-s-vibrant-ink.CodeMirror .cm-table-row-even { background-color: rgb(26, 26, 26); } .cm-s-xq-dark.CodeMirror .cm-table-row-even { background-color: rgb(34, 25, 53); } -.cm-s-yeti.CodeMirror .cm-table-row-even { background-color: rgb(235, 232, 230); } \ No newline at end of file +.cm-s-yeti.CodeMirror .cm-table-row-even { background-color: rgb(235, 232, 230); } +.cm-s-solarized.cm-s-dark .cm-table-row-even { background-color: rgb(13, 54, 64); } +.cm-s-solarized.cm-s-light .cm-table-row-even { background-color: rgb(245, 240, 222); } \ No newline at end of file diff --git a/extra_scripts/codemirror/mode/bfm/bfm.js b/extra_scripts/codemirror/mode/bfm/bfm.js index 1cd9e87c..baf65d18 100644 --- a/extra_scripts/codemirror/mode/bfm/bfm.js +++ b/extra_scripts/codemirror/mode/bfm/bfm.js @@ -54,6 +54,9 @@ stream.skipToEnd() return null + }, + blankLine(state) { + state.inTable = false } } diff --git a/gruntfile.js b/gruntfile.js index 651640fc..883e536c 100644 --- a/gruntfile.js +++ b/gruntfile.js @@ -289,9 +289,24 @@ module.exports = function (grunt) { const Color = require('color') const parseCSS = require('css').parse + function generateRule(selector, bgColor, fgColor) { + if (bgColor.isLight()) { + bgColor = bgColor.mix(fgColor, 0.05) + } else { + bgColor = bgColor.mix(fgColor, 0.1) + } + + if (selector && selector.length > 0) { + return `${selector} .cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` + } + else { + return `.cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` + } + } + const root = path.join(__dirname, 'node_modules/codemirror/theme/') - const colors = fs.readdirSync(root).map(file => { + const colors = fs.readdirSync(root).filter(file => file !== 'solarized.css').map(file => { const css = parseCSS(fs.readFileSync(path.join(root, file), 'utf8')) const rules = css.stylesheet.rules.filter(rule => rule.selectors && /\b\.CodeMirror$/.test(rule.selectors[0])) @@ -313,19 +328,38 @@ module.exports = function (grunt) { } }) - if (bgColor.isLight()) { + /* if (bgColor.isLight()) { bgColor = bgColor.mix(fgColor, 0.05) } else { bgColor = bgColor.mix(fgColor, 0.1) } - return `${rules[0].selectors[0]} .cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` + return `${rules[0].selectors[0]} .cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` */ + return generateRule(rules[0].selectors[0], bgColor, fgColor) } }).filter(value => !!value) - const defaultBgColor = Color('white').mix(Color('black'), 0.05) + //const defaultBgColor = Color('white').mix(Color('black'), 0.05) - fs.writeFileSync(path.join(__dirname, 'extra_scripts/codemirror/mode/bfm/bfm.css'), [`.cm-table-row-even { background-color: ${defaultBgColor.rgb().string()}; }`, ...colors].join('\n'), 'utf8') + // default + colors.unshift(generateRule(null, Color('white'), Color('black'))) + // solarized dark + colors.push(generateRule('.cm-s-solarized.cm-s-dark', Color('#002b36'), Color('#839496'))) + // solarized light + colors.push(generateRule('.cm-s-solarized.cm-s-light', Color('#fdf6e3'), Color('#657b83'))) + /* .cm-s-solarized.cm-s-dark { + color: #839496; + background-color: #002b36; + text-shadow: #002b36 0 1px; +} +.cm-s-solarized.cm-s-light { + background-color: #fdf6e3; + color: #657b83; + text-shadow: #eee8d5 0 1px; +} */ + + /* fs.writeFileSync(path.join(__dirname, 'extra_scripts/codemirror/mode/bfm/bfm.css'), [`.cm-table-row-even { background-color: ${defaultBgColor.rgb().string()}; }`, ...colors].join('\n'), 'utf8') */ + fs.writeFileSync(path.join(__dirname, 'extra_scripts/codemirror/mode/bfm/bfm.css'), colors.join('\n'), 'utf8') }) grunt.registerTask('default', ['build']) From 9d84fe77195a8ccb41b8043a66997af7eca6c01d Mon Sep 17 00:00:00 2001 From: Baptiste Augrain Date: Fri, 19 Oct 2018 14:09:13 +0200 Subject: [PATCH 36/42] fix lint errors --- gruntfile.js | 43 +++++++++++-------------------------------- 1 file changed, 11 insertions(+), 32 deletions(-) diff --git a/gruntfile.js b/gruntfile.js index 883e536c..ec3bbf79 100644 --- a/gruntfile.js +++ b/gruntfile.js @@ -289,19 +289,18 @@ module.exports = function (grunt) { const Color = require('color') const parseCSS = require('css').parse - function generateRule(selector, bgColor, fgColor) { + function generateRule (selector, bgColor, fgColor) { if (bgColor.isLight()) { - bgColor = bgColor.mix(fgColor, 0.05) - } else { - bgColor = bgColor.mix(fgColor, 0.1) - } + bgColor = bgColor.mix(fgColor, 0.05) + } else { + bgColor = bgColor.mix(fgColor, 0.1) + } - if (selector && selector.length > 0) { - return `${selector} .cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` - } - else { - return `.cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` - } + if (selector && selector.length > 0) { + return `${selector} .cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` + } else { + return `.cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` + } } const root = path.join(__dirname, 'node_modules/codemirror/theme/') @@ -319,7 +318,7 @@ module.exports = function (grunt) { bgColor = Color(declaration.value.split(' ')[0]) } else if (declaration.property === 'color') { const value = /^(.*?)(?:\s*!important)?$/.exec(declaration.value)[1] - let match = /^rgba\((.*?),\s*1\)$/.exec(value) + const match = /^rgba\((.*?),\s*1\)$/.exec(value) if (match) { fgColor = Color(`rgb(${match[1]})`) } else { @@ -328,37 +327,17 @@ module.exports = function (grunt) { } }) - /* if (bgColor.isLight()) { - bgColor = bgColor.mix(fgColor, 0.05) - } else { - bgColor = bgColor.mix(fgColor, 0.1) - } - - return `${rules[0].selectors[0]} .cm-table-row-even { background-color: ${bgColor.rgb().string()}; }` */ return generateRule(rules[0].selectors[0], bgColor, fgColor) } }).filter(value => !!value) - //const defaultBgColor = Color('white').mix(Color('black'), 0.05) - // default colors.unshift(generateRule(null, Color('white'), Color('black'))) // solarized dark colors.push(generateRule('.cm-s-solarized.cm-s-dark', Color('#002b36'), Color('#839496'))) // solarized light colors.push(generateRule('.cm-s-solarized.cm-s-light', Color('#fdf6e3'), Color('#657b83'))) - /* .cm-s-solarized.cm-s-dark { - color: #839496; - background-color: #002b36; - text-shadow: #002b36 0 1px; -} -.cm-s-solarized.cm-s-light { - background-color: #fdf6e3; - color: #657b83; - text-shadow: #eee8d5 0 1px; -} */ - /* fs.writeFileSync(path.join(__dirname, 'extra_scripts/codemirror/mode/bfm/bfm.css'), [`.cm-table-row-even { background-color: ${defaultBgColor.rgb().string()}; }`, ...colors].join('\n'), 'utf8') */ fs.writeFileSync(path.join(__dirname, 'extra_scripts/codemirror/mode/bfm/bfm.css'), colors.join('\n'), 'utf8') }) From 0e38f61c85031949aadcc45f4e83fbb50531806f Mon Sep 17 00:00:00 2001 From: David Nagle Date: Fri, 19 Oct 2018 10:59:37 -0700 Subject: [PATCH 37/42] Title will now be extracted from front matter if title: is present. --- browser/lib/findNoteTitle.js | 29 ++++++++++++++++++----------- tests/lib/find-title-test.js | 6 ++++-- 2 files changed, 22 insertions(+), 13 deletions(-) diff --git a/browser/lib/findNoteTitle.js b/browser/lib/findNoteTitle.js index b954f172..f28e44de 100644 --- a/browser/lib/findNoteTitle.js +++ b/browser/lib/findNoteTitle.js @@ -6,6 +6,11 @@ export function findNoteTitle (value) { if (splitted[0] === '---') { let line = 0 while (++line < splitted.length) { + if (splitted[line].startsWith('title:')) { + title = splitted[line].substring(6).trim() + + break + } if (splitted[line] === '---') { splitted.splice(0, line + 1) @@ -14,17 +19,19 @@ export function findNoteTitle (value) { } } - splitted.some((line, index) => { - const trimmedLine = line.trim() - const trimmedNextLine = splitted[index + 1] === undefined ? '' : splitted[index + 1].trim() - if (trimmedLine.match('```')) { - isInsideCodeBlock = !isInsideCodeBlock - } - if (isInsideCodeBlock === false && (trimmedLine.match(/^# +/) || trimmedNextLine.match(/^=+$/))) { - title = trimmedLine - return true - } - }) + if (title === null) { + splitted.some((line, index) => { + const trimmedLine = line.trim() + const trimmedNextLine = splitted[index + 1] === undefined ? '' : splitted[index + 1].trim() + if (trimmedLine.match('```')) { + isInsideCodeBlock = !isInsideCodeBlock + } + if (isInsideCodeBlock === false && (trimmedLine.match(/^# +/) || trimmedNextLine.match(/^=+$/))) { + title = trimmedLine + return true + } + }) + } if (title === null) { title = '' diff --git a/tests/lib/find-title-test.js b/tests/lib/find-title-test.js index f587804c..1e9daa0f 100644 --- a/tests/lib/find-title-test.js +++ b/tests/lib/find-title-test.js @@ -15,7 +15,10 @@ test('findNoteTitle#find should return a correct title (string)', t => { ['====', '===='], ['```\n# hoge\n```', '```'], ['hoge', 'hoge'], - ['---\nlayout: test\n---\n # hoge', '# hoge'] + ['---\nlayout: test\n---\n # hoge', '# hoge'], + ['---\nlayout: test\ntitle: hoge hoge hoge \n---\n# fuga', 'hoge hoge hoge'], + ['---\ntitle:hoge\n---\n# fuga', 'hoge'], + ['title: fuga\n# hoge', '# hoge'] ] testCases.forEach(testCase => { @@ -23,4 +26,3 @@ test('findNoteTitle#find should return a correct title (string)', t => { t.is(findNoteTitle(input), expected, `Test for find() input: ${input} expected: ${expected}`) }) }) - From 73d1bdf84bf06e0f161a9dc8745fd557b0fa691f Mon Sep 17 00:00:00 2001 From: David Nagle Date: Fri, 19 Oct 2018 14:29:48 -0700 Subject: [PATCH 38/42] Prevent empty printed page with scroll-past-end --- browser/components/MarkdownPreview.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/browser/components/MarkdownPreview.js b/browser/components/MarkdownPreview.js index e69f312e..749bd43f 100755 --- a/browser/components/MarkdownPreview.js +++ b/browser/components/MarkdownPreview.js @@ -88,6 +88,11 @@ body { font-size: ${fontSize}px; ${scrollPastEnd && 'padding-bottom: 90vh;'} } +@media print { + body { + padding-bottom: initial; + } +} code { font-family: '${codeBlockFontFamily.join("','")}'; background-color: rgba(0,0,0,0.04); From 3272033c632a4e7386d5901606b915aee6f81fd5 Mon Sep 17 00:00:00 2001 From: David Nagle Date: Fri, 19 Oct 2018 13:41:32 -0700 Subject: [PATCH 39/42] Added preferences to support toggling front matter title extraction on/off and to customize what field is used for the title. --- browser/lib/findNoteTitle.js | 6 +-- browser/main/Detail/MarkdownNoteDetail.js | 2 +- browser/main/Detail/SnippetNoteDetail.js | 2 +- browser/main/lib/ConfigManager.js | 4 +- browser/main/modals/PreferencesModal/UiTab.js | 29 ++++++++++++- tests/lib/find-title-test.js | 42 ++++++++++++++++++- 6 files changed, 76 insertions(+), 9 deletions(-) diff --git a/browser/lib/findNoteTitle.js b/browser/lib/findNoteTitle.js index f28e44de..912c3bdd 100644 --- a/browser/lib/findNoteTitle.js +++ b/browser/lib/findNoteTitle.js @@ -1,4 +1,4 @@ -export function findNoteTitle (value) { +export function findNoteTitle (value, enableFrontMatterTitle, frontMatterTitleField = 'title') { const splitted = value.split('\n') let title = null let isInsideCodeBlock = false @@ -6,8 +6,8 @@ export function findNoteTitle (value) { if (splitted[0] === '---') { let line = 0 while (++line < splitted.length) { - if (splitted[line].startsWith('title:')) { - title = splitted[line].substring(6).trim() + if (enableFrontMatterTitle && splitted[line].startsWith(frontMatterTitleField + ':')) { + title = splitted[line].substring(frontMatterTitleField.length + 1).trim() break } diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js index e4493a80..fe98c8bf 100755 --- a/browser/main/Detail/MarkdownNoteDetail.js +++ b/browser/main/Detail/MarkdownNoteDetail.js @@ -91,7 +91,7 @@ class MarkdownNoteDetail extends React.Component { handleUpdateContent () { const { note } = this.state note.content = this.refs.content.value - note.title = markdown.strip(striptags(findNoteTitle(note.content))) + note.title = markdown.strip(striptags(findNoteTitle(note.content, this.props.config.editor.enableFrontMatterTitle, this.props.config.editor.frontMatterTitleField))) this.updateNote(note) } diff --git a/browser/main/Detail/SnippetNoteDetail.js b/browser/main/Detail/SnippetNoteDetail.js index 9356a02c..65d5dfd3 100644 --- a/browser/main/Detail/SnippetNoteDetail.js +++ b/browser/main/Detail/SnippetNoteDetail.js @@ -112,7 +112,7 @@ class SnippetNoteDetail extends React.Component { if (this.refs.tags) note.tags = this.refs.tags.value note.description = this.refs.description.value note.updatedAt = new Date() - note.title = findNoteTitle(note.description) + note.title = findNoteTitle(note.description, false) this.setState({ note diff --git a/browser/main/lib/ConfigManager.js b/browser/main/lib/ConfigManager.js index 1727deb8..33cab7aa 100644 --- a/browser/main/lib/ConfigManager.js +++ b/browser/main/lib/ConfigManager.js @@ -47,7 +47,9 @@ export const DEFAULT_CONFIG = { scrollPastEnd: false, type: 'SPLIT', fetchUrlTitle: true, - enableTableEditor: false + enableTableEditor: false, + enableFrontMatterTitle: true, + frontMatterTitleField: 'title' }, preview: { fontSize: '14', diff --git a/browser/main/modals/PreferencesModal/UiTab.js b/browser/main/modals/PreferencesModal/UiTab.js index 97f3877c..638fab90 100644 --- a/browser/main/modals/PreferencesModal/UiTab.js +++ b/browser/main/modals/PreferencesModal/UiTab.js @@ -89,7 +89,9 @@ class UiTab extends React.Component { snippetDefaultLanguage: this.refs.editorSnippetDefaultLanguage.value, scrollPastEnd: this.refs.scrollPastEnd.checked, fetchUrlTitle: this.refs.editorFetchUrlTitle.checked, - enableTableEditor: this.refs.enableTableEditor.checked + enableTableEditor: this.refs.enableTableEditor.checked, + enableFrontMatterTitle: this.refs.enableFrontMatterTitle.checked, + frontMatterTitleField: this.refs.frontMatterTitleField.value }, preview: { fontSize: this.refs.previewFontSize.value, @@ -428,6 +430,31 @@ class UiTab extends React.Component {
+
+
+ {i18n.__('Front matter title field')} +
+
+ this.handleUIChange(e)} + type='text' + /> +
+
+ +
+ +
+