From d938a333c208c67c890a9e4888d4cbabcc2b1e87 Mon Sep 17 00:00:00 2001
From: Dylan Bolger <dylanbolger@Dylans-MacBook-Air.local>
Date: Wed, 21 Mar 2018 12:19:35 -0500
Subject: working on web

---
 cydia/assets/sass/components/_panel-banner.scss | 90 +++++++++++++++++++++++++
 1 file changed, 90 insertions(+)
 create mode 100644 cydia/assets/sass/components/_panel-banner.scss

(limited to 'cydia/assets/sass/components/_panel-banner.scss')

diff --git a/cydia/assets/sass/components/_panel-banner.scss b/cydia/assets/sass/components/_panel-banner.scss
new file mode 100644
index 0000000..983ad32
--- /dev/null
+++ b/cydia/assets/sass/components/_panel-banner.scss
@@ -0,0 +1,90 @@
+///
+/// Ethereal by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Panel (Banner) */
+
+	$pad: _size(pad);
+	$pad-small-tb: _size(pad-small-tb);
+	$pad-small-lr: _size(pad-small-lr);
+
+	.panel.banner {
+		@include vendor('align-items', 'stretch');
+
+		.content {
+			@include padding($pad, $pad);
+			@include vendor('display', 'flex');
+			@include vendor('flex-direction', 'column');
+			@include vendor('justify-content', 'center');
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+
+			> .actions:last-child {
+				margin-bottom: 0;
+			}
+		}
+
+		.image {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			position: relative;
+
+			img {
+				@include vendor('object-fit', 'cover');
+				display: block;
+				position: absolute;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+			}
+		}
+
+		&.left {
+			@include vendor('flex-direction', 'row');
+		}
+
+		&.right {
+			@include vendor('flex-direction', 'row-reverse');
+		}
+	}
+
+	@include breakpoint(small) {
+		.panel.banner {
+			.content {
+				@include padding($pad-small-tb, $pad-small-lr);
+				@include vendor('flex-basis', '60%');
+
+				> .actions:last-child {
+					margin-bottom: _size(element-margin);
+				}
+			}
+
+			.image {
+				@include vendor('flex-basis', '40%');
+			}
+		}
+
+		@include orientation(portrait) {
+			.panel.banner {
+				.content {
+					@include vendor('flex-basis', 'auto');
+				}
+
+				.image {
+					@include vendor('flex-basis', 'auto');
+					height: 18rem;
+				}
+
+				&.left {
+					@include vendor('flex-direction', 'column');
+				}
+
+				&.right {
+					@include vendor('flex-direction', 'column-reverse');
+				}
+			}
+		}
+	}
\ No newline at end of file
-- 
cgit v1.2.3