cordova-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From mura...@apache.org
Subject [1/2] cordova-registry-web git commit: fix card css issues
Date Tue, 07 Jul 2015 21:06:00 GMT
Repository: cordova-registry-web
Updated Branches:
  refs/heads/master f2d8ccb5c -> 2d141c227


fix card css issues


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/dbcb1eb2
Tree: http://git-wip-us.apache.org/repos/asf/cordova-registry-web/tree/dbcb1eb2
Diff: http://git-wip-us.apache.org/repos/asf/cordova-registry-web/diff/dbcb1eb2

Branch: refs/heads/master
Commit: dbcb1eb277cc0fc19743deb372f86fee50cabcae
Parents: f2d8ccb
Author: Murat Sutunc <sutunc@gmail.com>
Authored: Tue Jul 7 11:52:53 2015 -0700
Committer: Murat Sutunc <sutunc@gmail.com>
Committed: Tue Jul 7 11:57:40 2015 -0700

----------------------------------------------------------------------
 npm-search/assets/css/base.css | 24 ++++++++++-
 npm-search/assets/js/app.js    | 82 ++++++++++++++++++-------------------
 2 files changed, 64 insertions(+), 42 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/dbcb1eb2/npm-search/assets/css/base.css
----------------------------------------------------------------------
diff --git a/npm-search/assets/css/base.css b/npm-search/assets/css/base.css
index 4d2ca1f..571bbc6 100644
--- a/npm-search/assets/css/base.css
+++ b/npm-search/assets/css/base.css
@@ -95,6 +95,7 @@ h2 {
   border: 1px solid #CDCDCD;
   background: white;
   min-height: 10em;
+  height: 10em;
 }
 
 .pluginCard:after {
@@ -151,7 +152,9 @@ h2 {
 
 .primaryContent {
   display: flex;
+  display: -webkit-flex;
   flex-direction: column;
+  -webkit-flex-direction: column;
 }
 
 .primaryContent .header small {
@@ -163,6 +166,7 @@ h2 {
 }
 
 .primaryContent .pluginDesc {
+  -webkit-flex-grow: 1;
   flex-grow: 1;
   font-size: 1em;
   color: #404040;
@@ -184,14 +188,17 @@ h2 {
 
 .secondaryContent {
   display: flex;
+  display: -webkit-flex;
   flex-direction: column;
+  -webkit-flex-direction: column;
   text-align: right;
   font-size: 0.9em;
   color: #7A828B;
 }
 
 .download {
-flex-grow: 1;
+  -webkit-flex-grow: 1;
+  flex-grow: 1;
 }
 
 .extraInfo p {
@@ -344,6 +351,9 @@ pre code {
     margin-left: 24px;
     margin-right: 24px;
   }
+  .pluginCard {
+    height: auto;
+  }
 }
 @media all and (max-width: 890px) {
   h2 {
@@ -356,6 +366,9 @@ pre code {
   .menu-dropdown {
     display: block;
   }
+  .pluginCard {
+    height: auto;
+  }
 }
 @media all and (max-width: 720px) {
   h2 {
@@ -375,6 +388,9 @@ pre code {
     height: 37px;
     background-size: 112px 425px;
   }
+  .pluginCard {
+    height: auto;
+  }
 }
 @media all and (max-width: 585px) {
   h2 {
@@ -395,6 +411,9 @@ pre code {
   .icon-about {
     background-position: 0 -110px;
   }
+  .pluginCard {
+    height: auto;
+  }
 }
 @media all and (max-width: 440px) {
   .icon {
@@ -403,4 +422,7 @@ pre code {
     h2 {
     font-size: 20px;
   }
+  .pluginCard {
+    height: auto;
+  }
 }

http://git-wip-us.apache.org/repos/asf/cordova-registry-web/blob/dbcb1eb2/npm-search/assets/js/app.js
----------------------------------------------------------------------
diff --git a/npm-search/assets/js/app.js b/npm-search/assets/js/app.js
index bd8e544..aad42ce 100644
--- a/npm-search/assets/js/app.js
+++ b/npm-search/assets/js/app.js
@@ -1,6 +1,6 @@
 var React    = window.React = require('react'), // assign it to window for react chrome extension
-    classNames = require('classnames'), 
-    App = {};   
+    classNames = require('classnames'),
+    App = {};
 
 var OfficialPlugin = React.createClass({
     render: function() {
@@ -95,7 +95,7 @@ var SupportedPlatforms = React.createClass({
             <ul className="supportedPlatforms">
                 {majorPlatformsSupported}
                 {moreButton}
-                {otherPlatformsSupported} 
+                {otherPlatformsSupported}
             </ul>
         );
     }
@@ -134,40 +134,40 @@ var Plugin = React.createClass({
         }
         var downloadField;
 
-        var classes = classNames({  
-            'pluginCard': true,  
-            'featuredPlugin': this.props.plugin.isOfficial,  
-            'row': true  
-        }); 
+        var classes = classNames({
+            'pluginCard': true,
+            'featuredPlugin': this.props.plugin.isOfficial,
+            'row': true
+        });
 
         if(this.props.plugin.downloadCount) {
             var downloadCount = this.props.plugin.downloadCount.toLocaleString();
             downloadField = <p><small> {downloadCount} downloads last month</small></p>;
         }
         return (
-            <li> 
-                <div className={classes}> 
-                    <div className="primaryContent col-xs-9"> 
-                        <div className="header"> 
-                            <h3><a href={'https://www.npmjs.com/package/' + this.props.plugin.name}
target="_blank">{this.props.plugin.name}</a></h3> 
-                            <small className="pluginVersion">v{this.props.plugin.version}</small>

-                            <small> by </small> 
-                            <small className="pluginAuthor">{this.props.plugin.author}</small>

-                        </div> 
-                        <div className="pluginDesc">{this.props.plugin.description}</div>

-                        <SupportedPlatforms keywords={this.props.plugin.keywords}/>

-                        </div> 
-                        <div className="secondaryContent col-xs-3"> 
-                        <div className="download"> 
-                            <p></p> 
-                        </div> 
-                        <div className="extraInfo"> 
-                            <p><small><strong>License:</strong> {license}</small></p>

-                            {downloadField} 
-                            <p><small><em>Last updated {this.props.plugin.modified}
days ago</em></small></p> 
-                        </div> 
-                    </div> 
-                </div> 
+            <li>
+                <div className={classes}>
+                    <div className="primaryContent col-xs-9">
+                        <div className="header">
+                            <h3><a href={'https://www.npmjs.com/package/' + this.props.plugin.name}
target="_blank">{this.props.plugin.name}</a></h3>
+                            <small className="pluginVersion">v{this.props.plugin.version}</small>
+                            <small> by </small>
+                            <small className="pluginAuthor">{this.props.plugin.author}</small>
+                        </div>
+                        <div className="pluginDesc">{this.props.plugin.description}</div>
+                        <SupportedPlatforms keywords={this.props.plugin.keywords}/>
+                        </div>
+                        <div className="secondaryContent col-xs-3">
+                        <div className="download">
+                            <p></p>
+                        </div>
+                        <div className="extraInfo">
+                            <p><small><strong>License:</strong> {license}</small></p>
+                            {downloadField}
+                            <p><small><em>Last updated {this.props.plugin.modified}
days ago</em></small></p>
+                        </div>
+                    </div>
+                </div>
             </li>
         )
     }
@@ -183,7 +183,7 @@ window.addEventListener('popstate', function(e) {
 });
 
 var PluginList = React.createClass({
-    
+
     contains: function(values, pluginInfo) {
         var allValuesPresent = true;
         if(values.length == 0) {
@@ -194,7 +194,7 @@ var PluginList = React.createClass({
         }
         values.forEach(function(value) {
             var valuePresent = false;
-            for(var index=0; index < pluginInfo.length; index++) {  
+            for(var index=0; index < pluginInfo.length; index++) {
                 if(pluginInfo[index] && pluginInfo[index].toLowerCase().indexOf(value)
> -1) {
                     valuePresent = true;
                 }
@@ -233,9 +233,9 @@ var PluginList = React.createClass({
                         break;
                     case 'license':
                         filters['licenses'].push(param);
-                        break;   
+                        break;
                     default:
-                        filters['searchWords'].push(searchString);         
+                        filters['searchWords'].push(searchString);
                 }
             }
             else {
@@ -257,15 +257,15 @@ var PluginList = React.createClass({
 
         delay(function(){
                     window.history.pushState({"filterText":filterText}, "", "?q=" + filterText);
-            }, 2000 );    
+            }, 2000 );
 
         var filters = this.populateFilters(filterText);
 
         this.props.plugins.forEach(function(plugin) {
             var fullPluginText = plugin.name.concat(plugin.author, plugin.keywords, plugin.license,
plugin.description);
-            if(this.contains(filters['platforms'], plugin.keywords) 
-                && this.contains(filters['authors'], plugin.author) 
-                && this.contains(filters['licenses'], plugin.license) 
+            if(this.contains(filters['platforms'], plugin.keywords)
+                && this.contains(filters['authors'], plugin.author)
+                && this.contains(filters['licenses'], plugin.license)
                 && this.contains(filters['searchWords'], fullPluginText)) {
                     plugins.push(<Plugin plugin={plugin} key={plugin.author + plugin.name}/>);
             }
@@ -302,7 +302,7 @@ var App = React.createClass({
                     plugins: previousState.plugins
                 };
             }
-            else {    
+            else {
                 return {
                     filterText: previousState.filterText.trim() + ' ' + condition + ' ',
                     plugins: previousState.plugins
@@ -448,7 +448,7 @@ var App = React.createClass({
     }
 });
 
-App.start = function() {    
+App.start = function() {
     React.render(<App />, document.getElementById('container'));
 };
 


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@cordova.apache.org
For additional commands, e-mail: commits-help@cordova.apache.org


Mime
View raw message