created

1 files changed, 109 insertions, 0 deletions

diff --git a/sass/partials/_banner.scss b/sass/partials/_banner.scss
new file mode 100644
index 0000000..3164048
--- /dev/null
+++ b/sass/partials/_banner.scss
@@ -0,0 +1,109 @@
+#banner{
+	margin-bottom: 30px;
+	position: relative;
+	height: 300px;
+	@include user-select(none);
+	.image{
+		width: 1120px;
+		position: absolute;
+		left: 40px;
+		height: 100%;
+		overflow: hidden;
+		background: #000;
+		.wrap{
+			position: absolute;
+			left: 0;
+			height: 100%;
+		}
+		img{
+			height: 100%;
+			position: absolute;
+			&:first-child{
+				display: block;
+			}
+		}
+	}
+	.loading, .error{
+		width: 1200px;
+		height: 100%;
+		position: absolute;
+		top: 0;
+		left: 0;
+		background: #000;
+		color: #fff;
+		&:before{
+			position: absolute;
+			top: 50%;
+			margin-top: -20px;
+			width: 100%;
+			text-align: center;
+			font: 40px/1 $symbol;
+		}
+		div{
+			position: absolute;
+			top: 50%;
+			width: 100%;
+			text-align: center;
+			margin-top: 40px;
+		}
+	}
+	.loading{
+		&:before{
+			content: "P";
+		}
+	}
+	.error{
+		&:before{
+			content: "'";
+		}
+	}
+	.prev, .next{
+		position: absolute;
+		height: 100%;
+		width: 35px;
+		background: $black;
+		cursor: pointer;
+		&:before{
+			position: absolute;
+			top: 50%;
+			font: 20px/1 $symbol;
+			color: #fff;
+			margin-top: -10px;
+		}
+		&:hover{
+			background: #000;
+		}
+	}
+	.prev{
+		left: 0;
+		&:before{
+			content: "<";
+			left: 10px;
+		}
+	}
+	.next{
+		right: 0;
+		&:before{
+			content: ">";
+			right: 10px;
+		}
+	}
+	.dots{
+		position: absolute;
+		bottom: -40px;
+		right: 0;
+		z-index: 1;
+		li{
+			display: inline-block;
+			margin-left: 10px;
+			background: $black;
+			cursor: pointer;
+			overflow: hidden;
+			position: relative;
+			@include square(10px);
+			&.current, &:hover{
+				background: $main;
+			}
+		}
+	}
+}
\ No newline at end of file