| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136 |
- .bio
- text-align: center
- #profile .inner .bio h2
- font-size: 1.3em
- font-weight: bold
- margin-top: 15px
- #profile .inner .bio p
- margin: 5px 20px 10px 20px
- text-align: justify
- max-width: 300px
- line-height: 1.5em
- .profile-block
- padding: 15px 20px
- border-bottom: 1px solid color-border
- &:last-child
- border-bottom: none
- #profile
- column(profile-column)
- display: none
- @media mq-normal
- display: block
- .inner
- @extend $block
- margin-top: block-margin
- background: white
- .base-info
- #avatar
- display: block
- margin: 10px auto 20px
- width: profile-avatar-size
- height: profile-avatar-size
- #name, #title, #location
- display: block
- text-align: center
- #name
- font-size: 20px
- font-weight: 600
- #location
- font-size: font-size - 2
- margin-top: 5px
- color: color-default + #444
- .fa
- margin-right: 5px
- #follow
- color: white
- width: 150px
- height: 40px
- display: block
- font-size: 14px
- line-height: 40px
- text-align: center
- margin: 20px auto 10px
- background: color-link
- border-radius: 20px
- transition: 0.2s ease
- &:hover
- background: color-link + #111
- .article-info
- clearfix()
- padding: 0px
- .article-info-block
- width: 50%
- float: left
- padding: 20px 15px
- text-align: center
- box-sizing: border-box
- font-size: font-size + 6px
- span
- display: block
- font-size: font-size
- text-transform: uppercase
- &:first-child
- border-right: 1px solid color-border
- .social-links
- & > table
- width: 100%
- td
- text-align: center
- font-size: font-size + 10px
- a
- position: relative
- transition: 0.2s ease
- color: color-default + #333
- &:hover
- color: color-default
- &:after
- right: -50%
- top: -41px
- color: white
- background: #333
- font-size: 14px
- content: attr(title)
- display: block
- padding: 5px 15px
- position: absolute
- white-space: nowrap
- border-radius: 2px
- text-transform: uppercase
- box-shadow: 0 0 2px rgba(0, 0, 0, 0.2)
- z-index: 1
- &:before
- top: -12px
- right: 8px
- border: solid
- border-color: #333 transparent
- border-width: 5px 5px 0 5px
- content: ""
- display: block
- position: absolute
- z-index: 2
- &.card
- top: 50px
- right: 20px
- z-index: 999
- display: block
- min-width: 280px
- position: absolute
- .profile-inner
- position: relative
- box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2)
- &:before, &:after
- z-index: 1
- content: ''
- top: -20px
- right: 10px
- position: absolute
- border-width: 10px
- border-style: solid
- border-color: transparent transparent white transparent
- &:after
- z-index: 0
- border-color: transparent transparent color-border - #111 transparent
|
