mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-13 17:56:25 +00:00
add note mode tab
This commit is contained in:
@@ -318,6 +318,16 @@ class MarkdownNoteDetail extends React.Component {
|
|||||||
value={this.state.note.tags}
|
value={this.state.note.tags}
|
||||||
onChange={(e) => this.handleChange(e)}
|
onChange={(e) => this.handleChange(e)}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
<div styleName='mode-tab'>
|
||||||
|
<div styleName='active'>
|
||||||
|
<img styleName='item-star' src='../resources/icon/icon-WYSIWYG-on.svg' />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img styleName='item-star' src='../resources/icon/icon-code-off.svg' />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<TodoListPercentage
|
<TodoListPercentage
|
||||||
percentageOfTodo={getTodoPercentageOfCompleted(note.content)}
|
percentageOfTodo={getTodoPercentageOfCompleted(note.content)}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -34,6 +34,28 @@
|
|||||||
.body-noteEditor
|
.body-noteEditor
|
||||||
absolute top bottom left right
|
absolute top bottom left right
|
||||||
|
|
||||||
|
.mode-tab
|
||||||
|
border 1px solid #eee
|
||||||
|
height 34px
|
||||||
|
display flex
|
||||||
|
align-items center
|
||||||
|
div
|
||||||
|
width 100px
|
||||||
|
height 100%
|
||||||
|
background-color #f9f9f9
|
||||||
|
display flex
|
||||||
|
align-items center
|
||||||
|
justify-content center
|
||||||
|
cursor pointer
|
||||||
|
&:first-child
|
||||||
|
border-right 1px solid #eee
|
||||||
|
img
|
||||||
|
transform scale(0.7)
|
||||||
|
.active
|
||||||
|
background-color #fff
|
||||||
|
box-shadow 2px 0px 7px #eee
|
||||||
|
z-index 1
|
||||||
|
|
||||||
body[data-theme="white"]
|
body[data-theme="white"]
|
||||||
.root
|
.root
|
||||||
box-shadow $note-detail-box-shadow
|
box-shadow $note-detail-box-shadow
|
||||||
|
|||||||
@@ -6,6 +6,7 @@
|
|||||||
width 100%
|
width 100%
|
||||||
overflow-x scroll
|
overflow-x scroll
|
||||||
white-space nowrap
|
white-space nowrap
|
||||||
|
margin-right 10px
|
||||||
|
|
||||||
.root::-webkit-scrollbar
|
.root::-webkit-scrollbar
|
||||||
display none
|
display none
|
||||||
|
|||||||
27
resources/icon/icon-WYSIWYG-off.svg
Normal file
27
resources/icon/icon-WYSIWYG-off.svg
Normal file
@@ -0,0 +1,27 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
|
||||||
|
<title>icon-WYSIWYG-off</title>
|
||||||
|
<desc>Created with Sketch.</desc>
|
||||||
|
<defs>
|
||||||
|
<filter x="0.0%" y="0.0%" width="100.0%" height="100.0%" filterUnits="objectBoundingBox" id="filter-1">
|
||||||
|
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||||
|
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0" type="matrix" in="shadowOffsetOuter1" result="shadowMatrixOuter1"></feColorMatrix>
|
||||||
|
<feMerge>
|
||||||
|
<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
|
||||||
|
<feMergeNode in="SourceGraphic"></feMergeNode>
|
||||||
|
</feMerge>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<g id="Artboard-4" transform="translate(-1378.000000, -372.000000)" stroke="#1EC38B" stroke-width="1.43999988">
|
||||||
|
<g id="Group" filter="url(#filter-1)" transform="translate(1336.000000, 363.000000)">
|
||||||
|
<g id="icon-WYSIWYG-off" transform="translate(43.000000, 9.714286)">
|
||||||
|
<path d="M12.768,7.79918367 C14.4091141,6.17242331 14.4091141,3.53492363 12.768,1.90816327 C11.1268859,0.281402899 8.46611413,0.281402899 6.825,1.90816327 L2.1,6.59183673 L2.1,12.4897959 L8.05,12.4897959 L12.768,7.79918367 Z" id="Shape"></path>
|
||||||
|
<path d="M9.8,4.85714286 L0,14.5714286" id="Shape"></path>
|
||||||
|
<path d="M10.5,9.71428571 L4.9,9.71428571" id="Shape"></path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.8 KiB |
16
resources/icon/icon-WYSIWYG-on.svg
Normal file
16
resources/icon/icon-WYSIWYG-on.svg
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg width="22px" height="22px" viewBox="0 0 22 22" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
|
||||||
|
<title>icon-WYSIWYG-on</title>
|
||||||
|
<desc>Created with Sketch.</desc>
|
||||||
|
<defs></defs>
|
||||||
|
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<g id="Artboard-4" transform="translate(-1254.000000, -293.000000)" stroke="#1EC38B" stroke-width="2">
|
||||||
|
<g id="icon-WYSIWYG-on" transform="translate(1255.000000, 293.000000)">
|
||||||
|
<path d="M18.24,11.24 C20.5844488,8.89555124 20.5844488,5.09444876 18.24,2.75 C15.8955512,0.405551237 12.0944488,0.405551237 9.75,2.75 L3,9.5 L3,18 L11.5,18 L18.24,11.24 Z" id="Shape"></path>
|
||||||
|
<path d="M14,7 L0,21" id="Shape"></path>
|
||||||
|
<path d="M15,14 L7,14" id="Shape"></path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.0 KiB |
17
resources/icon/icon-code-off.svg
Normal file
17
resources/icon/icon-code-off.svg
Normal file
@@ -0,0 +1,17 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg width="18px" height="20px" viewBox="0 0 18 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
|
||||||
|
<title>icon-code-off</title>
|
||||||
|
<desc>Created with Sketch.</desc>
|
||||||
|
<defs></defs>
|
||||||
|
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<g id="Artboard-4" transform="translate(-1317.000000, -294.000000)" stroke="#8A8C8D" stroke-width="2">
|
||||||
|
<g id="icon-code-off" transform="translate(1318.000000, 295.000000)">
|
||||||
|
<path d="M0,6 L16,6" id="Shape"></path>
|
||||||
|
<path d="M0,12 L16,12" id="Shape"></path>
|
||||||
|
<path d="M6,0 L4,18" id="Shape"></path>
|
||||||
|
<path d="M12,0 L10,18" id="Shape"></path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 952 B |
28
resources/icon/icon-code-on.svg
Normal file
28
resources/icon/icon-code-on.svg
Normal file
@@ -0,0 +1,28 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg width="14px" height="15px" viewBox="0 0 14 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||||
|
<!-- Generator: Sketch 47.1 (45422) - http://www.bohemiancoding.com/sketch -->
|
||||||
|
<title>icon-code-on</title>
|
||||||
|
<desc>Created with Sketch.</desc>
|
||||||
|
<defs>
|
||||||
|
<filter x="0.0%" y="0.0%" width="100.0%" height="100.0%" filterUnits="objectBoundingBox" id="filter-1">
|
||||||
|
<feOffset dx="0" dy="0" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
|
||||||
|
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0" type="matrix" in="shadowOffsetOuter1" result="shadowMatrixOuter1"></feColorMatrix>
|
||||||
|
<feMerge>
|
||||||
|
<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
|
||||||
|
<feMergeNode in="SourceGraphic"></feMergeNode>
|
||||||
|
</feMerge>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<g id="Artboard-4" transform="translate(-1480.000000, -373.000000)" stroke="#1EC38B" stroke-width="1.43999988">
|
||||||
|
<g id="Group" filter="url(#filter-1)" transform="translate(1336.000000, 363.000000)">
|
||||||
|
<g id="icon-code-on" transform="translate(145.000000, 11.657143)">
|
||||||
|
<path d="M0,4.51020408 L12,4.51020408" id="Shape"></path>
|
||||||
|
<path d="M0,8.11836735 L12,8.11836735" id="Shape"></path>
|
||||||
|
<path d="M4.61538462,0 L2.76923077,12.6285714" id="Shape"></path>
|
||||||
|
<path d="M9.23076923,0 L7.38461538,12.6285714" id="Shape"></path>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.7 KiB |
Reference in New Issue
Block a user