mirror of
https://github.com/BoostIo/Boostnote
synced 2025-12-13 01:36:22 +00:00
改善:Login/Register部分のデザイン
This commit is contained in:
@@ -47,7 +47,7 @@ module.exports = React.createClass({
|
||||
<input className='stripInput' valueLink={this.linkState('password')} onChange={this.handleChange} type='password' placeholder='Password'/>
|
||||
</div>
|
||||
<div className='form-group'>
|
||||
<button className='btn-primary' type='submit'>Log In</button>
|
||||
<button className='logInButton' type='submit'>Log In</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@@ -58,7 +58,7 @@ module.exports = React.createClass({
|
||||
<input className='stripInput' valueLink={this.linkState('profileName')} type='text' placeholder='Profile name'/>
|
||||
</div>
|
||||
<div className='form-group'>
|
||||
<button className='btn-primary' type='submit'>Sign Up</button>
|
||||
<button className='logInButton' type='submit'>Sign Up</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
.LoginContainer, .RegisterContainer
|
||||
margin 15px auto
|
||||
margin 0 auto
|
||||
padding 25px 15px
|
||||
box-sizing border-box
|
||||
color inactiveTextColor
|
||||
.logo
|
||||
width 215px
|
||||
height 215px
|
||||
width 150px
|
||||
height 150px
|
||||
display block
|
||||
margin 0 auto
|
||||
.authNavigator
|
||||
@@ -23,15 +23,15 @@
|
||||
margin-bottom 25px
|
||||
.facebookBtn, .githubBtn
|
||||
margin 0 45px
|
||||
width 75px
|
||||
height 75px
|
||||
line-height 75px
|
||||
font-size 35px
|
||||
width 50px
|
||||
height 50px
|
||||
line-height 50px
|
||||
font-size 25px
|
||||
text-align center
|
||||
background-image none
|
||||
color white
|
||||
border none
|
||||
border-radius 37.5px
|
||||
border-radius 25px
|
||||
cursor pointer
|
||||
.facebookBtn
|
||||
background-color facebookColor
|
||||
@@ -39,7 +39,8 @@
|
||||
background-color lighten(facebookColor, 25%)
|
||||
.githubBtn
|
||||
background-color githubBtn
|
||||
font-size 42px
|
||||
font-size 30px
|
||||
line-height 30px
|
||||
&:hover, &.hover
|
||||
background-color lighten(githubBtn, 25%)
|
||||
.divider
|
||||
@@ -55,13 +56,14 @@
|
||||
margin 0 auto 45px
|
||||
div.form-group:last-child
|
||||
margin-top 45px
|
||||
.btn-primary
|
||||
button.logInButton
|
||||
btnPrimary()
|
||||
height 44px
|
||||
border-radius 22px
|
||||
display block
|
||||
width 200px
|
||||
font-size 1em
|
||||
margin 0 auto
|
||||
&.hover, &:hover
|
||||
background-color brandColor
|
||||
color white
|
||||
p.alert
|
||||
text-align center
|
||||
font-size 0.8em
|
||||
|
||||
@@ -49,18 +49,11 @@ button
|
||||
margin-bottom 5px
|
||||
|
||||
.stripInput
|
||||
border none
|
||||
border-bottom 1px solid borderColor
|
||||
padding 5px 15px
|
||||
width 100%
|
||||
stripInput()
|
||||
display block
|
||||
width 100%
|
||||
font-size 1em
|
||||
height 33px
|
||||
box-sizing border-box
|
||||
transition 0.1s
|
||||
&:focus, &.focus
|
||||
border-bottom 1px solid brandBorderColor
|
||||
outline none
|
||||
|
||||
.block-input, .inline-input
|
||||
border solid 1px borderColor
|
||||
|
||||
9
browser/styles/mixins/input.styl
Normal file
9
browser/styles/mixins/input.styl
Normal file
@@ -0,0 +1,9 @@
|
||||
stripInput()
|
||||
border none
|
||||
border-bottom 1px solid borderColor
|
||||
padding 5px 15px
|
||||
box-sizing border-box
|
||||
transition 0.1s
|
||||
&:focus, &.focus
|
||||
border-bottom 1px solid brandBorderColor
|
||||
outline none
|
||||
Reference in New Issue
Block a user