You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cordova.apache.org by st...@apache.org on 2014/01/20 19:42:12 UTC
[22/32] git commit: Updated more styles. Updated image reference for
the dummy search box at the top. Added in some dummy data to be used on the
home page. The dummy data comes in two forms - one is on the home controller,
the other is a plugins.json fil
Updated more styles. Updated image reference for the dummy search box at the top. Added in some dummy data to be used on the home page. The dummy data comes in two forms - one is on the home controller, the other is a plugins.json file i do a request to so i dont interfere too much with Steves previous lookup method. Added in links for plugin registry issue tracker, cordova plugin docs, apache cordova homepage url
Project: http://git-wip-us.apache.org/repos/asf/cordova-registry-web/repo
Commit: http://git-wip-us.apache.org/repos/asf/cordova-registry-web/commit/7f92c398
Tree: http://git-wip-us.apache.org/repos/asf/cordova-registry-web/tree/7f92c398
Diff: http://git-wip-us.apache.org/repos/asf/cordova-registry-web/diff/7f92c398
Branch: refs/heads/refactor
Commit: 7f92c3988f090985a4495369643d1e580c37786f
Parents: 4e7adf9
Author: Josh Bavari <jo...@raisemore.com>
Authored: Sun Jan 19 03:21:19 2014 -0600
Committer: Josh Bavari <jo...@raisemore.com>
Committed: Sun Jan 19 03:21:19 2014 -0600
----------------------------------------------------------------------
attachments/css/footer.less | 2 +-
attachments/css/header.less | 4 +
attachments/css/layout.less | 17 +-
attachments/css/pages/home.less | 30 +-
attachments/css/styles.css | 526 ++++++++-----------------
attachments/css/styles.less | 2 +-
attachments/css/topcoat-desktop-light.css | 2 +-
attachments/css/topcoat-mobile-light.css | 2 +-
attachments/css/variables.less | 2 +
attachments/index.html | 35 +-
attachments/js/controllers/home.js | 43 +-
attachments/partials/views/home.html | 73 +++-
attachments/plugins.json | 102 +++++
13 files changed, 430 insertions(+), 410 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/footer.less
----------------------------------------------------------------------
diff --git a/attachments/css/footer.less b/attachments/css/footer.less
index 8330bc6..a730ce1 100644
--- a/attachments/css/footer.less
+++ b/attachments/css/footer.less
@@ -1,5 +1,5 @@
/* ----- footer ---- */
#footer {
- height:40px;
+
}
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/header.less
----------------------------------------------------------------------
diff --git a/attachments/css/header.less b/attachments/css/header.less
index 9200392..4c55ca2 100644
--- a/attachments/css/header.less
+++ b/attachments/css/header.less
@@ -11,6 +11,10 @@
text-align: left;
z-index: 3;
+ .header-content {
+ width: 100%;
+ }
+
.wrap {
padding: 20px 0;
}
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/layout.less
----------------------------------------------------------------------
diff --git a/attachments/css/layout.less b/attachments/css/layout.less
index 0877c2c..3233964 100644
--- a/attachments/css/layout.less
+++ b/attachments/css/layout.less
@@ -11,11 +11,6 @@ body {
padding: 0px;
}
-.grid {
- background: url(../images/grid.png);
-}
-
-
/* ----- common elements -----*/
a {
@@ -100,6 +95,18 @@ a.dep-link {
}
}
+.search-container {
+ float: left;
+ margin-right: 30px;
+ padding-top: 20px;
+
+ input {
+ border: 1px solid #0036ff;
+ }
+}
+
+
+
#search-box {
width: auto;
margin-bottom: 20px;
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/pages/home.less
----------------------------------------------------------------------
diff --git a/attachments/css/pages/home.less b/attachments/css/pages/home.less
index 358adf8..4b59a97 100644
--- a/attachments/css/pages/home.less
+++ b/attachments/css/pages/home.less
@@ -1,12 +1,38 @@
/* Home styles */
-#main-container {
- height: 350px;
+#home-container {
+ min-height: 350px;
+}
+
+.discover-message-container {
padding-top: 80px;
}
+.cordova-grid-bg {
+ background: url(../images/grid.png);
+}
+
.discover-message {
background-color: white;
font-size: 36px;
margin: 1px;
+}
+
+.home-plugin-listing {
+ border-bottom: dotted 2px @border-faded-color;
+ text-align: center;
+
+ h3 {
+ font-weight: bolder;
+ font-size: 25px;
+ margin: 0;
+ }
+
+ div {
+ font-size: 14px;
+ }
+}
+
+.call-to-action-panes {
+ text-align: center;
}
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/styles.css
----------------------------------------------------------------------
diff --git a/attachments/css/styles.css b/attachments/css/styles.css
index 253de85..46d3f90 100644
--- a/attachments/css/styles.css
+++ b/attachments/css/styles.css
@@ -168,17 +168,17 @@ h2 {
.topcoat-button--large--cta,
.topcoat-button-bar__button,
.topcoat-button-bar__button--large {
- padding: 0 1.25rem;
- font-size: 16px;
- line-height: 3rem;
- letter-spacing: 1px;
+ padding: 0 0.563rem;
+ font-size: 12px;
+ line-height: 1.313rem;
+ letter-spacing: 0;
color: #454545;
text-shadow: 0 1px #fff;
vertical-align: top;
background-color: #e5e9e8;
box-shadow: inset 0 1px #fff;
border: 1px solid #9daca9;
- border-radius: 6px;
+ border-radius: 4px;
}
.topcoat-button:hover,
.topcoat-button--quiet:hover,
@@ -235,10 +235,10 @@ h2 {
.topcoat-button--large,
.topcoat-button--large--quiet,
.topcoat-button-bar__button--large {
- font-size: 1.3rem;
- font-weight: 400;
- line-height: 4.375rem;
- padding: 0 1.25rem;
+ font-size: 0.875rem;
+ font-weight: 600;
+ line-height: 1.688rem;
+ padding: 0 0.875rem;
}
.topcoat-button--large--quiet {
background: transparent;
@@ -264,10 +264,10 @@ h2 {
box-shadow: inset 0 1px rgba(0, 0, 0, 0.12);
}
.topcoat-button--large--cta {
- font-size: 1.3rem;
- font-weight: 400;
- line-height: 4.375rem;
- padding: 0 1.25rem;
+ font-size: 0.875rem;
+ font-weight: 600;
+ line-height: 1.688rem;
+ padding: 0 0.875rem;
}
.button-bar,
.topcoat-button-bar {
@@ -331,12 +331,12 @@ h2 {
- bar
*/
.topcoat-button-bar > .topcoat-button-bar__item:first-child {
- border-top-left-radius: 6px;
- border-bottom-left-radius: 6px;
+ border-top-left-radius: 4px;
+ border-bottom-left-radius: 4px;
}
.topcoat-button-bar > .topcoat-button-bar__item:last-child {
- border-top-right-radius: 6px;
- border-bottom-right-radius: 6px;
+ border-top-right-radius: 4px;
+ border-bottom-right-radius: 4px;
}
.topcoat-button-bar__item:first-child > .topcoat-button-bar__button,
.topcoat-button-bar__item:first-child > .topcoat-button-bar__button--large {
@@ -554,17 +554,17 @@ h2 {
.topcoat-button--large--quiet,
.topcoat-button--cta,
.topcoat-button--large--cta {
- padding: 0 1.25rem;
- font-size: 16px;
- line-height: 3rem;
- letter-spacing: 1px;
+ padding: 0 0.563rem;
+ font-size: 12px;
+ line-height: 1.313rem;
+ letter-spacing: 0;
color: #454545;
text-shadow: 0 1px #fff;
vertical-align: top;
background-color: #e5e9e8;
box-shadow: inset 0 1px #fff;
border: 1px solid #9daca9;
- border-radius: 6px;
+ border-radius: 4px;
}
.topcoat-button:hover,
.topcoat-button--quiet:hover,
@@ -649,10 +649,10 @@ h2 {
*/
.topcoat-button--large,
.topcoat-button--large--quiet {
- font-size: 1.3rem;
- font-weight: 400;
- line-height: 4.375rem;
- padding: 0 1.25rem;
+ font-size: 0.875rem;
+ font-weight: 600;
+ line-height: 1.688rem;
+ padding: 0 0.875rem;
}
/* topdoc
name: Large Quiet Button
@@ -734,10 +734,10 @@ h2 {
- call to action
*/
.topcoat-button--large--cta {
- font-size: 1.3rem;
- font-weight: 400;
- line-height: 4.375rem;
- padding: 0 1.25rem;
+ font-size: 0.875rem;
+ font-weight: 600;
+ line-height: 1.688rem;
+ padding: 0 0.875rem;
}
/**
*
@@ -937,46 +937,46 @@ input[type="checkbox"]:disabled + .topcoat-checkbox__checkmark {
- checkbox
*/
.topcoat-checkbox__checkmark {
- height: 2rem;
+ height: 1rem;
}
input[type="checkbox"] {
- height: 2rem;
- width: 2rem;
+ height: 1rem;
+ width: 1rem;
margin-top: 0;
- margin-right: -2rem;
- margin-bottom: -2rem;
+ margin-right: -1rem;
+ margin-bottom: -1rem;
margin-left: 0;
}
input[type="checkbox"]:checked + .topcoat-checkbox__checkmark:after {
opacity: 1;
}
.topcoat-checkbox {
- line-height: 2rem;
+ line-height: 1rem;
}
.topcoat-checkbox__checkmark:before {
- width: 2rem;
- height: 2rem;
+ width: 1rem;
+ height: 1rem;
background: #e5e9e8;
border: 1px solid #9daca9;
border-radius: 3px;
box-shadow: inset 0 1px #fff;
}
.topcoat-checkbox__checkmark {
- width: 2rem;
- height: 2rem;
+ width: 1rem;
+ height: 1rem;
}
.topcoat-checkbox__checkmark:after {
- top: 1px;
- left: 2px;
+ top: 2px;
+ left: 1px;
opacity: 0;
- width: 28px;
- height: 11px;
+ width: 14px;
+ height: 4px;
background: transparent;
border: 7px solid #454545;
- border-width: 7px;
+ border-width: 3px;
border-top: none;
border-right: none;
- border-radius: 2px;
+ border-radius: 1px;
-webkit-transform: rotate(-50deg);
-ms-transform: rotate(-50deg);
transform: rotate(-50deg);
@@ -1096,16 +1096,16 @@ input[type="checkbox"]:disabled:active + .topcoat-checkbox__checkmark:before {
.topcoat-icon-button--quiet,
.topcoat-icon-button--large,
.topcoat-icon-button--large--quiet {
- padding: 0 0.75rem;
- line-height: 3rem;
- letter-spacing: 1px;
+ padding: 0 0.25rem;
+ line-height: 1.313rem;
+ letter-spacing: 0;
color: #454545;
text-shadow: 0 1px #fff;
vertical-align: baseline;
background-color: #e5e9e8;
box-shadow: inset 0 1px #fff;
border: 1px solid #9daca9;
- border-radius: 6px;
+ border-radius: 4px;
}
.topcoat-icon-button:hover,
.topcoat-icon-button--quiet:hover,
@@ -1198,9 +1198,9 @@ input[type="checkbox"]:disabled:active + .topcoat-checkbox__checkmark:before {
*/
.topcoat-icon-button--large,
.topcoat-icon-button--large--quiet {
- width: 4.375rem;
- height: 4.375rem;
- line-height: 4.375rem;
+ width: 1.688rem;
+ height: 1.688rem;
+ line-height: 1.688rem;
}
/* topdoc
name: Large Quiet Icon Button
@@ -1236,14 +1236,14 @@ input[type="checkbox"]:disabled:active + .topcoat-checkbox__checkmark:before {
display: inline-block;
vertical-align: top;
overflow: hidden;
- width: 1.62rem;
- height: 1.62rem;
+ width: 0.81406rem;
+ height: 0.81406rem;
vertical-align: middle;
top: -1px;
}
.topcoat-icon--large {
- width: 2.499999998125rem;
- height: 2.499999998125rem;
+ width: 1.06344rem;
+ height: 1.06344rem;
top: -2px;
}
/**
@@ -1393,120 +1393,6 @@ input[type="checkbox"]:disabled:active + .topcoat-checkbox__checkmark:before {
* limitations under the License.
*
*/
-.list,
-.topcoat-list {
- padding: 0;
- margin: 0;
- font: inherit;
- color: inherit;
- background: transparent;
- border: none;
- cursor: default;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- overflow: auto;
- -webkit-overflow-scrolling: touch;
-}
-.list__header,
-.topcoat-list__header {
- margin: 0;
-}
-.list__container,
-.topcoat-list__container {
- padding: 0;
- margin: 0;
- list-style-type: none;
-}
-.list__item,
-.topcoat-list__item {
- margin: 0;
- padding: 0;
-}
-/* topdoc
- name: List
- description: Topcoat default list skin
- markup:
- <div class="topcoat-list">
- <h3 class="topcoat-list__header">Category</h3>
- <ul class="topcoat-list__container">
- <li class="topcoat-list__item">
- Item
- </li>
- <li class="topcoat-list__item">
- Item
- </li>
- <li class="topcoat-list__item">
- Item
- </li>
- </ul>
- </div>
- tags:
- - mobile
- - list
-*/
-.topcoat-list {
- border-top: 1px solid #9daca9;
- border-bottom: 1px solid #fff;
- background-color: #e5e9e8;
-}
-.topcoat-list__header {
- padding: 4px 20px;
- font-size: 0.9em;
- font-weight: 400;
- background-color: #d2d6d6;
- color: #454545;
- text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
- border-top: 1px solid rgba(255, 255, 255, 0.5);
- border-bottom: 1px solid rgba(255, 255, 255, 0.23);
-}
-.topcoat-list__container {
- border-top: 1px solid #9daca9;
- color: #454545;
-}
-.topcoat-list__item {
- padding: 1.25rem;
- border-top: 1px solid #fff;
- border-bottom: 1px solid #9daca9;
-}
-.topcoat-list__item:first-child {
- border-top: 1px solid #d6dcdb;
-}
-/**
-*
-* Copyright 2012 Adobe Systems Inc.;
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-* http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*
-*/
-/**
-*
-* Copyright 2012 Adobe Systems Inc.;
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-* http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*
-*/
.navigation-bar {
-moz-box-sizing: border-box;
box-sizing: border-box;
@@ -1551,121 +1437,6 @@ input[type="checkbox"]:disabled:active + .topcoat-checkbox__checkmark:before {
white-space: nowrap;
overflow: hidden;
}
-/**
-*
-* Copyright 2012 Adobe Systems Inc.;
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-* http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*
-*/
-/**
-*
-* Copyright 2012 Adobe Systems Inc.;
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-* http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*
-*/
-.navigation-bar,
-.topcoat-navigation-bar {
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- background-clip: padding-box;
- white-space: nowrap;
- overflow: hidden;
- word-spacing: 0;
- padding: 0;
- margin: 0;
- font: inherit;
- color: inherit;
- background: transparent;
- border: none;
- cursor: default;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
-}
-.navigation-bar__item,
-.topcoat-navigation-bar__item {
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- background-clip: padding-box;
- position: relative;
- display: inline-block;
- vertical-align: top;
- padding: 0;
- margin: 0;
- font: inherit;
- color: inherit;
- background: transparent;
- border: none;
-}
-.navigation-bar__title,
-.topcoat-navigation-bar__title {
- padding: 0;
- margin: 0;
- font: inherit;
- color: inherit;
- background: transparent;
- border: none;
- text-overflow: ellipsis;
- white-space: nowrap;
- overflow: hidden;
-}
-/* topdoc
- name: Navigation Bar
- description: A place where navigation goes to drink
- markup:
- <div class="topcoat-navigation-bar">
- <div class="topcoat-navigation-bar__item center full">
- <h1 class="topcoat-navigation-bar__title">Header</h1>
- </div>
- </div>
- tags:
- - desktop
- - light
- - mobile
- - navigation
- - bar
-*/
-.topcoat-navigation-bar {
- height: 4.375rem;
- padding-left: 1rem;
- padding-right: 1rem;
- background: #e5e9e8;
- color: #454545;
- box-shadow: inset 0 -1px #9daca9, 0 1px #d6dcdb;
-}
-.topcoat-navigation-bar__item {
- margin: 0;
- line-height: 4.375rem;
- vertical-align: top;
-}
-.topcoat-navigation-bar__title {
- font-size: 1.3rem;
- font-weight: 400;
- color: #454545;
-}
/*
Copyright 2012 Adobe Systems Inc.;
Licensed under the Apache License, Version 2.0 (the "License");
@@ -2022,11 +1793,11 @@ input[type="radio"]:disabled + .topcoat-radio-button__checkmark {
- Radio
*/
input[type="radio"] {
- height: 1.875rem;
- width: 1.875rem;
+ height: 1.063rem;
+ width: 1.063rem;
margin-top: 0;
- margin-right: -1.875rem;
- margin-bottom: -1.875rem;
+ margin-right: -1.063rem;
+ margin-bottom: -1.063rem;
margin-left: 0;
}
input[type="radio"]:checked + .topcoat-radio-button__checkmark:after {
@@ -2034,32 +1805,32 @@ input[type="radio"]:checked + .topcoat-radio-button__checkmark:after {
}
.topcoat-radio-button {
color: #454545;
- line-height: 1.875rem;
+ line-height: 1.063rem;
}
.topcoat-radio-button__checkmark:before {
- width: 1.875rem;
- height: 1.875rem;
+ width: 1.063rem;
+ height: 1.063rem;
background: #e5e9e8;
border: 1px solid #9daca9;
box-shadow: inset 0 1px #fff;
}
.topcoat-radio-button__checkmark {
position: relative;
- width: 1.875rem;
- height: 1.875rem;
+ width: 1.063rem;
+ height: 1.063rem;
}
.topcoat-radio-button__checkmark:after {
opacity: 0;
- width: 0.875rem;
- height: 0.875rem;
+ width: 0.313rem;
+ height: 0.313rem;
background: #454545;
border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: 0 1px rgba(255, 255, 255, 0.5);
-webkit-transform: none;
-ms-transform: none;
transform: none;
- top: 7px;
- left: 7px;
+ top: 0.313rem;
+ left: 0.313rem;
}
input[type="radio"]:focus + .topcoat-radio-button__checkmark:before {
border: 1px solid #0036ff;
@@ -2206,33 +1977,33 @@ limitations under the License.
- range
*/
.topcoat-range {
- border-radius: 6px;
+ border-radius: 4px;
border: 1px solid #9daca9;
background-color: #d6dcdb;
- height: 1rem;
- border-radius: 30px;
+ height: 0.5rem;
+ border-radius: 15px;
}
.topcoat-range::-moz-range-track {
- border-radius: 6px;
+ border-radius: 4px;
border: 1px solid #9daca9;
background-color: #d6dcdb;
- height: 1rem;
- border-radius: 30px;
+ height: 0.5rem;
+ border-radius: 15px;
}
.topcoat-range::-webkit-slider-thumb {
- height: 3rem;
- width: 2rem;
+ height: 1.313rem;
+ width: 0.75rem;
background-color: #e5e9e8;
border: 1px solid #9daca9;
- border-radius: 6px;
+ border-radius: 4px;
box-shadow: inset 0 1px #fff;
}
.topcoat-range::-moz-range-thumb {
- height: 3rem;
- width: 2rem;
+ height: 1.313rem;
+ width: 0.75rem;
background-color: #e5e9e8;
border: 1px solid #9daca9;
- border-radius: 6px;
+ border-radius: 4px;
box-shadow: inset 0 1px #fff;
}
.topcoat-range:focus::-webkit-slider-thumb {
@@ -2386,19 +2157,19 @@ input[type="search"]::-webkit-search-cancel-button {
*/
.topcoat-search-input,
.topcoat-search-input--large {
- line-height: 3rem;
- height: 3rem;
- font-size: 16px;
+ line-height: 1.313rem;
+ height: 1.313rem;
+ font-size: 12px;
border: 1px solid #9daca9;
background-color: #fff;
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.23);
color: #454545;
- padding: 0 0 0 2rem;
- border-radius: 30px;
- background-image: url("../img/search.svg");
+ padding: 0 0 0 1.3rem;
+ border-radius: 15px;
+ background-image: url("../images/search.svg");
background-position: 1rem center;
background-repeat: no-repeat;
- background-size: 16px;
+ background-size: 12px;
}
.topcoat-search-input:focus,
.topcoat-search-input--large:focus {
@@ -2445,14 +2216,14 @@ input[type="search"]::-webkit-search-cancel-button {
- large
*/
.topcoat-search-input--large {
- line-height: 4.375rem;
- height: 4.375rem;
- font-size: 1.3rem;
+ line-height: 1.688rem;
+ height: 1.688rem;
+ font-size: 0.875rem;
font-weight: 400;
- padding: 0 0 0 2.9rem;
- border-radius: 40px;
+ padding: 0 0 0 1.8rem;
+ border-radius: 25px;
background-position: 1.2rem center;
- background-size: 1.3rem;
+ background-size: 0.875rem;
}
.topcoat-search-input--large:disabled {
color: #454545;
@@ -2674,35 +2445,35 @@ input[type="search"]::-webkit-search-cancel-button {
- switch
*/
.topcoat-switch {
- font-size: 16px;
- padding: 0 1.25rem;
- border-radius: 6px;
+ font-size: 12px;
+ padding: 0 0.563rem;
+ border-radius: 4px;
border: 1px solid #9daca9;
overflow: hidden;
- width: 6rem;
+ width: 3.5rem;
}
.topcoat-switch__toggle:before,
.topcoat-switch__toggle:after {
top: -1px;
- width: 5rem;
+ width: 2.6rem;
}
.topcoat-switch__toggle:before {
content: 'ON';
color: #288edf;
background-color: #e5f1fb;
- right: 1rem;
- padding-left: 1.5rem;
+ right: 0.8rem;
+ padding-left: 0.75rem;
}
.topcoat-switch__toggle {
- line-height: 3rem;
- height: 3rem;
- width: 2rem;
- border-radius: 6px;
+ line-height: 1.313rem;
+ height: 1.313rem;
+ width: 1rem;
+ border-radius: 4px;
color: #454545;
text-shadow: 0 1px #fff;
background-color: #e5e9e8;
border: 1px solid #9daca9;
- margin-left: -1.3rem;
+ margin-left: -0.6rem;
margin-bottom: -1px;
margin-top: -1px;
box-shadow: inset 0 1px #fff;
@@ -2712,11 +2483,11 @@ input[type="search"]::-webkit-search-cancel-button {
.topcoat-switch__toggle:after {
content: 'OFF';
background-color: #d2d6d6;
- left: 1rem;
- padding-left: 2rem;
+ left: 0.8rem;
+ padding-left: 0.6rem;
}
.topcoat-switch__input:checked + .topcoat-switch__toggle {
- margin-left: 2.7rem;
+ margin-left: 1.85rem;
}
.topcoat-switch__input:active + .topcoat-switch__toggle {
border: 1px solid #9daca9;
@@ -2864,10 +2635,10 @@ input[type="search"]::-webkit-search-cancel-button {
- bar
*/
.topcoat-tab-bar__button {
- padding: 0 1.25rem;
- height: 3rem;
- line-height: 3rem;
- letter-spacing: 1px;
+ padding: 0 0.563rem;
+ height: 1.313rem;
+ line-height: 1.313rem;
+ letter-spacing: 0;
color: #454545;
text-shadow: 0 1px #fff;
vertical-align: top;
@@ -2967,12 +2738,12 @@ input[type="search"]::-webkit-search-cancel-button {
*/
.topcoat-text-input,
.topcoat-text-input--large {
- line-height: 3rem;
- font-size: 16px;
- letter-spacing: 1px;
- padding: 0 1.25rem;
+ line-height: 1.313rem;
+ font-size: 12px;
+ letter-spacing: 0;
+ padding: 0 0.563rem;
border: 1px solid #9daca9;
- border-radius: 6px;
+ border-radius: 4px;
background-color: #fff;
box-shadow: inset 0 1px rgba(0, 0, 0, 0.1);
color: #454545;
@@ -3021,8 +2792,8 @@ input[type="search"]::-webkit-search-cancel-button {
- large
*/
.topcoat-text-input--large {
- line-height: 4.375rem;
- font-size: 1.3rem;
+ line-height: 1.688rem;
+ font-size: 0.875rem;
}
.topcoat-text-input--large:disabled {
color: #454545;
@@ -3169,16 +2940,16 @@ input[type="search"]::-webkit-search-cancel-button {
*/
.topcoat-textarea,
.topcoat-textarea--large {
- padding: 2rem;
- font-size: 2.5rem;
+ padding: 1rem;
+ font-size: 1rem;
font-weight: 400;
- border-radius: 6px;
- line-height: 3rem;
+ border-radius: 4px;
+ line-height: 1.313rem;
border: 1px solid #9daca9;
background-color: #fff;
box-shadow: inset 0 1px rgba(0, 0, 0, 0.1);
color: #454545;
- letter-spacing: 1px;
+ letter-spacing: 0;
}
.topcoat-textarea:focus,
.topcoat-textarea--large:focus {
@@ -3215,8 +2986,8 @@ input[type="search"]::-webkit-search-cancel-button {
- textarea
*/
.topcoat-textarea--large {
- font-size: 3rem;
- line-height: 4.375rem;
+ font-size: 1.3rem;
+ line-height: 1.688rem;
}
.topcoat-textarea--large:disabled {
color: #454545;
@@ -3500,9 +3271,6 @@ body {
margin: 0 auto;
padding: 0px;
}
-.grid {
- background: url(../images/grid.png);
-}
/* ----- common elements -----*/
a {
color: #4cc2e4;
@@ -3579,6 +3347,14 @@ a.dep-link {
#tabs a.selected:hover {
background-color: #fff;
}
+.search-container {
+ float: left;
+ margin-right: 30px;
+ padding-top: 20px;
+}
+.search-container input {
+ border: 1px solid #0036ff;
+}
#search-box {
width: auto;
margin-bottom: 20px;
@@ -3832,6 +3608,9 @@ div.left {
text-align: left;
z-index: 3;
}
+#header .header-content {
+ width: 100%;
+}
#header .wrap {
padding: 20px 0;
}
@@ -3891,9 +3670,6 @@ div.left {
font-weight: 600;
}
/* ----- footer ---- */
-#footer {
- height: 40px;
-}
/* ==========================================================================
MEDIA QUERIES
========================================================================== */
@@ -3930,14 +3706,34 @@ div.left {
}*/
}
/* Home styles */
-#main-container {
- height: 350px;
+#home-container {
+ min-height: 350px;
+}
+.discover-message-container {
padding-top: 80px;
}
+.cordova-grid-bg {
+ background: url(../images/grid.png);
+}
.discover-message {
background-color: white;
font-size: 36px;
margin: 1px;
}
+.home-plugin-listing {
+ border-bottom: dotted 2px #bfb7b9;
+ text-align: center;
+}
+.home-plugin-listing h3 {
+ font-weight: bolder;
+ font-size: 25px;
+ margin: 0;
+}
+.home-plugin-listing div {
+ font-size: 14px;
+}
+.call-to-action-panes {
+ text-align: center;
+}
/* Package Details styles */
/* View all page styles */
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/styles.less
----------------------------------------------------------------------
diff --git a/attachments/css/styles.less b/attachments/css/styles.less
index 17592bd..c1e26c5 100644
--- a/attachments/css/styles.less
+++ b/attachments/css/styles.less
@@ -4,7 +4,7 @@
@import "../font/style.css";
@import "typography.less";
-@import (less) "topcoat-mobile-light.css";
+@import (less) "topcoat-desktop-light.css";
@import (less) "grid.css";
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/topcoat-desktop-light.css
----------------------------------------------------------------------
diff --git a/attachments/css/topcoat-desktop-light.css b/attachments/css/topcoat-desktop-light.css
index 1136ddd..073cf5c 100755
--- a/attachments/css/topcoat-desktop-light.css
+++ b/attachments/css/topcoat-desktop-light.css
@@ -2349,7 +2349,7 @@ input[type="search"]::-webkit-search-cancel-button {
color: #454545;
padding: 0 0 0 1.3rem;
border-radius: 15px;
- background-image: url("../img/search.svg");
+ background-image: url("../images/search.svg");
background-position: 1rem center;
background-repeat: no-repeat;
background-size: 12px;
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/topcoat-mobile-light.css
----------------------------------------------------------------------
diff --git a/attachments/css/topcoat-mobile-light.css b/attachments/css/topcoat-mobile-light.css
index e7f73f6..296f100 100755
--- a/attachments/css/topcoat-mobile-light.css
+++ b/attachments/css/topcoat-mobile-light.css
@@ -2599,7 +2599,7 @@ input[type="search"]::-webkit-search-cancel-button {
color: #454545;
padding: 0 0 0 2rem;
border-radius: 30px;
- background-image: url("../img/search.svg");
+ background-image: url("../images/search.svg");
background-position: 1rem center;
background-repeat: no-repeat;
background-size: 16px;
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/css/variables.less
----------------------------------------------------------------------
diff --git a/attachments/css/variables.less b/attachments/css/variables.less
index 1db3890..09fc84c 100644
--- a/attachments/css/variables.less
+++ b/attachments/css/variables.less
@@ -4,3 +4,5 @@
@highlight-color: #4cc2e4;
@font-color: #656F78;
+
+@border-faded-color: #BFB7B9;
\ No newline at end of file
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/index.html
----------------------------------------------------------------------
diff --git a/attachments/index.html b/attachments/index.html
index 2ba586b..2f05f6e 100644
--- a/attachments/index.html
+++ b/attachments/index.html
@@ -21,24 +21,22 @@
<body ng-app='registry'>
<div id="header" class="topcoat-grid">
- <div class="topcoat-grid__row">
+ <div class="header-content topcoat-grid__row">
<div class="topcoat-grid__column--6">
<a href="/" title="Home" class="icon-cordova logo">
<img class="registry-logo left" />
<div class="top-project-text">Apache Cordova</div>
<div class="top-plugins-registry-text">Plugins Registry</div>
</a>
- <div id="howto" style="display:none;">
- <a href="http://npmjs.org/doc/README.html"><span>How to</span>Install npm</a>
- <a href="http://npmjs.org/doc/publish.html"><span>How to</span>Publish a package</a>
- </div>
</div>
<div class="topcoat-grid__column--6">
<div class="topcoat-grid header-links">
<div class="topcoat-grid__column--12">
- <a href="plugins.html">Find Plugins</a>
- <a href="signup.html">Create Account</a>
- <a href="signin.html">Sign In</a>
+ <div class="search-container">
+ <input id="search-text" type="search" value="" placeholder="Find a plugin..." class="topcoat-search-input" />
+ </div>
+ <a href="/#/createAccount">Create Account</a>
+ <a href="/#/signIn">Sign In</a>
</div>
</div>
</div>
@@ -50,18 +48,29 @@
<div id="footer" class="topcoat-grid">
<div class="topcoat-grid__row">
- <div class="topcoat-grid__column--3">
- <a href="registry-tracker">Plugin Registry Issue Tracker</a>
+ <div class="topcoat-grid__column--2">
+ <a href="https://issues.apache.org/jira/browse/CB/component/12321101">Plugin Registry Issue Tracker</a>
</div>
- <div class="topcoat-grid__column--3">
- <a href="registry-tracker">Cordova Plugin Documentation</a>
+ <div class="topcoat-grid__column--2">
+ <a href="http://cordova.apache.org/docs/en/edge/plugin_ref_plugman.md.html#Using%20Plugman%20to%20Manage%20Plugins_registry_actions">Cordova Plugin Documentation</a>
</div>
<div class="topcoat-grid__column--3">
- <a href="registry-tracker">Apache Cordova Home</a>
+ <a href="http://cordova.apache.org/">Apache Cordova Home</a>
</div>
<div class="topcoat-grid__column--3">
</div>
</div>
+ <div class="topcoat-grid__row">
+ <div class="topcoat-grid__column--6">
+ <p>Copyright © 2012, 2013, 2014 The Apache Software Foundation, Licensed under the Apache License, Version 2.0</p>
+ <p>Apache and the Apache feather logos are trademarks of The Apache Software Foundation.</p>
+ </div>
+ <div class="topcoat-grid__column--4">
+ <div class="right">
+ <img title="Cordova Hi robot" />
+ </div>
+ </div>
+ </div>
</div>
<script type="text/javascript" src="js/lib/angular.min.js"></script>
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/js/controllers/home.js
----------------------------------------------------------------------
diff --git a/attachments/js/controllers/home.js b/attachments/js/controllers/home.js
index 0b935f0..6b61ba0 100644
--- a/attachments/js/controllers/home.js
+++ b/attachments/js/controllers/home.js
@@ -1,10 +1,16 @@
angular.module('registry.controllers').controller('HomeController', ['$rootScope', '$scope', '$location', '$http', function($rootScope, $scope, $location, $http) {
$scope.totalPlugins = 0;
+
+ $scope.mostDownloaded = [];
+ $scope.lastUpdated = [];
$scope.getTotalPlugins = function(){
//console.log($scope.packageID);
- $http({method: 'GET', url:('/api/_all_docs?limit=0')}).
+ // var apiCallUrl = '/api/_all_docs?limit=0';
+ var apiCallUrl = '/plugins.json';
+
+ $http({method: 'GET', url:(apiCallUrl)}).
success(function(data, status, headers, config) {
$scope.totalPlugins = data.total_rows - 3;
}).
@@ -15,7 +21,40 @@ angular.module('registry.controllers').controller('HomeController', ['$rootScope
console.log(status)
});
- }
+ };
+
+ $scope.getMostDownloaded = function() {
+ $scope.mostDownloaded = [
+ { download_count: 21865, bundle_id: 'org.apache.cordova.device' },
+ { download_count: 15250, bundle_id: 'org.apache.cordova.inappbrowser' },
+ { download_count: 14761, bundle_id: 'org.apache.cordova.file' },
+ { download_count: 12974, bundle_id: 'org.apache.cordova.console' },
+ { download_count: 11459, bundle_id: 'org.apache.cordova.camera' },
+ { download_count: 10755, bundle_id: 'org.apache.cordova.splashscreen' },
+ { download_count: 10441, bundle_id: 'org.apache.cordova.network-information' },
+ { download_count: 10307, bundle_id: 'org.apache.cordova.dialogs' },
+ { download_count: 9016, bundle_id: 'org.apache.cordova.geolocation' },
+ { download_count: 6139, bundle_id: 'org.apache.cordova.file-transfer' }
+ ];
+ };
+
+ $scope.getLastUpdated = function() {
+ $scope.lastUpdated = [
+ { updated: 21865, bundle_id: 'org.apache.cordova.device' },
+ { updated: 15250, bundle_id: 'org.apache.cordova.inappbrowser' },
+ { updated: 14761, bundle_id: 'org.apache.cordova.file' },
+ { updated: 12974, bundle_id: 'org.apache.cordova.console' },
+ { updated: 11459, bundle_id: 'org.apache.cordova.camera' },
+ { updated: 10755, bundle_id: 'org.apache.cordova.splashscreen' },
+ { updated: 10441, bundle_id: 'org.apache.cordova.network-information' },
+ { updated: 10307, bundle_id: 'org.apache.cordova.dialogs' },
+ { updated: 9016, bundle_id: 'org.apache.cordova.geolocation' },
+ { updated: 6139, bundle_id: 'org.apache.cordova.file-transfer' }
+ ];
+ };
+
$scope.getTotalPlugins();
+ $scope.getMostDownloaded();
+ $scope.getLastUpdated();
}]);
http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/7f92c398/attachments/partials/views/home.html
----------------------------------------------------------------------
diff --git a/attachments/partials/views/home.html b/attachments/partials/views/home.html
index 8062ff5..a1eec43 100644
--- a/attachments/partials/views/home.html
+++ b/attachments/partials/views/home.html
@@ -1,7 +1,6 @@
-<div id="main-container" class="grid">
-
- <div class="topcoat-grid">
- <div class="topcoat-grid__row">
+<div id="home-container">
+ <div class="topcoat-grid cordova-grid-bg">
+ <div class="topcoat-grid__row discover-message-container">
<div class="topcoat-grid__column--3 topcoat-grid__offset--1">
<h1 class="discover-message">Discover plugins for your </h1>
<h1 class="discover-message">Apache Cordova project.</h1>
@@ -17,37 +16,73 @@
</div>
</div>
- <div class="topcoat-grid__row">
+ </div>
+
+ <div class="topcoat-grid">
+
+ <div class="topcoat-grid__row" class="call-to-action-panes">
<div class="topcoat-grid__column--6">
- Contribute
+ <div class="topcoat-grid">
+ <div class="topcoat-grid__row">
+ <div class="topcoat-grid__column--12 topcoat-grid__offset--2">
+ <img title="Contrib flyer" />
+ </div>
+ </div>
+ <div class="topcoat-grid__row">
+ <div class="topcoat-grid__column--12 topcoat-grid__offset--3">
+ <h2>Contribute</h2>
+ </div>
+ </div>
+ <div class="topcoat-grid__row">
+ <div class="topcoat-grid__column--12 topcoat-grid__offset--2">
+ <h4>Want to <span> author & publish</span> plugins?</h4>
+ <a href="pleaseread.html">Please read our docs</a>.
+ </div>
+ </div>
+ </div>
</div>
<div class="topcoat-grid__column--6">
- Utilize
+ <div class="topcoat-grid">
+ <div class="topcoat-grid__row">
+ <div class="topcoat-grid__column--12 topcoat-grid__offset--2">
+ <img title="Utilize wrench" />
+ </div>
+ </div>
+ <div class="topcoat-grid__row">
+ <div class="topcoat-grid__column--12 topcoat-grid__offset--3">
+ <h2>Utilize</h2>
+ </div>
+ </div>
+ <div class="topcoat-grid__row">
+ <div class="topcoat-grid__column--12 topcoat-grid__offset--2">
+ <h4>Need to <span>install or remove</span> a plugin?</h4>
+ <a href="pleaseread.html">Check the documentation</a>.
+ </div>
+ </div>
+ </div>
</div>
</div>
- <div class="topcoat-grid__row">
+ <div class="topcoat-grid__row home-plugin-listing">
<div class="topcoat-grid__column--6">
- Most Downloaded
+ <h3>Most Downloaded</h3>
</div>
<div class="topcoat-grid__column--6">
- Last Updated
+ <h3>Last Updated</h3>
</div>
</div>
- <div class="topcoat-grid__row">
+ <div class="topcoat-grid__row home-plugin-listing">
<div class="topcoat-grid__column--6">
-
+ <div ng-repeat="plugin in mostDownloaded">
+ {{plugin.download_count}} {{plugin.bundle_id}}
+ </div>
</div>
<div class="topcoat-grid__column--6">
-
+ <div ng-repeat="plugin in lastUpdated">
+ {{plugin.updated}} {{plugin.bundle_id}}
+ </div>
</div>
</div>
</div>
-
- <!-- <div id="top-packages">
- <div id="latest-packages"><div class="top-title">Latest Updates</div></div>
- <div id="top-dep-packages"><div class="top-title">Most Depended On</div></div>
- <div class="clear"></div>
- </div> -->
</div>