feat: first draft of design update - new logo - removed textured linen, moved to flat grey - new top-level marketing slogans - new intro texts (wip) - new 2.0 download section (final links TBD)
Project: http://git-wip-us.apache.org/repos/asf/couchdb-www/repo Commit: http://git-wip-us.apache.org/repos/asf/couchdb-www/commit/8e3e4c56 Tree: http://git-wip-us.apache.org/repos/asf/couchdb-www/tree/8e3e4c56 Diff: http://git-wip-us.apache.org/repos/asf/couchdb-www/diff/8e3e4c56 Branch: refs/heads/asf-site Commit: 8e3e4c560302eedf9b6b53b7c809d79c3b502bca Parents: 0a1ed25 Author: Jan Lehnardt <j...@apache.org> Authored: Sat Sep 3 14:18:41 2016 +0200 Committer: Jan Lehnardt <j...@apache.org> Committed: Sat Sep 3 14:18:41 2016 +0200 ---------------------------------------------------------------------- image/couch.png | Bin 7941 -> 16425 bytes image/logo.png | Bin 1498 -> 12489 bytes index.html | 105 +++++++++++++++++++++++++++++++++++++++++++------ style/master.css | 79 +++++++++++++++++++------------------ style/master.less | 56 ++++++++++++++------------ 5 files changed, 163 insertions(+), 77 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/couchdb-www/blob/8e3e4c56/image/couch.png ---------------------------------------------------------------------- diff --git a/image/couch.png b/image/couch.png index 196b6f9..8fcc38b 100644 Binary files a/image/couch.png and b/image/couch.png differ http://git-wip-us.apache.org/repos/asf/couchdb-www/blob/8e3e4c56/image/logo.png ---------------------------------------------------------------------- diff --git a/image/logo.png b/image/logo.png index c47a629..0f615a9 100644 Binary files a/image/logo.png and b/image/logo.png differ http://git-wip-us.apache.org/repos/asf/couchdb-www/blob/8e3e4c56/index.html ---------------------------------------------------------------------- diff --git a/index.html b/index.html index 833d07d..59c84bc 100644 --- a/index.html +++ b/index.html @@ -51,6 +51,8 @@ This fabulous linen texture was integrated into the site design. <form class="menu-dropdown"> <select onchange="location = this.options[this.selectedIndex].value;"> + <option value="">Menu</option> + <option value="">----</option> <option value="#about">About</option> <option value="#contribute">Contribute</option> <option value="#mailing-lists">Mailing Lists</option> @@ -67,6 +69,12 @@ This fabulous linen texture was integrated into the site design. <div class="header-placeholder"></div> + <div class="wrap feature"> + + <h2 class="main"><strong>Apache CouchDB</strong>: Data Sync Done Right</h2> + + </div> + <div class="grid leadin"> <div class="wrap"> @@ -74,14 +82,14 @@ This fabulous linen texture was integrated into the site design. <img src="image/couch.png" alt=""/> <ul class="text-block"> - <li><h1><strong>Apache CouchDB</strong>™ is a database</h1></li> - <li><h1>that uses <strong>JSON</strong> for documents,</h1></li> - <li><h1><strong>JavaScript</strong> for <strong>MapReduce</strong> indexes,</h1></li> - <li><h1>and regular <strong>HTTP</strong> for its <strong>API</strong></h1></li> + <li><h1><strong>Seamless</strong> multi-master sync, that</h1></li> + <li><h1>scales from <strong>Big Data</strong> to <strong>Mobile.</strong></h1></li> + <li><h1>With an <strong>Intuitive</strong> HTTP/JSON API</h1></li> + <li><h1>and designed for <strong>reliability</strong></h1></li> </ul> <div class="button-container"> - <a class="button" href="#download">DOWNLOAD<small class="download-version">Version 1.6.1</small></a> + <a class="button" href="#download">DOWNLOAD<small class="download-version">Version 2.0.0 (September 6th 2016)</small></a> </div> </div> @@ -92,11 +100,26 @@ This fabulous linen texture was integrated into the site design. <div class="wrap feature"> - <h2 class="icon icon-about">A Database for the Web</h2> + <h2 class="icon icon-about">Data where you need it</h2> + + <p> + Apache CouchDB™ lets you access your data where you need it by + defining the Couch Replication Protocol that is implemented by a variety of + projects and products that span every imaginable computing environment from + distributed server-clusters, over mobile phones to web browsers. + </p> - <p>CouchDB is a database that completely embraces the web. Store your data with JSON documents. Access your documents and query your indexes with your web browser, via HTTP. Index, combine, and transform your documents with JavaScript. CouchDB works well with modern web and mobile apps. You can even serve web apps directly out of CouchDB. And you can distribute your data, or your apps, efficiently using CouchDBâs incremental replication. CouchDB supports master-master setups with automatic conflict detection. + <p> + Description: Store your data safely, on your own servers, or with any leading + cloud provider. Your web- and native applications love CouchDB, because it + speaks JSON natively and supports binary attachments for all your data storage + needs. The Couch Replication Protocol lets your data flow seamlessly between + server clusters to mobile phones and web browsers, enabling a compelling, + offline-first, user-experience while maintaining high performance and strong + reliability. CouchDB comes with a developer-friendly query language, and + optionally MapReduce for simple, efficient, and comprehensive data retrieval. + </p> - <p>CouchDB comes with a suite of features, such as on-the-fly document transformation and real-time change notifications, that makes web app development a breeze. It even comes with an easy to use web administration console. You guessed it, served up directly out of CouchDB! We care a lot about <a href="http://en.wikipedia.org/wiki/CAP_theorem";>distributed scaling</a>. CouchDB is highly available and partition tolerant, but is also <a href="http://guide.couchdb.org/editions/1/en/consistency.html";>eventually consistent</a>. And we care <em>a lot</em> about your data. CouchDB has a fault-tolerant storage engine that puts the safety of your data <em>first</em>. <p>See the <a href="https://cwiki.apache.org/confluence/display/COUCHDB/Introduction";>introduction</a>, <a href="http://wiki.apache.org/couchdb/Technical%20Overview";>technical overview</a>, or one of the <a href="http://wiki.apache.org/couchdb/Basics";>guides</a> for more information. @@ -372,6 +395,68 @@ This fabulous linen texture was integrated into the site design. <hr> <div class="wrap download-pane"> + <h2 class="icon icon-download">Download CouchDB 2.0.0</h2> + </div> + + <div class="grid"> + + <div class="wrap"> + + <div class="corner"></div> + + <div class="download-list-container"> + + <ul class="list download-list"> + <li> + <a href="https://www.apache.org/dyn/closer.lua?path=/couchdb/source/2.0.0/apache-couchdb-2.0.0.tar.gz"; class="type">Source</a> + <span class="info"> + Version 2.0.0 | + <a href="http://docs.couchdb.org/en/latest/whatsnew/1.6.html"; class="release">Release Notes</a> | + <a href="https://www.apache.org/dist/couchdb/source/2.0.0/apache-couchdb-2.0.0.tar.gz.asc";>OpenPGP</a> | + <a href="https://www.apache.org/dist/couchdb/source/2.0.0/apache-couchdb-2.0.0.tar.gz.md5";>MD5</a> | + <a href="https://www.apache.org/dist/couchdb/source/2.0.0/apache-couchdb-2.0.0.tar.gz.sha";>SHA</a> + </span> + </li> + <li> + <a href="https://dl.bintray.com/apache/couchdb/win/2.0.0/setup-couchdb-2.0.0_R16B02.exe"; class="type"> + Windows (x86) + </a> + <span class="info"> + Erlang/OTP R16B02 | Version 2.0.0 | + <a href="http://docs.couchdb.org/en/latest/whatsnew/1.6.html"; class="release">Release Notes</a> | + <a href="https://www.apache.org/dist/couchdb/binary/win/2.0.0/setup-couchdb-2.0.0_R16B02.exe.asc";>OpenPGP</a> | + <a href="https://www.apache.org/dist/couchdb/binary/win/2.0.0/setup-couchdb-2.0.0_R16B02.exe.md5";>MD5</a> | + <a href="https://www.apache.org/dist/couchdb/binary/win/2.0.0/setup-couchdb-2.0.0_R16B02.exe.sha";>SHA</a> + </span> + </li> + <li> + <a href="https://dl.bintray.com/apache/couchdb/mac/2.0.0/Apache-CouchDB-2.0.0.zip"; class="type"> + Mac OS X (10.6+) + </a> + <span class="info"> + Erlang/OTP R16B01 | Version 2.0.0 | + <a href="http://docs.couchdb.org/en/latest/whatsnew/1.6.html"; class="release">Release Notes</a> | + <a href="https://www.apache.org/dist/couchdb/binary/mac/2.0.0/Apache-CouchDB-2.0.0.zip.asc";>OpenPGP</a> | + <a href="https://www.apache.org/dist/couchdb/binary/mac/2.0.0/Apache-CouchDB-2.0.0.zip.md5";>MD5</a> | + <a href="https://www.apache.org/dist/couchdb/binary/mac/2.0.0/Apache-CouchDB-2.0.0.zip.sha";>SHA</a> + </span> + </li> + <li> + <a href="https://launchpad.net/~couchdb/+archive/stable"; class="type">Ubuntu packages</a> + <span class="info"> + Version 2.0.0 | + <a href="http://docs.couchdb.org/en/latest/whatsnew/1.6.html"; class="release">Release Notes</a> + </span> + </li> + </ul> + + </div> + + </div> + + </div> + + <div class="wrap download-pane"> <h2 class="icon icon-download">Download CouchDB 1.6.1</h2> </div> @@ -425,10 +510,6 @@ This fabulous linen texture was integrated into the site design. <a href="http://docs.couchdb.org/en/latest/whatsnew/1.6.html"; class="release">Release Notes</a> </span> </li> - <li> - <a href="/developer-preview/2.0/" class="type">2.0 Developer Preview</a> - <span class="info">Help us test the Future of CouchDBâ¦</span> - </li> </ul> </div> http://git-wip-us.apache.org/repos/asf/couchdb-www/blob/8e3e4c56/style/master.css ---------------------------------------------------------------------- diff --git a/style/master.css b/style/master.css index e4f12f2..400c3dd 100644 --- a/style/master.css +++ b/style/master.css @@ -19,7 +19,7 @@ a { transition: all 0.25s linear; } .secondary-bg { - background: url(../image/linen.jpg) #eeeeee 50% 0%; + background: #EEE 50% 0%; } .sprite { background: url(../image/sprite.png) no-repeat; @@ -69,7 +69,7 @@ button { font-weight: 300; } .feature { - font-size: 21px; + font-size: 24px; } .platforms-list li, .list-header.mini, @@ -77,11 +77,17 @@ button { font-family: 'HelveticaNeue-Medium', 'HelveticaNeue', Helvetica, Arial, sans-serif; font-weight: 500; } +.menu { + font-size: 19px; +} +h2.main { + text-align: center; +} /*--------------------------------------------------- Generic ---------------------------------------------------*/ a:hover { - color: #ff0000; + color: #e12830; } p { line-height: 2em; @@ -98,7 +104,7 @@ p + p { .button { display: block; background: url(../image/sprite.png) no-repeat; - background-color: #ff0000; + background-color: #e12830; background-position: 100% -171px; width: 288px; padding: 16px; @@ -148,7 +154,7 @@ hr { position: relative; } .grid { - background: url(../image/linen.jpg) #eeeeee 50% 0%; + background: #EEE 50% 0%; padding: 32px 0; } hr { @@ -190,20 +196,13 @@ blockquote { } .logo, .closing { - background: url(../image/sprite.png) no-repeat; - -webkit-transition: background 0.25s linear; - -moz-transition: background 0.25s linear; - transition: background 0.25s linear; - background-color: #ff0000; + background: url(../image/logo.png); background-position: 0 0px; position: absolute; left: 0; - top: 5px; - width: 220px; - height: 75px; -} -.logo:hover { - background-color: #ae2323; + top: 13px; + width: 250px; + height: 65px; } .menu { padding: 16px 0; @@ -215,11 +214,11 @@ blockquote { -moz-transition: all 0.25s linear; transition: all 0.25s linear; padding: 16px; - margin: 0 8px; + margin: 0 2.28571429px; line-height: 55px; } .menu a:hover { - color: #ff0000; + color: #e12830; } .menu-dropdown { display: none; @@ -230,6 +229,7 @@ blockquote { } .menu-dropdown select { width: 100%; + font-size: 30px; } /*--------------------------------------------------- Layout - Leadin @@ -257,7 +257,7 @@ blockquote { .leadin h1 { background: #fff; display: inline; - padding: 4px 8px; + padding: 2px 8px; } .leadin .button-container { bottom: 0; @@ -320,7 +320,7 @@ blockquote { width: 36px; background: url(../image/sprite.png) no-repeat; background-position: 3px -127px; - background-color: #ff0000; + background-color: #e12830; } .platforms-list li a:hover { background-color: #ae2323; @@ -356,7 +356,7 @@ blockquote { } .mailing-list a:hover { color: #fff; - background: #ff0000; + background: #e12830; } .mailing-list a span { position: absolute; @@ -366,7 +366,7 @@ blockquote { width: 36px; background: url(../image/sprite.png) no-repeat; background-position: -156px -95px; - background-color: #ff0000; + background-color: #e12830; } .mailing-list li { margin-bottom: 3px; @@ -398,7 +398,7 @@ blockquote { transition: background 0.25s linear; background: url(../image/sprite.png) no-repeat; background-position: -160px -127px; - background-color: #ff0000; + background-color: #e12830; color: #fff; text-decoration: none; right: auto; @@ -447,7 +447,7 @@ blockquote { } .more a:hover { color: #fff; - background: #ff0000; + background: #e12830; } .more a span { position: absolute; @@ -457,7 +457,7 @@ blockquote { width: 36px; background: url(../image/sprite.png) no-repeat; background-position: -156px -95px; - background-color: #ff0000; + background-color: #e12830; } /*--------------------------------------------------- Layout - Footer @@ -470,11 +470,11 @@ blockquote { line-height: 1.5em; } .closing { - background-position: 0 -725px; + background-position: 0 0px; left: auto; right: 0; - top: 20px; - width: 60px; + top: 13px; + width: 250px; height: 65px; } .closing:hover { @@ -597,9 +597,9 @@ a.pt-about { padding-top: 54px; } .leadin img { - top: 0; + top: 32px; width: 240px; - height: 270px; + height: 158px; } .leadin .text-block { top: 32px; @@ -635,7 +635,7 @@ a.pt-about { } .leadin img { width: 192px; - height: 216px; + height: 126px; } .leadin .text-block { top: 32px; @@ -679,10 +679,11 @@ a.pt-about { height: 52px; } .logo { - top: 7px; + top: 10px; + left: 10px; width: 110px; - height: 37px; - background-size: 112px 425px; + height: 28px; + background-size: 110px 28px; } #footer { padding-bottom: 28px; @@ -696,7 +697,7 @@ a.pt-about { .leadin img { left: -4px; width: 160px; - height: 180px; + height: 105px; } .leadin .text-block { left: 175px; @@ -724,7 +725,7 @@ a.pt-about { } .leadin img { width: 128px; - height: 144px; + height: 84px; } .leadin .text-block { left: 130px; @@ -888,7 +889,7 @@ a.pt-about { font-size: 16px; line-height: 1.8em; list-style: none; - color: #ff0000; + color: #e12830; } .skill-card ul a, .skill-card li a { @@ -906,9 +907,9 @@ a.pt-about { } .skill-card:hover .stripe { height: 5px; - background-color: #ff0000; + background-color: #e12830; } .skill-card a:hover { - color: #ff0000; + color: #e12830; text-decoration: underline; } http://git-wip-us.apache.org/repos/asf/couchdb-www/blob/8e3e4c56/style/master.less ---------------------------------------------------------------------- diff --git a/style/master.less b/style/master.less index 23cc8b2..74b6b96 100644 --- a/style/master.less +++ b/style/master.less @@ -21,7 +21,7 @@ body, a { @background-half-size: 112px 425px; @main-color: #291d1e; -@key-color: #ff0000; +@key-color: #e12830; @key-color-hover: #ae2323; @disable-color: #abafb0; @@ -41,7 +41,7 @@ body, a { } .secondary-bg { - background: url(../image/linen.jpg) #EEE 50% 0%; + background: #EEE 50% 0%; } .sprite { @@ -90,7 +90,7 @@ button { } .feature { - font-size: 21px; + font-size: 24px; } .platforms-list li, .list-header.mini, .more-header li { @@ -98,6 +98,14 @@ button { font-weight: 500; } +.menu { + font-size: 19px +} + +h2.main { + text-align: center; +} + /*--------------------------------------------------- Generic ---------------------------------------------------*/ @@ -224,19 +232,13 @@ blockquote { } .logo, .closing { - .sprite; - .animate-background; - background-color: @key-color; + background: url(../image/logo.png); background-position: 0 0px; position: absolute; left: 0; - top: 5px; - width: 220px; - height: 75px; -} - -.logo:hover { - background-color: @key-color-hover; + top: 13px; + width: 250px; + height: 65px; } .menu { @@ -247,7 +249,7 @@ blockquote { text-decoration: none; .animate; padding: @padding; - margin: 0 @padding/2; + margin: 0 @padding/7; line-height: 55px; } .menu a:hover { @@ -264,6 +266,7 @@ blockquote { .menu-dropdown select{ width: 100%; + font-size: 30px; } /*--------------------------------------------------- @@ -298,7 +301,7 @@ blockquote { .leadin h1 { background: #fff; display: inline; - padding: 4px 8px; + padding: 2px 8px; } .leadin .button-container { @@ -533,11 +536,11 @@ blockquote { } .closing { - background-position: 0 -725px; + background-position: 0 0px; left: auto; right: 0; - top: 20px; - width: 60px; + top: 13px; + width: 250px; height: 65px; } @@ -668,9 +671,9 @@ a.pt-about { padding-top: 54px; } .leadin img { - top: 0; + top: @gap; width: 240px; - height: 270px; + height: 158px; } .leadin .text-block { top: 32px; @@ -707,7 +710,7 @@ a.pt-about { } .leadin img { width: 192px; - height: 216px; + height: 126px; } .leadin .text-block { top: 32px; @@ -746,10 +749,11 @@ a.pt-about { height: 52px; } .logo { - top: 7px; + top: 10px; + left: 10px; width: 110px; - height: 37px; - background-size: @background-half-size; + height: 28px; + background-size: 110px 28px; } #footer { padding-bottom: 28px; @@ -764,7 +768,7 @@ a.pt-about { .leadin img { left: -4px; width: 160px; - height: 180px; + height: 105px; } .leadin .text-block { left: 175px; @@ -793,7 +797,7 @@ a.pt-about { } .leadin img { width: 128px; - height: 144px; + height: 84px; } .leadin .text-block { left: 130px;
