public/Boostnote
1
0
Fork 0
mirror of https://github.com/BoostIo/Boostnote synced 2025-12-14 10:16:26 +00:00
Code Issues Releases Wiki Activity

Fix layout at export note in InfoPanel

Browse Source
This commit is contained in:
Kazu Yokomizo
2017-07-24 17:00:08 +09:00
parent f7d1f9e949
commit c697f19642
2 changed files with 55 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
browser/main/Detail/InfoPanel.js
View File

@@ -47,14 +47,21 @@ const InfoPanel = ({
</div> </div>
</div> </div>
<div styleName='group-export'> <div id='export-wrap'>
<i className='fa fa-file-text fa-fw' <button styleName='export--enable' onClick={(e) => exportAsMd(e)}>
onClick={(e) => exportAsMd(e)} <i className='fa fa-file-code-o fa-fw' />
/> <p>.md</p>
</button>
<i className='fa fa-file-text fa-fw' <button styleName='export--enable' onClick={(e) => exportAsTxt(e)}>
onClick={(e) => exportAsTxt(e)} <i className='fa fa-file-text-o fa-fw' />
/> <p>.txt</p>
</button>
<button styleName='export--unable'>
<i className='fa fa-file-pdf-o fa-fw' />
<p>.pdf</p>
</button>
</div> </div>
</div> </div>
) )

44
browser/main/Detail/InfoPanel.styl
View File

@@ -13,7 +13,7 @@
margin-top 45px margin-top 45px
margin-left -210px margin-left -210px
position absolute position absolute
padding 20px padding 20px 20px 0 20px
width 340px width 340px
background-color $ui-noteList-backgroundColor background-color $ui-noteList-backgroundColor
border 1px solid $border-color border 1px solid $border-color
@@ -40,8 +40,35 @@
width 160px width 160px
height 25px height 25px
.group-export [id=export-wrap]
height 25px height 90px
display flex
justify-content center
margin 20px 0 10px 0
button
outline none
font-size 48px
color #A0A0A0
background-color transparent
border none
margin 0 5px
border-radius 5px
&:hover
transition 0.2s
background-color alpha($ui-button--hover-backgroundColor, 30%)
color $ui-inactive-text-color
p
font-size 13px
color #A0A0A0
font-weight light
&:hover
color $ui-inactive-text-color
.export--enable
cursor pointer
.export--unable
cursor not-allowed
body[data-theme="dark"] body[data-theme="dark"]
.control-infoButton-panel .control-infoButton-panel
@@ -57,3 +84,14 @@ body[data-theme="dark"]
.group-section-control input .group-section-control input
background-color alpha($ui-dark-borderColor, 80%) background-color alpha($ui-dark-borderColor, 80%)
color $ui-dark-text-color color $ui-dark-text-color
[id=export-wrap]
button
color $ui-dark-inactive-text-color
&:hover
background-color alpha($ui-dark-borderColor, 20%)
color $ui-dark-text-color
p
color $ui-dark-inactive-text-color
&:hover
color $ui-dark-text-color