mirror of
https://github.com/danog/sass-site.git
synced 2024-11-26 20:14:53 +01:00
Stuffs
This commit is contained in:
₍˄ุ.͡˳̫.˄ุ₎
parent
5387c0a164
commit
b247d93be9
@ -35,9 +35,9 @@
|
||||
@extend %reset-list;
|
||||
margin: 0 auto;
|
||||
|
||||
@include breakpoint($screen-small) {
|
||||
@extend %clear-fix-screen-small;
|
||||
margin: 0 #{-$gutter-width / 2};
|
||||
@include breakpoint($tablet-large) {
|
||||
@extend %clear-fix-tablet-large;
|
||||
margin: 0 #{-$gutter-width};
|
||||
max-width: none;
|
||||
|
||||
li {
|
||||
|
||||
@ -6,6 +6,6 @@
|
||||
@include breakpoint($tablet-large) {
|
||||
@include font-size-large;
|
||||
|
||||
.main & { text-align: left; }
|
||||
.content-primary & { text-align: left; }
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
// Susy Settings
|
||||
$container: 80%;
|
||||
$container: 90%;
|
||||
$gutter-width: <%= data.layout.susy.gutter_width %>;
|
||||
$column-width: <%= data.layout.susy.column_width %>;
|
||||
|
||||
@ -11,8 +11,9 @@ $gutter-placement: inside;
|
||||
|
||||
// Breakpoint Settings
|
||||
$breakpoint-to-ems: true;
|
||||
<% data.layout.resolutions.each do |resolution| %>
|
||||
<% data.layout.resolutions.each_with_index do |resolution, index| %>
|
||||
$<%= resolution.target %>: <%= resolution.width %>px;
|
||||
$<%= resolution.target %>-grid: "(<%= index %> * 2) ($column-width $gutter-width) inside fluid";
|
||||
<% end %>
|
||||
|
||||
|
||||
|
||||
@ -30,7 +30,7 @@ input,
|
||||
|
||||
input[type="text"],
|
||||
%button {
|
||||
@include rhythm-borders(1px, .44);
|
||||
@include rhythm-borders(1px, .5);
|
||||
display: block;
|
||||
border: {
|
||||
color: $color-border;
|
||||
@ -44,8 +44,6 @@ input[type="text"],
|
||||
vertical-align: middle;
|
||||
|
||||
@include breakpoint($mobile-large) {
|
||||
@include padding-leader(.15);
|
||||
@include padding-trailer(.125);
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
}
|
||||
@ -84,6 +82,7 @@ input {
|
||||
@include box-shadow(0 2px 1px $color-shadow);
|
||||
white-space: nowrap;
|
||||
background: $color-background-shade;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
|
||||
<% data.layout.resolutions.each do |resolution| %>
|
||||
@include breakpoint($<%= resolution.target %>) {
|
||||
@include set-grid($<%= resolution.target %>-grid);
|
||||
@include container;
|
||||
|
||||
&.toolkit-grid { @include background-grid; }
|
||||
@ -12,8 +13,6 @@
|
||||
<% end %>
|
||||
}
|
||||
|
||||
|
||||
|
||||
.row {
|
||||
@extend %clear-fix;
|
||||
@include bleed($gutter-width);
|
||||
|
||||
@ -23,9 +23,7 @@
|
||||
}
|
||||
|
||||
@include breakpoint($tablet-large) {
|
||||
display: table-cell;
|
||||
text-align: left;
|
||||
vertical-align: middle;
|
||||
@include span(3);
|
||||
|
||||
img { height: rhythm(4); }
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
.contentinfo {
|
||||
@include padding-leader(2);
|
||||
@include padding-trailer(2);
|
||||
@include padding-leader;
|
||||
@include padding-trailer;
|
||||
color: $color-text-weak;
|
||||
|
||||
.container {
|
||||
|
||||
@ -13,8 +13,8 @@
|
||||
@include padding-trailer(.5);
|
||||
display: block;
|
||||
padding: {
|
||||
right: $gutter-width;
|
||||
left: $gutter-width;
|
||||
right: $gutter-width * 2;
|
||||
left: $gutter-width * 2;
|
||||
}
|
||||
background: mix($color-background, $color-background-shade);
|
||||
|
||||
@ -31,46 +31,40 @@
|
||||
ul { @extend %clear-fix-tablet-small; }
|
||||
|
||||
li {
|
||||
float: left;
|
||||
width: 50%;
|
||||
@include span(6);
|
||||
|
||||
&:nth-child(odd) {
|
||||
clear: both;
|
||||
padding-right: $gutter-width / 2;
|
||||
}
|
||||
|
||||
&:nth-child(even) { padding-left: $gutter-width / 2; }
|
||||
&:nth-child(odd) { @include omega; }
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint($tablet-large) {
|
||||
@extend %table-layout-cell-tablet-large;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
text-align: right;
|
||||
@include span(9 omega);
|
||||
background: none;
|
||||
|
||||
&.collapse { display: table-cell !important; }
|
||||
&.collapse { display: block !important; }
|
||||
|
||||
ul {
|
||||
display: inline-block;
|
||||
margin: 0 #{-$gutter-width} 0 $gutter-width;
|
||||
margin: 0;
|
||||
max-width: none;
|
||||
white-space: nowrap;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
li {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
margin: {
|
||||
right: $gutter-width;
|
||||
right: 0;
|
||||
left: $gutter-width * 2;
|
||||
bottom: 0;
|
||||
}
|
||||
width: auto;
|
||||
|
||||
&:nth-child(odd) {
|
||||
clear: none;
|
||||
padding-right: 0;
|
||||
float: none;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&:nth-child(even) { padding-left: 0; }
|
||||
|
||||
&:last-child { margin-right: 0; }
|
||||
}
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
.section-bottom {
|
||||
@include padding-leader;
|
||||
@include padding-trailer(2);
|
||||
@include padding-trailer;
|
||||
@include background(linear-gradient(mix($color-background-shade, $color-background), transparent));
|
||||
}
|
||||
|
||||
@ -5,7 +5,6 @@ layout: layout_1_column
|
||||
---
|
||||
|
||||
%p.introduction
|
||||
= link_to "Heya", "#", class: "button primary"
|
||||
Sass is the most mature, stable, and powerful professional grade CSS
|
||||
extension language in the world.
|
||||
|
||||
@ -14,24 +13,32 @@ layout: layout_1_column
|
||||
%li
|
||||
%h3 CSS Compatible
|
||||
%p
|
||||
Sass is completely compatible with all versions of CSS. We take this compatibility seriously, so that you can seamlessly use any available CSS libraries.
|
||||
Sass is completely compatible with all versions of CSS. We take this
|
||||
compatibility seriously, so that you can seamlessly use any available
|
||||
CSS libraries.
|
||||
%li
|
||||
%h3 Feature Rich
|
||||
%p
|
||||
Sass boasts more features and abilities than any other CSS extension language out there. The Sass Core Team has worked endlessly to not only keep up, but stay ahead.
|
||||
Sass boasts more features and abilities than any other CSS extension
|
||||
language out there. The Sass Core Team has worked endlessly to not
|
||||
only keep up, but stay ahead.
|
||||
%li
|
||||
%h3 Mature
|
||||
%p
|
||||
Sass has been actively supported for
|
||||
= time_ago_in_words DateTime.parse("Tue Nov 28 19:43:58 2006 +0000")
|
||||
by its loving Core Team.
|
||||
by its loving Core Team.
|
||||
%li
|
||||
%h3 Industry Approved
|
||||
%p
|
||||
Over and over again, the industry is choosing Sass as the premier CSS extension languages. It's so true that we feel a little bad for the upstarts.
|
||||
Over and over again, the industry is choosing Sass as the premier CSS
|
||||
extension languages. It's so true that we feel a little bad for
|
||||
the upstarts.
|
||||
%li
|
||||
%h3 Large Community
|
||||
%p Sass is actively supported and developed by a consortium of several tech companies and hundreds of developers.
|
||||
%p
|
||||
Sass is actively supported and developed by a consortium of several
|
||||
tech companies and hundreds of developers.
|
||||
%li
|
||||
%h3 Frameworks
|
||||
%p
|
||||
@ -42,11 +49,12 @@ layout: layout_1_column
|
||||
= link_to "Bourbon", "http://bourbon.io/"
|
||||
and
|
||||
= link_to "Susy", "http://susy.oddbird.net/"
|
||||
just to name a few.
|
||||
just to name a few.
|
||||
%li
|
||||
%h3 Training
|
||||
%p
|
||||
There is a huge amount of training and support available for Sass. No HTML/CSS education is complete without learning Sass.
|
||||
There is a huge amount of training and support available for Sass. No
|
||||
HTML/CSS education is complete without learning Sass.
|
||||
|
||||
- content_for :complementary do
|
||||
.get-started
|
||||
@ -55,30 +63,3 @@ layout: layout_1_column
|
||||
%li= link_to "Install Sass", "install"
|
||||
%li= link_to "Learn Sass", "guide"
|
||||
%li= link_to "Get Involved", "community"
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
- content_for :section_2 do
|
||||
.message.current-release
|
||||
.container
|
||||
%dl
|
||||
%dt Current Release:
|
||||
%dd Media Mark (3.2.1)
|
||||
:markdown
|
||||
* [Release Notes](#)
|
||||
* [Fork Sass on Github](#)
|
||||
|
||||
- content_for :section_2 do
|
||||
.message.current-release
|
||||
.container
|
||||
%dl
|
||||
%dt Current Release:
|
||||
%dd Media Mark (3.2.1)
|
||||
:markdown
|
||||
* [Release Notes](#)
|
||||
* [Fork Sass on Github](#)
|
||||
|
||||
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
.container
|
||||
:markdown
|
||||
* Current Release:
|
||||
<span class="release-name">Media Mark (3.2.1)</span>
|
||||
<span class="release-name">Maptastic Maple (3.3.0)</span>
|
||||
* [Release Notes](http://sass-lang.com/docs/yardoc/file.SASS_CHANGELOG.html)
|
||||
* [Fork Sass on Github](https://github.com/nex3/sass)
|
||||
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
:markdown
|
||||
Sass © 2006–2013 [Hampton Catlin](#),
|
||||
[Nathan Weizenbaum](#),
|
||||
[Chris Eppstein](http://chriseppstein.github.io/),
|
||||
[Chris Eppstein](http://chriseppstein.github.io/),
|
||||
and numerous contributors.
|
||||
|
||||
It is available for use and modification under the
|
||||
|
||||
Loading…
Reference in New Issue
Block a user