Merge pull request #570 from tiwariav/task/4150/ungleich_mobile_font

task/4150/mobile_font_alignment
This commit is contained in:
Arvind Tiwari 2018-02-23 21:05:27 +05:30 committed by GitHub
commit 4d31f2bbdc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 42 additions and 25 deletions

View file

@ -215,7 +215,7 @@ fieldset[disabled] .btn-xl.active {
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus { .navbar-default .navbar-toggle:focus {
background-color: #fed136; background-color: transparent;
} }
.navbar-default .nav li a { .navbar-default .nav li a {
@ -364,6 +364,8 @@ section h2.section-heading {
margin-bottom: 15px; margin-bottom: 15px;
font-size: 26px; font-size: 26px;
color: #494949; color: #494949;
letter-spacing: -1px;
font-weight: 400;
} }
section h3.section-subheading { section h3.section-subheading {
@ -697,6 +699,11 @@ section h3.section-subheading {
.team-member .team-member-caption p { .team-member .team-member-caption p {
line-height: 1.5; line-height: 1.5;
} }
.team-member {
max-width: 400px;
margin-left: auto;
margin-right: auto;
}
} }
@media(min-width:768px) { @media(min-width:768px) {
@ -976,9 +983,10 @@ section h3.section-comment {
} }
@media (max-width: 767px) { @media (max-width: 767px) {
.carousel-text { .ungleich-gallery-text-carousel .carousel-text {
height: 220px; height: 220px;
overflow: scroll; overflow-y: scroll;
text-align: left;
} }
.carousel-author { .carousel-author {
height: 72px; height: 72px;

View file

@ -176,10 +176,15 @@
.timeline>li .timeline-panel { .timeline>li .timeline-panel {
display: flex; display: flex;
min-height: 80px; min-height: 80px;
align-items: center;
padding-bottom: 15px; padding-bottom: 15px;
} }
@media(min-width: 768px) {
.timeline>li .timeline-panel {
align-items: center;
}
}
.timeline>li.timeline-inverted>.timeline-panel { .timeline>li.timeline-inverted>.timeline-panel {
padding-bottom: 0; padding-bottom: 0;
} }
@ -196,6 +201,7 @@
.contact-section p { .contact-section p {
font-size: 20px; font-size: 20px;
line-height: 1.4;
} }
footer { footer {

View file

@ -120,6 +120,7 @@
padding: 0px 25px; padding: 0px 25px;
max-width: 400px; max-width: 400px;
text-align: center; text-align: center;
width: 100%;
} }
.cursor-pointer { .cursor-pointer {
@ -146,6 +147,9 @@
.section-subheading.sm_left { .section-subheading.sm_left {
padding-left: 15px; padding-left: 15px;
padding-right: 15px; padding-right: 15px;
max-width: 600px;
margin-left: auto;
margin-right: auto;
} }
} }

View file

@ -104,8 +104,8 @@
<h2 class="section-heading text-center">Was ist es?</h2> <h2 class="section-heading text-center">Was ist es?</h2>
</div> </div>
<div class="split-description text-center wow fadeInUp"> <div class="split-description text-center wow fadeInUp">
<p class="lead">Bei diesem Angebot handelt es sich um einen Internetzugang für Firmenkunden.</p> <p class="lead sm_left">Bei diesem Angebot handelt es sich um einen Internetzugang für Firmenkunden.</p>
<p class="lead">Sie erhalten in Zusammenarbeit mit unseren Partnern einen Glasfaseranschluss und eine Internetverbindung.</p> <p class="lead sm_left">Sie erhalten in Zusammenarbeit mit unseren Partnern einen Glasfaseranschluss und eine Internetverbindung.</p>
</div> </div>
</div> </div>
</div> </div>
@ -123,8 +123,8 @@
<img src="{% static 'ungleich_page/img/glasfaser/business.svg' %}" class="img-responsive img-circle" alt=""> <img src="{% static 'ungleich_page/img/glasfaser/business.svg' %}" class="img-responsive img-circle" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">Business-Internet</h4> <h4 class="portfolio-caption">Business-Internet</h4>
<p class="text-muted">Symmetrische Internetleitung 100 Mbit/s upload und 100 Mbit/s download</p> <p class="text-muted sm_left">Symmetrische Internetleitung 100 Mbit/s upload und 100 Mbit/s download</p>
<p class="text-muted">Glasfaser-Installation bis ins Haus (keine Hausverkabelung)</p> <p class="text-muted sm_left">Glasfaser-Installation bis ins Haus (keine Hausverkabelung)</p>
</div> </div>
</div> </div>
</div> </div>
@ -133,8 +133,8 @@
<img src="{% static 'ungleich_page/img/glasfaser/ip.svg' %}" class="img-responsive img-circle" alt=""> <img src="{% static 'ungleich_page/img/glasfaser/ip.svg' %}" class="img-responsive img-circle" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">Erreichbarkeit im Internet</h4> <h4 class="portfolio-caption">Erreichbarkeit im Internet</h4>
<p class="text-muted">1 öffentliches IPv6-Netzwerk (/64)</p> <p class="text-muted sm_left">1 öffentliches IPv6-Netzwerk (/64)</p>
<p class="text-muted">1 öffentliche IPv4-Adresse</p> <p class="text-muted sm_left">1 öffentliche IPv4-Adresse</p>
</div> </div>
</div> </div>
</div> </div>
@ -143,8 +143,8 @@
<img src="{% static 'ungleich_page/img/glasfaser/switch.svg' %}" class="img-responsive img-circle" alt=""> <img src="{% static 'ungleich_page/img/glasfaser/switch.svg' %}" class="img-responsive img-circle" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">Einfach zu nutzen</h4> <h4 class="portfolio-caption">Einfach zu nutzen</h4>
<p class="text-muted">2 bereits für Sie konfigurierte Endgeräte (benötigt zwei Ihrer Steckdosen)</p> <p class="text-muted sm_left">2 bereits für Sie konfigurierte Endgeräte (benötigt zwei Ihrer Steckdosen)</p>
<p class="text-muted">Einfach einstecken und los!</p> <p class="text-muted sm_left">Einfach einstecken und los!</p>
</div> </div>
</div> </div>
</div> </div>
@ -157,7 +157,7 @@
<div class="container"> <div class="container">
<div class="text-center wow fadeInDown section-heading-contain"> <div class="text-center wow fadeInDown section-heading-contain">
<h2 class="section-heading">Wie funktioniert es?</h2> <h2 class="section-heading">Wie funktioniert es?</h2>
<h3 class="section-subheading text-muted">So kommen Sie in wenigen einfachen Schritten zu Ihrem High-Speed-Internet</h3> <h3 class="section-subheading text-muted sm_left">So kommen Sie in wenigen einfachen Schritten zu Ihrem High-Speed-Internet</h3>
</div> </div>
<div class="row"> <div class="row">
<div class="col-lg-12"> <div class="col-lg-12">

View file

@ -2,6 +2,6 @@
<img src="{{ instance.image.url }}" class="img-responsive img-circle" alt=""> <img src="{{ instance.image.url }}" class="img-responsive img-circle" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">{{ instance.title }}</h4> <h4 class="portfolio-caption">{{ instance.title }}</h4>
<p class="text-muted">{{ instance.description }}</p> <p class="text-muted sm_left">{{ instance.description }}</p>
</div> </div>
</div> </div>

View file

@ -16,7 +16,7 @@
<img src="{% static 'ungleich_page/img/team/5.jpg' %}" data-replaced="{% static 'ungleich_page/img/services/hosting.png' %}" class="img-responsive img-circle img-toggle" alt=""> <img src="{% static 'ungleich_page/img/team/5.jpg' %}" data-replaced="{% static 'ungleich_page/img/services/hosting.png' %}" class="img-responsive img-circle img-toggle" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">{% trans "Hosting" %}</h4> <h4 class="portfolio-caption">{% trans "Hosting" %}</h4>
<p class="text-muted">{% trans "Ruby on Rails. Java hosting, Django hosting, we make it everything run smooth and safe." %}</p> <p class="text-muted sm_left">{% trans "Ruby on Rails. Java hosting, Django hosting, we make it everything run smooth and safe." %}</p>
</div> </div>
</div> </div>
</div> </div>
@ -25,7 +25,7 @@
<img src="{% static 'ungleich_page/img/team/4.jpg' %}" data-replaced="{% static 'ungleich_page/img/services/configuration.png' %}" class="img-responsive img-circle img-toggle" alt=""> <img src="{% static 'ungleich_page/img/team/4.jpg' %}" data-replaced="{% static 'ungleich_page/img/services/configuration.png' %}" class="img-responsive img-circle img-toggle" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">{% trans "Configuration as a Service" %}</h4> <h4 class="portfolio-caption">{% trans "Configuration as a Service" %}</h4>
<p class="text-muted">{% trans "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="text-muted sm_left">{% trans "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>
</div> </div>
</div> </div>
</div> </div>
@ -34,7 +34,7 @@
<img src="{% static 'ungleich_page/img/team/6.jpg' %}" data-replaced="{% static 'ungleich_page/img/services/linux.png' %}" class="img-responsive img-circle img-toggle cursor-pointer" alt=""> <img src="{% static 'ungleich_page/img/team/6.jpg' %}" data-replaced="{% static 'ungleich_page/img/services/linux.png' %}" class="img-responsive img-circle img-toggle cursor-pointer" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">{% trans "Linux System Engineering" %}</h4> <h4 class="portfolio-caption">{% trans "Linux System Engineering" %}</h4>
<p class="text-muted">{% trans "Let your developers develop! We take care of your system administration. Gentoo, Archlinux, Debian, Ubuntu, and many more." %}</p> <p class="text-muted sm_left">{% trans "Let your developers develop! We take care of your system administration. Gentoo, Archlinux, Debian, Ubuntu, and many more." %}</p>
</div> </div>
</div> </div>
</div> </div>

View file

@ -11,7 +11,7 @@
<div class="row"> <div class="row">
<div class="col-sm-10 col-sm-offset-1 wow fadeInDown"> <div class="col-sm-10 col-sm-offset-1 wow fadeInDown">
<!-- start:recommendationSlider --> <!-- start:recommendationSlider -->
<div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-ride="carousel" data-interval="3000"> <div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-interval="3000">
<!-- Indicators --> <!-- Indicators -->
<ol class="carousel-indicators"> <ol class="carousel-indicators">
<li data-target="#carousel-recommendation-ungleich" data-slide-to="0" class="active"></li> <li data-target="#carousel-recommendation-ungleich" data-slide-to="0" class="active"></li>
@ -23,7 +23,7 @@
<div class="carousel-inner" role="listbox"> <div class="carousel-inner" role="listbox">
<div class="item active"> <div class="item active">
<img class="center-block img-client img-responsive" src="{% static 'ungleich_page/img/client-logos/teralytics.png' %}" /> <img class="center-block img-client img-responsive" src="{% static 'ungleich_page/img/client-logos/teralytics.png' %}" />
<p class="carousel-text text-muted text-center"> <p class="carousel-text text-muted">
{% blocktrans %} {% blocktrans %}
"ungleich helped us getting started with our internal "ungleich helped us getting started with our internal
infrastructure, hosted on physical servers in a infrastructure, hosted on physical servers in a
@ -45,7 +45,7 @@
</div> </div>
<div class="item"> <div class="item">
<img class="center-block img-client img-responsive" src="{% static 'ungleich_page/img/client-logos/panter.png' %}" /> <img class="center-block img-client img-responsive" src="{% static 'ungleich_page/img/client-logos/panter.png' %}" />
<p class="carousel-text text-muted text-center"> <p class="carousel-text text-muted">
{% blocktrans %} {% blocktrans %}
"Thanks to ungleich team, who has designed and "Thanks to ungleich team, who has designed and
configured our company's Linux infrastructure, our configured our company's Linux infrastructure, our
@ -61,7 +61,7 @@
</div> </div>
<div class="item"> <div class="item">
<img class="center-block img-client img-responsive" src="{% static 'ungleich_page/img/client-logos/logo_ruag.png' %}" /> <img class="center-block img-client img-responsive" src="{% static 'ungleich_page/img/client-logos/logo_ruag.png' %}" />
<p class="carousel-text text-muted text-center"> <p class="carousel-text text-muted">
{% blocktrans %} {% blocktrans %}
"ungleich provided an excellent service in designing "ungleich provided an excellent service in designing
our system architecture and created secure and stable our system architecture and created secure and stable

View file

@ -15,7 +15,7 @@
<!-- Bootstrap Core CSS --> <!-- Bootstrap Core CSS -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link href="{% static 'ungleich_page/css/lib/animate.min.css' %}" rel="stylesheet"> <link href="{% static 'ungleich_page/css/lib/animate.min.css' %}" rel="stylesheet">
<link href="//fonts.googleapis.com/css?family=Raleway|Montserrat:400,700|Droid+Serif:400,700,400italic,700italic|Roboto+Slab:400,100,300,700" rel="stylesheet" type="text/css"> <link href="//fonts.googleapis.com/css?family=Raleway:400,700|Montserrat:400,700|Droid+Serif:400,700,400italic,700italic|Roboto+Slab:400,100,300,700" rel="stylesheet" type="text/css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// --> <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->

View file

@ -1,8 +1,7 @@
<div class="team-member wow fadeInUp" data-wow-delay="0.25s"> <div class="team-member wow fadeInUp" data-wow-delay="0.25s">
<img src="{{ instance.image.url }}" class="img-responsive img-circle" alt=""> <img src="{{ instance.image.url }}" class="img-responsive img-circle" alt="">
<div class="team-member-caption inline-block"> <div class="team-member-caption inline-block">
<h4 class="portfolio-caption">{{ instance.title }}</h4> <h4 class="portfolio-caption">{{ instance.title }}</h4>
<p>&nbsp;</p> <p><span class="text-muted">{{ instance.description }}</span></p>
<p><span class="text-muted">{{ instance.description }}</span></p>
</div> </div>
</div> </div>