Merge afb-client

[src/app-framework-demo.git] / afb-client / bower_components / foundation-apps / scss / components / _extras.scss

diff --git a/afb-client/bower_components/foundation-apps/scss/components/_extras.scss b/afb-client/bower_components/foundation-apps/scss/components/_extras.scss
new file mode 100644 (file)
index 0000000..1e2443a
--- /dev/null
+++ b/afb-client/bower_components/foundation-apps/scss/components/_extras.scss
@@ -0,0 +1,54 @@
+/*
+  Odds and ends.
+*/
+
+/// @Foundation.settings
+// Extras
+$closebutton-position: (top right) !default;
+$closebutton-size: 2em !default;
+$closebutton-lineheight: 0.5 !default;
+$closebutton-color: #999 !default;
+$closebutton-color-hover: #333 !default;
+
+$thumbnail-padding: 0.5rem !default;
+$thumbnail-shadow: 0 3px 15px rgba(black, 0.25) !default;
+///
+
+// A basic close button. They pin to the corner of the thing they're inside.
+%close-button {
+  $x: nth($closebutton-position, 1);
+  $y: nth($closebutton-position, 2);
+
+  position: absolute;
+  color: $closebutton-color;
+  #{$x}: $global-padding;
+  #{$y}: $global-padding;
+  font-size: $closebutton-size;
+  line-height: $closebutton-lineheight;
+  cursor: pointer;
+
+  &:hover {
+    color: $closebutton-color-hover;
+  }
+}
+
+// Make your images fancy-like.
+%thumbnail {
+  padding: $thumbnail-padding;
+  box-shadow: $thumbnail-shadow;
+}
+
+@include exports(extras) {
+  .close-button {
+    @extend %close-button;
+  }
+  .thumbnail {
+    @extend %thumbnail;
+  }
+  ul.thumbnails > li {
+    margin-bottom: 1rem;
+    
+    a { display: block; }
+    img { @extend %thumbnail; }
+  }
+}