aatish/dynamicweb
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

carousel height changed to min height, other style fixes

Browse source
This commit is contained in:
Arvind Tiwari 2017-12-15 01:34:07 +05:30
commit 955331f64b
2 changed files with 32 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

31
ungleich_page/static/ungleich_page/css/ungleich.css
View file

@ -1,3 +1,9 @@
@media (min-width: 768px) and (max-width: 991px) {
.navbar > .container {
width: 100%;
}
}
.btn-trans { .btn-trans {
color: #fff; color: #fff;
border: 2px solid #fff; border: 2px solid #fff;
@ -143,14 +149,14 @@
} }
} }
.header_slider { .header_slider > .carousel .carousel-inner {
height: 95vh; min-height: 95vh;
display: flex;
} }
.header_slider > .carousel, .header_slider > .carousel .carousel-inner > .next,
.header_slider > .carousel .carousel-inner, .header_slider > .carousel .carousel-inner > .prev {
.header_slider > .carousel .item { bottom: 0;
height: 100%;
} }
.header_slider .carousel-indicators { .header_slider .carousel-indicators {
@ -180,6 +186,11 @@
margin-top: -50px; margin-top: -50px;
} }
.header_slider > .carousel .item {
background: rgba(0,0,0,0.5);
flex: 1;
}
.header_slider > .carousel .item .container { .header_slider > .carousel .item .container {
overflow: auto; overflow: auto;
padding: 50px 20px 60px; padding: 50px 20px 60px;
@ -190,16 +201,12 @@
/* background: rgba(0,0,0,0.5); */ /* background: rgba(0,0,0,0.5); */
} }
.header_slider > .carousel .item {
background: rgba(0,0,0,0.5);
}
.header_slider .intro-cap { .header_slider .intro-cap {
text-align: right; text-align: right;
line-height: 1.1; line-height: 1.1;
font-size: 23px; font-size: 23px;
margin-bottom: 12px; margin-bottom: 12px;
padding: 30px; padding: 30px 0;
} }
.header_slider .btn-trans { .header_slider .btn-trans {
@ -245,7 +252,7 @@
text-align: right; text-align: right;
line-height: 1.4; line-height: 1.4;
margin-bottom: 20px; margin-bottom: 20px;
padding: 15px; padding: 15px 0;
} }
@media (max-width: 768px) { @media (max-width: 768px) {

20
ungleich_page/templates/ungleich_page/includes/_header.html
View file

@ -1,7 +1,7 @@
{% load static i18n %} {% load static i18n %}
<header class="header_slider"> <header class="header_slider">
<div id="carousel-header-ungleich" class="carousel slide" data-interval="8000" data-ride="carousel"> <div id="carousel-header-ungleich" class="carousel slide" data-interval="8000">
<!-- Indicators --> <!-- Indicators -->
<ol class="carousel-indicators"> <ol class="carousel-indicators">
<li data-target="#carousel-header-ungleich" data-slide-to="0" class="active"></li> <li data-target="#carousel-header-ungleich" data-slide-to="0" class="active"></li>
@ -12,23 +12,23 @@
<!-- Wrapper for slides --> <!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox"> <div class="carousel-inner" role="listbox">
<div class="item active"> <div class="item active">
<div class="bg_vid"> <div class="bg_vid bg_vid_back">
<video id="bg_vid" autoplay muted> <video autoplay muted loop>
<source type="video/mp4" src="https://s3.ap-south-1.amazonaws.com/tiwariav-ungleich/applause.mp4"> <source type="video/mp4" src="https://s3.ap-south-1.amazonaws.com/tiwariav-ungleich/nico-cable.mp4">
</video> </video>
</div> </div>
<div class="container"> <div class="container">
<div class="intro-cap header_slider_box cam_corner"> <div class="intro-cap">
{% trans "We Design, Configure &amp; Maintain<br>Your Linux Infrastructure " %} {% trans "We Design, Configure &amp; Maintain<br>Your Linux Infrastructure " %}
</div> </div>
<p class="intro_lead header_slider_box">Ruby on Rails, Django, Java, Webserver, Mailserver, any infrastructure that needs to configured, we provide comprehensive solutions. Amazon, rackspace or bare metal servers, we configure for you.</p> <p class="intro_lead">Ruby on Rails, Django, Java, Webserver, Mailserver, any infrastructure that needs to configured, we provide comprehensive solutions. Amazon, rackspace or bare metal servers, we configure for you.</p>
<a class="btn btn-trans" href="">Learn More</a> <a class="btn btn-trans" href="">Learn More</a>
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<!-- <div class="bg_img" style="background-image:url({% static 'ungleich_page/img/glasfaser/header-nico-sans.jpg' %})"></div> --> <!-- <div class="bg_img" style="background-image:url({% static 'ungleich_page/img/glasfaser/header-nico-sans.jpg' %})"></div> -->
<div class="bg_vid bg_vid_back"> <div class="bg_vid bg_vid_back">
<video id="bg_vid" autoplay muted loop> <video autoplay muted loop>
<source type="video/mp4" src="https://s3.ap-south-1.amazonaws.com/tiwariav-ungleich/applause.mp4"> <source type="video/mp4" src="https://s3.ap-south-1.amazonaws.com/tiwariav-ungleich/applause.mp4">
</video> </video>
</div> </div>
@ -41,9 +41,9 @@
</div> </div>
</div> </div>
<div class="item"> <div class="item">
<div class="bg_vid"> <div class="bg_vid bg_vid_back">
<video id="bg_vid" autoplay muted> <video autoplay muted loop>
<source type="video/mp4" src="https://s3.ap-south-1.amazonaws.com/tiwariav-ungleich/applause.mp4"> <source type="video/mp4" src="https://s3.ap-south-1.amazonaws.com/tiwariav-ungleich/nanos.mp4">
</video> </video>
</div> </div>
<div class="container"> <div class="container">