fixed tablet display for first and second panels

This commit is contained in:
JesseBot 2016-01-04 05:05:42 +00:00
parent 8ed279c41e
commit 080c63ece0
2 changed files with 64 additions and 29 deletions

View file

@ -1,20 +1,47 @@
@media (min-width: 992px) {
.tinyPad {
padding-left: 50px;
@media (min-width: 768px) {
.padMe {
padding: 0px 130px 0px 130px;
}
.buttonLower {
padding-top: 50px;
}
.featureTextPad {
padding-top: 50px;
}
.featureImagePad {
padding-left: 50px;
}
.imageLower {
padding-top: 12px;
}
.starter-template {
padding: 40px 45px 0px 20px;
}
}
@media (min-width: 992px) {
.padMe {
padding: 0px 80px 0px 80px;
}
.featureImagePad {
padding-left: 50px;
}
.featureTextPad {
padding-top: 50px;
}
.buttonLower {
padding-top: 50px;
}
.imageLower {
padding-top: 11px;
}
.padMe {
padding: 0px 80px 0px 80px;
.starter-template {
padding: 40px 25px 0px 0px;
}
}
.starter-template {
padding: 40px 25px 0px 0px;
text-align: center;
}

View file

@ -13,11 +13,11 @@
<div id="collapseOne" class="panel-collapse collapse in">
<div class="panel-body">
<div class="row featurette">
<div class="col-md-5 tinyPad">
<div class="col-sm-6 col-md-5 featureImagePad">
<img class="featurette-image img-responsive img-circle" src="/images/{{main_pic}}">
</div>
<div class="col-md-7">
<h2 class="featurette-heading"><br /><span class="text-muted">Hi, I'm</span> {{name}}.</h2>
<div class="col-sm-6 col-md-7 featureTextPad">
<h2 class="featurette-heading"><span class="text-muted">Hi, I'm</span> {{name}}.</h2>
<p class="lead">{{header_quotation}}</p>
</div>
</div>
@ -36,28 +36,36 @@
<div id="collapseTwo" class="panel-collapse collapse">
<div class="panel-body">
<div class="row padMe">
<div class="col-xs-12 col-md-3 imageLower">
<img src="/images/docs.png">
</div>
<div class="col-xs-12 col-md-3 buttonLower">
<div class="btn-group">
<a href="{{gdoc_URL}}" class="col-xs-9 col-md-9 btn btn-primary btn-lg" role="button">Resume</a>
<button type="button" class="col-xs-3 col-md-3 btn btn-primary btn-lg dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="{{resume_pdf_download_URL}}">Download .PDF</a></li>
<li class="divider"></li>
<li><a href="{{resume_docx_download_URL}}">Download .Docx</a></li>
</ul>
<div class="col-md-6">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 imageLower">
<img src="/images/docs.png">
</div>
<div class="col-xs-12 col-sm-5 col-md-6 buttonLower">
<div class="btn-group">
<a href="{{gdoc_URL}}" class="col-xs-9 col-sm-9 col-md-9 btn btn-primary btn-lg" role="button">Resume</a>
<button type="button" class="col-xs-3 col-sm-3 col-md-3 btn btn-primary btn-lg dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu" role="menu">
<li><a href="{{resume_pdf_download_URL}}">Download .PDF</a></li>
<li class="divider"></li>
<li><a href="{{resume_docx_download_URL}}">Download .Docx</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-xs-12 col-md-3">
<img src="/images/githubcat.png">
</div>
<div class="col-xs-12 col-md-3 buttonLower">
<a href="{{GitHub_URL}}" class="btn btn-primary btn-lg" role="button">GitHub</a>
<div class="col-md-6">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 imageLower">
<img src="/images/githubcat.png">
</div>
<div class="col-xs-12 col-sm-6 col-sm-5 col-md-6 buttonLower">
<a href="{{GitHub_URL}}" class="btn btn-primary btn-lg" role="button">GitHub</a>
</div>
</div>
</div>
</div>
</div>