app/assets/stylesheets/_repos.sass
// repos
//
// repo
//
.repos-wrapper .repo
font-size: 14px
.full-name
display: block
.name
font-size: 18px
font-weight: 600
.owner
// color: $secondary-text-color
.staff-pick
@extend .label-element
margin-left: 12px
.stats
display: block
color: $primary-color
.activity
margin-left: 12px
.description
display: block
.homepage-link
&:not(:first-of-type)
margin-top: 12px
&:not(:last-of-type)
margin-bottom: 12px
//
// repo details header
//
.repo-details
font-size: 0.9375rem
.name-and-owner
font-size: 1.618rem
font-weight: 600
i
margin-right: 9px
.name
.owner
font-weight: 400
.details
> *
margin-left: 1rem // settled after careful experimentation :-D
.stars
color: $secondary-text-color
.star-on-github-link
position: relative
top: 4px
padding-left: 1px // right one added by iframe width
.staff-pick
.edit-link, .refresh-link
.description
display: block
.homepage-url
.activity
margin-left: 1rem
//
// readme
//
// outer box
.readme-container
background: #fff
padding: 1rem
border: 2px solid #ddd
border-radius: 4px
// readme insertion place
.readme-target
position: relative
overflow: hidden
// height classes set via js
&.max-height
height: 425px
&.auto-height
height: auto
// toggle readme
.toggle-readme
position: absolute
bottom: -12px // to offset parents padding-bottom
left: 0
width: 100%
text-align: center
margin: 0
padding: 80px 0 20px
// fadeout effect
@include background-image(linear-gradient(white(0) 0%, white(1) 80%, white(1) 100%))
// colors hightlighting a project's most recent timestamp on Github
.activity
abbr
border-bottom: none
&.high
color: $high-repo-activity-color
&.medium
color: $medium-repo-activity-color
&.low
color: $low-repo-activity-color
.add-repo-wrapper
.name-and-owner
font-size: 1.618rem
font-weight: 600
i
margin-right: 9px