move card styles to global theme

xinthink · Feb 10, 2016 · c426722 · c426722
1 parent 9c5b252
commit c426722
Show file tree

Hide file tree

Showing 11 changed files with 46 additions and 177 deletions.
diff --git a/lib/index.js b/lib/index.js
@@ -24,12 +24,4 @@ export {
   Spinner as MKSpinner,
   RadioButton as MKRadioButton,
   Checkbox as MKCheckbox,
-
-  Card as MKCard,
-  Title as MKCardTitle,
-  CardImage as MKCardImage,
-  CardContent as MKCardContent,
-  CardMenu as MKCardMenu,
-  CardAction as MKCardAction,
-  CardStyles as MKCardStyles,
 } from './mdl';
diff --git a/lib/mdl/cards/action.js b/lib/mdl/cards/action.js
diff --git a/lib/mdl/cards/container.js b/lib/mdl/cards/container.js
diff --git a/lib/mdl/cards/content.js b/lib/mdl/cards/content.js
diff --git a/lib/mdl/cards/image.js b/lib/mdl/cards/image.js
diff --git a/lib/mdl/cards/menu.js b/lib/mdl/cards/menu.js
diff --git a/lib/mdl/cards/styles.js b/lib/mdl/cards/styles.js
diff --git a/lib/mdl/cards/title.js b/lib/mdl/cards/title.js
diff --git a/lib/mdl/index.js b/lib/mdl/index.js
@@ -9,12 +9,5 @@ exports.Spinner = require('./Spinner');
 exports.Slider = require('./Slider');
 exports.Button = require('./Button');
 exports.Ripple = require('./Ripple');
-exports.Card = require('./cards/container');
-exports.Title = require('./cards/title');
-exports.CardImage = require('./cards/image');
-exports.CardContent = require('./cards/content');
-exports.CardMenu = require('./cards/menu');
-exports.CardAction = require('./cards/action');
-exports.CardStyles = require('./cards/styles');
 exports.RadioButton = require('./RadioButton');
 exports.Checkbox = require('./Checkbox');
diff --git a/lib/theme.js b/lib/theme.js
@@ -64,6 +64,51 @@ theme = {
     rippleColor: new RGBAttrReference('primaryColorRGB', .2),
     inset: 0,
   },
+  cardStyle: {
+    flex: 1,
+    backgroundColor: '#ffffff',
+    borderRadius: 2,
+    borderColor: '#ffffff',
+    borderWidth: 1,
+    shadowColor: 'rgba(0,0,0,.12)',
+    shadowOpacity: 0.8,
+    shadowRadius: 2,
+    shadowOffset: {
+      height: 1,
+      width: 2,
+    },
+  },
+  cardImageStyle: {
+    flex: 1,
+    height: 170,
+    resizeMode: 'cover',
+  },
+  cardTitleStyle: {
+    position: 'absolute',
+    top: 120,
+    left: 26,
+    backgroundColor: 'transparent',
+    padding: 16,
+    fontSize: 24,
+    color: '#000000',
+    fontWeight: 'bold',
+  },
+  cardContentStyle: {
+    padding: 15,
+    color: 'rgba(0,0,0,.54)',
+  },
+  cardActionStyle: {
+    borderStyle: 'solid',
+    borderTopColor: 'rgba(0,0,0,.1)',
+    borderTopWidth: 1,
+    padding: 15,
+  },
+  cardMenuStyle: {
+    position: 'absolute',
+    top: 16,
+    right: 16,
+    backgroundColor: 'transparent',
+  },
 };
 
 function isPlainObject(o) {

diff --git a/lib/utils.js b/lib/utils.js
@@ -84,9 +84,6 @@ function extractTouchableProps(view) {
   return extractProps(view, TouchableWithoutFeedback.propTypes);
 }
 
-// Parse stringified color as int
-const parseColor = processColor;
-
 
 // ## Public interface
 exports.mergeIntoFast = mergeIntoFast;
@@ -97,4 +94,4 @@ exports.convertCoordinate = convertCoordinate;
 exports.getFontSize = getFontSize;
 exports.extractProps = extractProps;
 exports.extractTouchableProps = extractTouchableProps;
-exports.parseColor = parseColor;
+exports.parseColor = processColor;  // parse stringified color as int