Skip to content

Fix layout #722

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 7 commits into from
Jul 25, 2017
Merged

Fix layout #722

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
27b9952
Change policy content
Jul 24, 2017
f7d1f9e
Fix InfoTab layout
Jul 24, 2017
c697f19
Fix layout at export note in InfoPanel
Jul 24, 2017
4a77f25
Fix button layout
Jul 24, 2017
dee6495
Fix typo
Jul 24, 2017
976d1bb
Delete unnecessary comma.
Jul 24, 2017
e001c97
Make padding between Storages at SideNav.
Jul 24, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Fix layout at export note in InfoPanel
  • Loading branch information
Kazu Yokomizo committed Jul 24, 2017
commit c697f1964207b4082d8526113b649d607ec0339c
21 changes: 14 additions & 7 deletions browser/main/Detail/InfoPanel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,14 +47,21 @@ const InfoPanel = ({
</div>
</div>

<div styleName='group-export'>
<i className='fa fa-file-text fa-fw'
onClick={(e) => exportAsMd(e)}
/>
<div id='export-wrap'>
<button styleName='export--enable' 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'
onClick={(e) => exportAsTxt(e)}
/>
<button styleName='export--enable' 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>
)
Expand Down
44 changes: 41 additions & 3 deletions browser/main/Detail/InfoPanel.styl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
margin-top 45px
margin-left -210px
position absolute
padding 20px
padding 20px 20px 0 20px
width 340px
background-color $ui-noteList-backgroundColor
border 1px solid $border-color
Expand All @@ -40,8 +40,35 @@
width 160px
height 25px

.group-export
height 25px
[id=export-wrap]
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"]
.control-infoButton-panel
Expand All @@ -57,3 +84,14 @@ body[data-theme="dark"]
.group-section-control input
background-color alpha($ui-dark-borderColor, 80%)
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