honeymoose
/
angular-cn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

aside added

This commit is contained in:
Alex Wolfe 2015-04-07 05:35:19 -07:00
parent bcaa6646a8
commit 69844f59e3
4 changed files with 65 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
public/docs/_includes/styleguide/_aside.jade Normal file
View File

@ -0,0 +1,28 @@
#sg-aside.showcase.shadow-1
header.showcase-header
h2 Asides
p.
You this for content that is related in a tangential way but
not critical to learning, it can be ignored. The paragraph
that includes this element should always surround it with text.
.showcase-content
.l-sub-section
h3 Adding an aside
aside.is-right Did you know that hipsum is a replacment for Lorem Ipsum? To find out more visit <a href="http://hipsum.co/">hipsum.co</a>
p.
Etsy artisan Thundercats, authentic sustainable bitters wolf roof party meditation 90's asymmetrical XOXO hoodie. Twee umami cray iPhone. Chillwave shabby chic tilde occupy sriracha squid Brooklyn street art. Selvage heirloom kogi American Apparel bicycle rights. Carles Etsy Truffaut mlkshk trust fund. Jean shorts fashion axe Williamsburg wolf cardigan beard, twee blog locavore organic. Cred skateboard dreamcatcher, taxidermy Bushwick actually aesthetic normcore fanny pack.
pre.prettyprint.linenums.lang-html
code.
aside.is-right Did you know that hipsum is a replacment for Lorem Ipsum? To find out more visit <a href="http://hipsum.co/">hipsum.co</a>
p.
Etsy artisan Thundercats, authentic sustainable bitters
wolf roof party meditation 90's asymmetrical XOXO hoodie.
Twee umami cray iPhone. Chillwave shabby chic tilde
occupy sriracha squid Brooklyn street art.

4
public/docs/_includes/styleguide/_jump-nav.jade
View File

@ -1,7 +1,7 @@
nav.jump-nav
ul
li
a(href="#sg-code" class="button" md-button) Code Examples
a(href="#" class="button" md-button) Code Examples
li
a(href="#sg-alerts" class="button" md-button) Alerts
a(href="#" class="button" md-button) Alerts

1
public/docs/styleguide.jade
View File

@ -3,5 +3,6 @@
!= partial("/_includes/styleguide/_code-examples")
!= partial("/_includes/styleguide/_alerts")
!= partial("/_includes/styleguide/_tables")
!= partial("/_includes/styleguide/_aside")
!= partial("/_includes/styleguide/_jump-nav")

34
public/resources/css/base/_type.scss
View File

@ -105,3 +105,37 @@ table td {
opacity: .54;
line-height: 20px;
}
.text-aside,
.docs-content aside {
@extend .text-caption;
box-shadow: 0px 2px 5px rgba($coal, 0.3);
font-weight: 400;
font-size: 13px;
opacity: .54;
line-height: 24px;
background: $mist;
border-radius: 2px;
padding: $unit * 3;
margin-bottom: $unit * 2;
width: $unit * 30;
.l-sub-section & {
background: $fog;
}
&.is-right {
float: right;
margin-left: $unit * 2;
}
&.is-left {
float: left;
margin-right: $unit * 2;
}
}
.l-sub-section .text-aside,
.docs-content .l-sub-section aside {
background: $snow;
}