You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@drill.apache.org by ts...@apache.org on 2015/05/01 20:08:16 UTC
[20/50] [abbrv] drill git commit: Making homepage responsive.
Breaking at 570px max width and giving td display block,
aligning bg images and text to the left. Increasing font sizes,
differentiating between h1 and h2. Adding margins to text.
Making homepage responsive. Breaking at 570px max width and giving td
display block, aligning bg images and text to the left. Increasing font
sizes, differentiating between h1 and h2. Adding margins to text.
Project: http://git-wip-us.apache.org/repos/asf/drill/repo
Commit: http://git-wip-us.apache.org/repos/asf/drill/commit/0906e2af
Tree: http://git-wip-us.apache.org/repos/asf/drill/tree/0906e2af
Diff: http://git-wip-us.apache.org/repos/asf/drill/diff/0906e2af
Branch: refs/heads/gh-pages
Commit: 0906e2af81cf3506d6aaeee76a53fa9f693a0a49
Parents: b64cd54
Author: Danny <dk...@batchblue.com>
Authored: Wed Apr 29 23:19:53 2015 -0400
Committer: Danny <dk...@batchblue.com>
Committed: Wed Apr 29 23:19:53 2015 -0400
----------------------------------------------------------------------
css/responsive.css | 102 ++++++++++++++++++++++++++++++++++++++++++++++--
css/style.css | 20 +++++++++-
index.html | 48 ++++++++++++-----------
js/drill.js | 10 -----
4 files changed, 144 insertions(+), 36 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/drill/blob/0906e2af/css/responsive.css
----------------------------------------------------------------------
diff --git a/css/responsive.css b/css/responsive.css
index 2b806c7..99d4c5a 100644
--- a/css/responsive.css
+++ b/css/responsive.css
@@ -8,6 +8,9 @@ nav.breadcrumbs{
#menu ul li.menu-break {
display:none;
}
+.mobile-break {
+ display: none;
+}
/*@media (max-width: 768px) {
#menu ul li{
@@ -26,6 +29,9 @@ nav.breadcrumbs{
}
@media (max-width: 1024px) {
+ table.intro {
+ width: 940px;
+ }
.mw {
min-width: 0px;
}
@@ -103,11 +109,26 @@ nav.breadcrumbs{
#menu ul li.force-expand.search-bar {
clear:both;
}
+
+ /* Responsive Homepage 768 max width */
+ div.headlines.tc {
+ margin-left: 35px;
+ }
+ br.mobile-break {
+ display: block;
+ }
+ table.intro {
+ width: 768px;
+ }
}
+
@media (max-width: 570px) {
- body {
- font-size: 20px;
- }
+
+ /* Responsive Layout 570 max width */
+
+
+ /* Responsive Menu 570 max width */
+
#menu ul li.force-expand.nav, #menu ul li.force-expand#twitter-menu-item {
clear: both;
width: 100%;
@@ -132,3 +153,78 @@ nav.breadcrumbs{
float: right;
}
+ /* Responsive Homepage 570 max width */
+ #header .scroller .item .tc h1{
+ font-size: 40px;
+ }
+ #header .scroller .item .tc h2 {
+ font-size: 24px;
+ line-height: 32px;
+ }
+ #header .scroller .item div.headlines.tc {
+ margin-left: 30px;
+ }
+ div.headlines a.download-headline {
+ font-size: .7em;
+ }
+ #header .scroller .item div.headlines .btn { font-size: 16px; }
+
+ div.alertbar .hor-bar:after {
+ content: "";
+ }
+ div.alertbar {
+ text-align: left;
+ padding-left: 25px;
+ }
+ div.alertbar a {
+ display:block;
+ }
+ div.alertbar span.strong {
+ display: block;
+ }
+ table.intro {
+ width: 100%;
+ background: none;
+ }
+ table.intro td {
+ display: block;
+ padding: 25px 0 5px 0;
+ }
+ table.intro td h1 {
+ font-size: 24px;
+ text-align: left;
+ padding-left: 70px;
+ }
+ table.intro td.ag, table.intro td.fl, table.intro td.fa {
+ background-position: 30px 23%;
+ }
+ table.intro p {
+ font-size: 16px;
+ line-height: 24px;
+ padding: 2px 25px 15px 30px;
+ text-align: left;
+ }
+ table.intro span {
+ position: relative;
+ bottom: 10px;
+ padding-left: 30px;
+ text-align: left;
+ }
+
+ .home_txt p {
+ margin: 20px 10px 20px 10px;
+ }
+ .home_txt h1 {
+ font-size: 32px;
+ margin: 20px 10px 20px 10px;
+ }
+
+ .home_txt h2 {
+ font-size: 20px;
+ margin: 20px 10px 20px 10px;
+
+ }
+
+}
+
+
http://git-wip-us.apache.org/repos/asf/drill/blob/0906e2af/css/style.css
----------------------------------------------------------------------
diff --git a/css/style.css b/css/style.css
index 88d252e..ed8fbe5 100755
--- a/css/style.css
+++ b/css/style.css
@@ -339,12 +339,15 @@ a.anchor {
width:530px;
}
-#header .scroller .item .tc h1 {
+#header .scroller .item .tc h1, #header .scroller .item .tc h2 {
font-size:36px;
font-weight:lighter;
margin:0 0 8px 0;
padding:0;
}
+#header .scroller .item .tc h2 {
+ font-size: 20px;
+}
#header .scroller .item .tc p {
font-size:14px;
@@ -452,6 +455,20 @@ a.anchor {
.dots .dot.sel {
box-shadow: inset 0 0 0 8px white;
}
+div.alertbar
+ {
+ background-color:#ffc;
+ text-align: center;
+ display: block;
+ padding:10px;
+ border-bottom: solid 1px #cc9;
+ }
+div.alertbar .hor-bar:after {
+ content: "|";
+}
+span.strong {
+ font-weight: bold;
+}
.introWrapper {
border-bottom:1px solid #CCC;
@@ -462,6 +479,7 @@ table.intro {
background:url(../images/intro-bg.gif) no-repeat center;
table-layout:fixed;
text-align:center;
+ width: 940px;
}
table.intro td {
http://git-wip-us.apache.org/repos/asf/drill/blob/0906e2af/index.html
----------------------------------------------------------------------
diff --git a/index.html b/index.html
index 8c7b32a..6485fc0 100755
--- a/index.html
+++ b/index.html
@@ -12,36 +12,40 @@ layout: default
<div class="dots"></div>
<div class="scroller">
<div class="item">
- <div class="tc">
- <h1>Apache Drill</h1>
- <h1 style="font-size:20px">Schema-free SQL Query Engine for Hadoop and NoSQL</h1>
- <a href="{{ site.baseurl }}/download/" class="btn btn-1 btn-1c"><span>DOWNLOAD NOW</span></a>
+ <div class="headlines tc">
+ <h1 class="main-headline">Apache Drill</h1>
+ <h2 id="sub-headline">Schema-free SQL Query Engine <br class="mobile-break" /> for Hadoop and NoSQL</h2>
+ <a href="{{ site.baseurl }}/download/" class="download-headline btn btn-1 btn-1c"><span>DOWNLOAD NOW</span></a>
</div>
</div>
</div>
</div><!-- header -->
-<div id="alertbar" style="background-color:#ffc; text-align: center;display: block;padding:10px; border-bottom: solid 1px #cc9">
-<strong>News:</strong> <a href="{{ site.baseurl }}/blog/2015/03/31/drill-0.8-released/">Drill 0.8 Released</a> | <a href="{{ site.baseurl }}/blog/2015/03/23/microstrategy-announces-drill-support/">MicroStrategy Announces Drill Support</a>
+<div class="alertbar">
+ <span class="strong">News:</span> <a href="{{ site.baseurl }}/blog/2015/03/31/drill-0.8-released/">Drill 0.8 Released</a> <span class="hor-bar"></span> <a href="{{ site.baseurl }}/blog/2015/03/23/microstrategy-announces-drill-support/">MicroStrategy Announces Drill Support</a>
</div>
<div class="mw introWrapper">
- <table class="intro" cellpadding="0" cellspacing="0" align="center" width="940">
- <td class="ag">
- <h1>Agility</h1>
- <p>Get faster insights from big data with no IT intervention</p>
- <span><a href="#agility">LEARN MORE</a></span>
- </td>
- <td class="fl">
- <h1>Flexibility</h1>
- <p>Analyze semi-structured/nested data coming from NoSQL applications</p>
- <span><a href="#flexibility">LEARN MORE</a></span>
- </td>
- <td class="fa">
- <h1>Familiarity</h1>
- <p>Leverage existing SQL skillsets, BI tools and Apache Hive deployments</p>
- <span><a href="#familiarity">LEARN MORE</a></span>
- </td>
+ <table class="intro" cellpadding="0" cellspacing="0" align="center">
+ <tbody>
+ <tr>
+ <td class="ag">
+ <h1>Agility</h1>
+ <p>Get faster insights from big data with no IT intervention</p>
+ <span><a href="#agility">LEARN MORE</a></span>
+ </td>
+ <td class="fl">
+ <h1>Flexibility</h1>
+ <p>Analyze semi-structured/nested data coming from NoSQL applications</p>
+ <span><a href="#flexibility">LEARN MORE</a></span>
+ </td>
+ <td class="fa">
+ <h1>Familiarity</h1>
+ <p>Leverage existing SQL skillsets, BI tools and Apache Hive deployments</p>
+ <span><a href="#familiarity">LEARN MORE</a></span>
+ </td>
+ </tr>
+ </tbody>
</table>
</div>
http://git-wip-us.apache.org/repos/asf/drill/blob/0906e2af/js/drill.js
----------------------------------------------------------------------
diff --git a/js/drill.js b/js/drill.js
index 914945a..bf276f8 100644
--- a/js/drill.js
+++ b/js/drill.js
@@ -98,22 +98,12 @@ Drill.Docs = {
},
setCurrentDoc : function() {
- var current_l1 = $("li.toctree-l3.current");
var current_l2 = $("li.toctree-l2.current");
var current_l3 = $("li.toctree-l3.current");
Drill.Docs._setPlusMinus(current_l2);
Drill.Docs._setPlusMinus( current_l3.parent().prev("li") ); // requires knowledge of html structure...bad...bad.
// alternatively, set these up in the rendering of the docs, like the current_section and current are done.
-
- // set current <li>, starting from innermost possibility
- if(current_l3.length > 0){
- current_l3.addClass("current");
- } else if(current_l2.length > 0){
- current_l2.addClass("current");
- } else if(current_l1.length > 0){
- current_l1.addClass("current");
- }
},
_setPlusMinus : function(parent) {