updated to version 0.4.8

flyingcircle · Sep 16, 2016 · 5e08390 · 5e08390
1 parent fe2106a
commit 5e08390
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 21 deletions.
diff --git a/Readme.MD b/Readme.MD
@@ -1,11 +1,11 @@
 ![React Native Elements](http://i.imgur.com/HU4S78V.png)
 ## Cross Platform React Native UI Toolkit
 
-![React Native UI Toolkit](http://i.imgur.com/g5fM8vL.png)
+![React Native UI Toolkit](http://i.imgur.com/2zRw81l.png)
 
 ## Get Started
 
-*If you are using Exponent, you can run* `npm i react-native-elements github:exponentjs/react-native-vector-icons --save` *and skip to step 5.*
+*If you are using Exponent, you can run* `npm i react-native-elements github:exponentjs/react-native-vector-icons --save` *and skip to step 4.*
 
 #### Step 1
 
@@ -59,11 +59,15 @@ import {
 
 ## Roadmap
 - [ ] Add radio buttons
+- [ ] Add grid component
+- [ ] Searchable Drop Down similar to [Bootstrap-3-Typehead](https://github.com/bassjobsen/Bootstrap-3-Typeahead)
+- [ ] [Swipeable List Item component](https://github.com/jemise111/react-native-swipe-list-view)
 - [ ] Add icons to TextInputs
-- [ ] Profile Component
+- [ ] Profile Component `in progress`
+- [ ] Add grid component `in progress`
 - [ ] Custom Picker
 - [ ] Side Menu Improvements
-- [ ] Cross Platform Tab Bar
+- [ ] Cross Platform Tab Bar `in progress`
 - [ ] Something you's like to see? Submit an [issue](https://github.com/dabit3/React-Native-Elements/issues) or a [pull request](https://github.com/dabit3/React-Native-Elements/pulls)
 
 ## Examples
@@ -99,7 +103,7 @@ Buttons take a title and an optional [material icon name](https://design.google.
 
 > You can override Material icons with one of the following: zocial, font-awesome, octicon, ionicon, foundation, evilicon, or entypo by providing an icon.type as a prop. 
 
-![Buttons](http://i.imgur.com/jeXZSMC.png)
+![Buttons](http://i.imgur.com/ybyk4Bl.png)
 
 ```js
 import { Button } from 'react-native-elements'
@@ -188,17 +192,17 @@ import { SocialIcon } from 'react-native-elements'
 | fontStyle | none | object (style) | specify text styling (optional) |
 
 
-## Icons
+## Icons & Icon Buttons
 
-![Icons](http://i.imgur.com/Czf5BIf.png)
+![Icons](http://i.imgur.com/2A28abz.png)
 
 Icons take the name of a [material icon](https://design.google.com/icons/) as a prop.
 
 > You can override Material icons with one of the following: zocial, font-awesome, octicon, ionicon, foundation, evilicon, or entypo by providing a type prop. 
 
 ```js
 
-import { Icon } from 'react-native-icons'
+import { Icon } from 'react-native-elements'
 
 <Icon
   name='rowing' />

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-native-elements",
-  "version": "0.4.7",
+  "version": "0.4.8",
   "description": "React Native Elements & UI Toolkit",
   "main": "src/index.js",
   "repository": {

diff --git a/src/config/colors.js b/src/config/colors.js
@@ -1,5 +1,5 @@
 export default {
-  primary: '#397af8',
+  primary: '#9E9E9E',
   primary1: '#4d86f7',
   primary2: '#6296f9',
   secondary: '#8F0CE8',

diff --git a/src/icons/Icon.js b/src/icons/Icon.js
@@ -37,12 +37,15 @@ const Icon = ({
         reverse ? color : underlayColor || color
       }
       style={[
-        styles.button,
-        raised && styles.raised, {
+        (reverse || raised) && styles.button,
+        (reverse || raised) && {
           borderRadius: size + 4,
-          backgroundColor: reverse ? color : raised ? 'white' : 'transparent',
           height: size * 2 + 4,
-          width: size * 2 + 4,
+          width: size * 2 + 4
+        },
+        raised && styles.raised,
+        {
+          backgroundColor: reverse ? color : raised ? 'white' : 'transparent',
           alignItems: 'center',
           justifyContent: 'center'},
         containerStyle && containerStyle

diff --git a/src/social/SocialIcon.js b/src/social/SocialIcon.js
@@ -50,17 +50,15 @@ const SocialIcon = ({
       underlayColor={light ? 'white' : colors[type]}
       onPress={onPress}
       style={[
-        {justifyContent: 'center',
-        alignItems: 'center'},
         raised && styles.raised,
         styles.container,
-        button ? styles.button : styles.icon,
-        !button && iconSize && {width: iconSize * 2 + 4},
-        !button && iconSize && {height: iconSize * 2 + 4},
-        !button && iconSize && {borderRadius: iconSize * 2},
+        button && styles.button,
+        !button && raised && styles.icon,
+        !button && !light && !raised  && {width: iconSize * 2 + 4},
+        !button && !light && !raised  && {height: iconSize * 2 + 4},
+        !button && !light && !raised  && {borderRadius: iconSize * 2},
         {backgroundColor: colors[type]},
         light && {backgroundColor: 'white'},
-        light && !raised && {marginLeft: 2, marginRight: 2},
         style && style
       ]}>
       <View style={styles.wrapper}>
@@ -116,6 +114,10 @@ styles = StyleSheet.create({
     justifyContent: 'center',
     alignItems: 'center'
   },
+  button: {
+    paddingTop: 14,
+    paddingBottom: 14
+  },
   raised: {
     ...Platform.select({
       ios: {
@@ -130,6 +132,9 @@ styles = StyleSheet.create({
     })
   },
   wrapper: {
+    flexDirection: 'row',
+    justifyContent: 'center',
+    alignItems: 'center'
   },
   title: {
     color: 'white',