Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Button Sass Styles (Universal Starter)
.button
display: inline-block
border: none
color: #fff
text-decoration: none
background-color: $accent
padding: 15px 45px
font-size: 13px
text-transform: uppercase
font-weight: 600
letter-spacing: 3px
border-radius: 2px
text-align: center
position: relative
outline: none
transition: background-color .1s ease
cursor: pointer
&::after
transition: background-color .2s ease
position: absolute
content: ''
height: 4px
bottom: 0
width: 100%
background-color: darken($accent, 50%)
opacity: .18
border-bottom-left-radius: 2px
border-bottom-right-radius: 2px
left: 0
&:focus, &:hover
text-decoration: none
color: #fff
&:hover
background-color: lighten($accent, 5%)
&::after
opacity: .22
&:active
background-color: darken($accent, 5%)
&::after
opacity: .32
@MuratOrs

This comment has been minimized.

Copy link

commented Sep 4, 2018

Thanks

@danmiles

This comment has been minimized.

Copy link

commented Oct 29, 2018

Спасибо, ты делаешь благородное дело бро, делишься знаниями)

@Nemocoder

This comment has been minimized.

Copy link

commented Jan 30, 2019

спасибо огромное! За терпение и труд!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.