rename carousel to banner and clean up code (baa0cf9f) · Commits · blackheaven / tinygraphs

app/assets/css/carousel.css

deleted100644 → 0

+0 −152

Original line number	Diff line number	Diff line
		/* GLOBAL STYLES
		-------------------------------------------------- */
		/* Padding below the footer and lighter body text */

		body {
		color: #5a5a5a;
		}


		/* CUSTOMIZE THE NAVBAR
		-------------------------------------------------- */

		/* Special class on .container surrounding .navbar, used for positioning it into place. */
		.navbar-wrapper {
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		z-index: 20;
		margin-top: 0px;
		}

		/* Flip around the padding for proper display in narrow viewports */
		.navbar-wrapper > .container {
		padding-right: 0;
		padding-left: 0;
		}
		.navbar-wrapper .navbar {
		padding-right: 15px;
		padding-left: 15px;
		}
		.navbar-wrapper .navbar .container {
		width: auto;
		background-color: #fff;
		border-radius: 5px;
		}

		.banner{
		height: 500px;
		}

		.banner-title{
		right: 56%;
		position: absolute;
		top: 25%;
		left: 10%;
		color:#FFF;
		text-shadow: 0 1px 2px rgba(0,0,0,.6);
		}

		/* CUSTOMIZE THE CAROUSEL
		-------------------------------------------------- */

		/* Carousel base class */
		.carousel {
		height: 500px;
		margin-bottom: 60px;
		}

		/* Since positioning the image, we need to help out the caption */
		.carousel-caption {
		z-index: 10;
		right: 55%;
		top: 125px;
		text-align: left;
		left: 10%;
		}

		/* Declare heights because of positioning of img element */
		.carousel .item {
		height: 450px;
		}
		.carousel-inner > .item > img {
		position: absolute;
		top: 0;
		left: 0;
		min-width: 100%;
		}


		/* MARKETING CONTENT
		-------------------------------------------------- */

		/* Center align the text within the three columns below the carousel */
		.marketing .col-lg-4 {
		margin-bottom: 20px;
		text-align: center;
		}
		.marketing h2 {
		font-weight: normal;
		}
		.marketing .col-lg-4 p {
		margin-right: 10px;
		margin-left: 10px;
		}


		/* Featurettes
		------------------------- */

		.featurette-divider {
		margin: 80px 0; /* Space out the Bootstrap <hr> more */
		}

		/* Thin out the marketing headings */
		.featurette-heading {
		font-weight: 300;
		line-height: 1;
		letter-spacing: -1px;
		}


		/* RESPONSIVE CSS
		-------------------------------------------------- */

		@media (min-width: 768px) {
		/* Navbar positioning foo */
		.navbar-wrapper {
		margin-top: 0px;
		}
		.navbar-wrapper .container {
		padding-right: 15px;
		padding-left: 15px;
		}
		.navbar-wrapper .navbar {
		padding-right: 0;
		padding-left: 0;
		}

		/* The navbar becomes detached from the top, so we round the corners */
		.navbar-wrapper .navbar {
		border-radius: 4px;
		}

		.featurette-heading {
		font-size: 50px;
		}
		}

		@media (min-width: 992px) {
		.featurette-heading {
		margin-top: 120px;
		}
		}

		@media (max-width: 780px){
		.banner img{
		min-height: 300px;
		min-width: 780px;
		}

		}

app/assets/css/whatis.css

+8 −3

Original line number	Diff line number	Diff line
		/* CUSTOMIZE THE CAROUSEL
		-------------------------------------------------- */

		/* Carousel base class */
		.carousel-whatis {
		height: 263px;
		width: 263px;
		@@ -9,7 +8,6 @@
		position: relative;
		}

		/* Declare heights because of positioning of img element */
		.carousel-whatis .item {
		height: 263px;
		}
		@@ -17,3 +15,10 @@
		.carouselWhatIs-control--opacity{
		opacity: 0.25;
		}

		.carouselWhatis-inner > .item > img {
		position: absolute;
		top: 0;
		left: 0;
		min-width: 100%;
		}

app/index.html

+3 −3

Original line number	Diff line number	Diff line
		@@ -18,7 +18,7 @@
		<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
		<![endif]-->
		<!-- Custom styles for this template -->
		<link href="assets/css/carousel.css" rel="stylesheet">
		<link href="assets/css/banner.css" rel="stylesheet">
		<link href="assets/css/whatis.css" rel="stylesheet">
		</head>
		<body>
		@@ -32,9 +32,9 @@
		</div>
		</div>

		<!-- Carousel
		<!-- Banner
		================================================== -->
		<div class="tinygraphs-carousel" ng-include="'partials/carousel.html'"></div>
		<div class="tinygraphs-banner" ng-include="'partials/banner.html'"></div>

		<!-- ng-view
		================================================== -->

app/partials/carousel.html

deleted100644 → 0

+0 −18

Original line number	Diff line number	Diff line
		<div class="row banner">
		<div class="col-md-12">
		<img class="img-responsive" src="/isogrids/banner/random/gradient?theme=seascape&h=800&w=3000&xt=20" alt="First slide">
		<div class="banner-title">
		<h1>UNIQUE AVATARS FOR YOUR WEBSITE</h1>
		</div>
		</div>
		</div>
		<!-- <div class="carousel slide" data-ride="carousel"> -->
		<!-- <div class="carousel-inner"> -->
		<!-- <div class="item active"> -->
		<!-- <img src="/isogrids/banner/random/gradient?theme=seascape&h=200&w=400&xt=20" alt="First slide"> -->
		<!-- <div class="carousel-caption"> -->
		<!-- <h1>UNIQUE AVATARS FOR YOUR WEBSITE</h1> -->
		<!-- </div> -->
		<!-- </div> -->
		<!-- </div> -->
		<!-- </div><\!-- /.carousel -\-> -->

app/partials/marketing/whatisit.html

+1 −1

Original line number	Diff line number	Diff line
		@@ -13,7 +13,7 @@
		<li data-target="#Carousel" data-slide-to="1"></li>
		<li data-target="#Carousel" data-slide-to="2"></li>
		</ol>
		<div class="carousel-inner carousel-inner-whatis">
		<div class="carousel-inner carouselWhatis-inner">
		<div class="item active">
		<img src="/squares/tinygrap?theme=sugarsweets&numcolors=4" class="img-responsive">
		</div>