mixin source uses :target for css interaction

This commit is contained in:
Eric Meyer 2010-04-26 17:42:46 -06:00
parent feb6549a02
commit a7559fcdd5
3 changed files with 11 additions and 14 deletions

View File

@ -34,21 +34,21 @@ body.reference {
margin-top: 1em; } } margin-top: 1em; } }
span.view-source { span.view-source {
float: right; float: right;
margin: 1.25em; margin: 1em;
} }
span.color + span.swatch { margin: 0 3px 3px; border: 1px solid #333333; width: 1em; height: 1em; @include inline-block; } span.color + span.swatch { margin: 0 3px 3px; border: 1px solid #333333; width: 1em; height: 1em; @include inline-block; }
.color-snippet { width: 100px; height: 20px; @include border-radius(3px); } .color-snippet { width: 100px; height: 20px; @include border-radius(3px); }
a.help { font-size: 75%; } a.help { font-size: 75%; }
.mixin-source { .mixin-source {
pre { pre {
@include transition; @include box-sizing(border-box);
@include transparent;
display: none; display: none;
overflow-x: auto; overflow-x: auto;
width: 100%;
padding: $base-rhythm-unit;
} }
pre.shown { pre:target {
display: block; display: block;
@include opaque;
} }
} }

View File

@ -106,9 +106,9 @@ header[role="banner"]
#search-docs #search-docs
color: #999 color: #999
p p
margin: 0
+columns(3) +columns(3)
+omega +omega
margin: 0
label label
+float(left) +float(left)
width: columns(1,3) + gutter(3)*.5 width: columns(1,3) + gutter(3)*.5
@ -147,9 +147,6 @@ footer[role="contentinfo"]
article article
text-align: left text-align: left
aside[role="sidebar"] + article
+prefix(3)
article article
> nav > nav
border-top: $px2em*1px solid #ccc border-top: $px2em*1px solid #ccc
@ -167,7 +164,7 @@ article
/* @group OVERRIDES by content /* @group OVERRIDES by content
#content aside[role="sidebar"] + article
+columns(9) +columns(9)
+omega +omega
h1 h1

View File

@ -4,14 +4,14 @@
- mixin_defs.each do |mixin| - mixin_defs.each do |mixin|
%span.view-source %span.view-source
View Source: View Source:
%a.view-source{:href=>"#", :onclick => "$('#mixin-#{mixin.name}-source .scss').removeClass('shown');$('#mixin-#{mixin.name}-source .sass').addClass('shown'); return false;"} Sass %a.view-source{:href=>"#mixin-#{mixin.name}-sass"} Sass
\| \|
%a.view-source{:href=>"#", :onclick => "$('#mixin-#{mixin.name}-source .sass').removeClass('shown');$('#mixin-#{mixin.name}-source .scss').addClass('shown'); return false;"} SCSS %a.view-source{:href=>"#mixin-#{mixin.name}-scss"} SCSS
%h3.mixin{:id=>"mixin-#{mixin.name}"} %h3.mixin{:id=>"mixin-#{mixin.name}"}
%a.permalink{:href => "#mixin-#{mixin.name}"}= mixin_signature(mixin) %a.permalink{:href => "#mixin-#{mixin.name}"}= mixin_signature(mixin)
.mixin-source{:id=>"mixin-#{mixin.name}-source"} .mixin-source{:id=>"mixin-#{mixin.name}-source"}
%pre.sass= mixin.to_sass %pre{:id=>"mixin-#{mixin.name}-sass"}= mixin.to_sass
%pre.scss= mixin.to_scss %pre{:id=>"mixin-#{mixin.name}-scss"}= mixin.to_scss
.source-documentation .source-documentation
= format_doc(mixin.comment) = format_doc(mixin.comment)