md content padding

This commit is contained in:
Adam Bradley
2015-09-03 10:34:46 -05:00
parent 8a4dedecdd
commit e99764d7c9
4 changed files with 85 additions and 34 deletions

View File

@ -24,3 +24,44 @@ scroll-content {
-webkit-overflow-scrolling: touch;
will-change: scroll-position;
}
// Content Padding
// --------------------------------------------------
$content-padding: 10px !default;
.padding,
[padding],
.padding > scroll-content,
[padding] > scroll-content {
padding: $content-padding;
}
.padding-top {
padding-top: $content-padding;
}
.padding-right {
padding-right: $content-padding;
}
.padding-bottom {
padding-bottom: $content-padding;
}
.padding-left {
padding-left: $content-padding;
}
.padding-vertical {
padding-top: $content-padding;
padding-bottom: $content-padding;
}
.padding-horizontal {
padding-right: $content-padding;
padding-left: $content-padding;
}

View File

@ -0,0 +1,43 @@
// Material Design Content Padding
// --------------------------------------------------
$content-padding-md: 16px !default;
[mode=md] {
.padding,
[padding],
.padding > scroll-content,
[padding] > scroll-content {
padding: $content-padding-md;
}
.padding-top {
padding-top: $content-padding-md;
}
.padding-right {
padding-right: $content-padding-md;
}
.padding-bottom {
padding-bottom: $content-padding-md;
}
.padding-left {
padding-left: $content-padding-md;
}
.padding-vertical {
padding-top: $content-padding-md;
padding-bottom: $content-padding-md;
}
.padding-horizontal {
padding-right: $content-padding-md;
padding-left: $content-padding-md;
}
}

View File

@ -6,6 +6,7 @@
"components/toolbar/modes/material",
"components/action-menu/modes/material",
"components/button/modes/material",
"components/content/modes/material",
"components/item/modes/material",
"components/list/modes/material",
"components/card/modes/material",

View File

@ -25,40 +25,6 @@
}
// Content Padding
// --------------------------------------------------
$content-padding: 10px !default;
.padding,
[padding],
.padding > scroll-content,
[padding] > scroll-content {
padding: $content-padding;
}
.padding-top,
.padding-vertical {
padding-top: $content-padding;
}
.padding-right,
.padding-horizontal {
padding-right: $content-padding;
}
.padding-bottom,
.padding-vertical {
padding-bottom: $content-padding;
}
.padding-left,
.padding-horizontal {
padding-left: $content-padding;
}
// Focus Outline
// --------------------------------------------------
// When a keydown event happens, from a tab key, then the