more space for titles, bring back border-radius for profile images

This commit is contained in:
Lisa Passing 2015-05-06 12:17:43 +02:00
parent bfb4946df8
commit 2751d8878e
2 changed files with 30 additions and 18 deletions

View File

@ -1,5 +1,6 @@
.owner-header .owner-header
padding: 0 $column-gutter/2
margin-bottom: 3rem margin-bottom: 3rem
color: #969496 color: #969496
a a
@ -8,6 +9,9 @@
margin: .3em 0 .2em margin: .3em 0 .2em
font-size: 36px font-size: 36px
font-weight: 400 font-weight: 400
line-height: .9
@media #{$medium-up}
white-space: nowrap
.owner-handle .owner-handle
margin: 0 margin: 0
font-size: $font-size-ml font-size: $font-size-ml
@ -17,8 +21,8 @@
vertical-align: middle vertical-align: middle
a:hover a:hover
text-decoration: underline text-decoration: underline
// img img
// border-radius: 50% border-radius: 50%
.sync-button .sync-button
margin-top: .8rem margin-top: .8rem
@ -32,17 +36,27 @@
.owner-info .owner-info
@extend %inline-block @extend %inline-block
vertical-align: middle vertical-align: middle
margin-right: 1.5em
.owner-avatar
width: grid-calc(4, 12)
@media #{$medium-up}
width: grid-calc(2, 12)
.owner-info
width: grid-calc(7, 12)
@media #{$medium-up}
width: grid-calc(9, 12)
position: relative
overflow: hidden
&:after
content: ""
@include fadeOut(right, -90deg, $white)
.owner-tiles .owner-tiles
@extend .repo-main @extend .repo-main
@include resetul @include resetul
// h3
// margin: 0
// font-size: $font-size-m;
// font-weight: 400
h2 h2
font-size: 20px font-size: 20px
white-space: nowrap white-space: nowrap

View File

@ -1,16 +1,14 @@
{{!-- {{outlet}} --}} {{!-- {{outlet}} --}}
<header class="owner-header row"> <header class="owner-header row">
<section class="columns small-10 medium-8"> <div class="owner-avatar">
<div class="owner-avatar"> <img {{bind-attr src="avatarURL"}} alt="" width="125" height="125">
<img {{bind-attr src="avatarURL"}} alt="" width="125" height="125"> </div>
</div> <div class="owner-info">
<div class="owner-info"> <h1 class="owner-title">{{owner.name}}</h1>
<h1 class="owner-title">{{owner.name}}</h1> <p class="owner-handle"><a {{bind-attr href="githubProfile"}} title=""><span class="icon icon--github-circle"></span> {{owner.login}}</a></p>
<p class="owner-handle"><a {{bind-attr href="githubProfile"}} title=""><span class="icon icon--github-circle"></span> {{owner.login}}</a></p> {{!-- {{owner-sync-button owner=owner}} --}}
{{!-- {{owner-sync-button owner=owner}} --}} </div>
</div>
</section>
</header> </header>
<div class="tabs--owner"> <div class="tabs--owner">