fix: NativeBaseLogo

GeekyAnts · Jul 5, 2021 · ea68247 · ea68247
1 parent a2cebc7
commit ea68247
Show file tree

Hide file tree

Showing 8 changed files with 122 additions and 24 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/expo-nativebase-typescript/App.tsx b/expo-nativebase-typescript/App.tsx
@@ -14,6 +14,7 @@ import {
   VStack,
   Code,
 } from "native-base";
+import NativeBaseIcon from "./components/NativeBaseIcon";
 
 // Define the config
 const config = {
@@ -34,15 +35,10 @@ export default function App() {
         flex={1}
       >
         <VStack space={5} alignItems="center">
-          <Image
-            source={require("./assets/nativebase-logo.svg")}
-            resizeMode="contain"
-            size={220}
-            alt="NativeBase logo"
-          />
+          <NativeBaseIcon />
           <Heading size="lg">Welcome to NativeBase</Heading>
           <Text>
-            Edit <Code>src/App.js</Code> and save to reload
+            Edit <Code>App.tsx</Code> and save to reload.
           </Text>
           <Link href="https://docs.nativebase.io" isExternal>
             <Text color="primary.500" underline fontSize={"xl"}>

diff --git a/expo-nativebase-typescript/components/NativeBaseIcon.tsx b/expo-nativebase-typescript/components/NativeBaseIcon.tsx
@@ -0,0 +1,44 @@
+import React from "react";
+import { Icon } from "native-base";
+import { G, Path } from "react-native-svg";
+const NativeBaseIcon = () => {
+  return (
+    <Icon size="220px" viewBox="0 0 602.339 681.729">
+      <G
+        id="Group_403"
+        data-name="Group 403"
+        transform="translate(14575 1918.542)"
+      >
+        <Path
+          id="Path_1"
+          data-name="Path 1"
+          d="M488.722,0A45.161,45.161,0,0,1,527.83,22.576L675.676,278.584a45.162,45.162,0,0,1,0,45.171L527.83,579.763a45.162,45.162,0,0,1-39.108,22.576H193.008A45.162,45.162,0,0,1,153.9,579.763L6.053,323.755a45.162,45.162,0,0,1,0-45.171L153.9,22.576A45.162,45.162,0,0,1,193.008,0Z"
+          transform="translate(-13972.661 -1918.542) rotate(90)"
+          fill="#356290"
+        />
+        <Path
+          id="Path_252"
+          data-name="Path 252"
+          d="M401.1,0A60.816,60.816,0,0,1,453.77,30.405L567.2,226.844a60.816,60.816,0,0,1,0,60.82L453.77,484.1A60.816,60.816,0,0,1,401.1,514.509H174.241A60.816,60.816,0,0,1,121.575,484.1L8.149,287.665a60.816,60.816,0,0,1,0-60.82L121.575,30.405A60.816,60.816,0,0,1,174.241,0Z"
+          transform="translate(-14016.576 -1865.281) rotate(90)"
+          fill="#1784b2"
+        />
+        <Path
+          id="Path_251"
+          data-name="Path 251"
+          d="M345.81,0a36.573,36.573,0,0,1,31.674,18.288L480.566,196.856a36.573,36.573,0,0,1,0,36.569L377.484,411.993a36.573,36.573,0,0,1-31.674,18.288H139.655a36.572,36.572,0,0,1-31.674-18.288L4.9,233.425a36.573,36.573,0,0,1,0-36.569L107.981,18.288A36.573,36.573,0,0,1,139.655,0Z"
+          transform="translate(-14058.69 -1820.41) rotate(90)"
+          fill="#50bfc3"
+        />
+        <Path
+          id="_x3C__x2F__x3E_"
+          d="M187.066,335.455V297.993l-65.272-21.949,65.272-22.523V216.059L81,259.5v32.521Zm38.726,29.3L286.123,174H256.7l-60.33,190.759Zm72.052-29.3,106.066-43.783V259.267L297.844,216.059V254.44l59.3,23.328-59.3,19.421Z"
+          transform="translate(-14516.286 -1846.988)"
+          fill="#fff"
+        />
+      </G>
+    </Icon>
+  );
+};
+
+export default NativeBaseIcon;
diff --git a/expo-nativebase-typescript/package.json b/expo-nativebase-typescript/package.json
@@ -2,6 +2,20 @@
   "name": "expo-template-nativebase-typescript",
   "version": "1.0.0",
   "main": "node_modules/expo/AppEntry.js",
+  "keywords": [
+    "react",
+    "expo",
+    "template",
+    "typescript",
+    "nativebase"
+  ],
+  "description": "The base TypeScript template for expo with NativeBase.",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/GeekyAnts/nativebase-templates.git",
+    "directory": "expo-nativebase-typescript"
+  },
+  "license": "MIT",
   "scripts": {
     "start": "expo start",
     "android": "expo start --android",
@@ -27,6 +41,5 @@
     "@types/react": "~16.9.35",
     "@types/react-native": "~0.63.2",
     "typescript": "~4.0.0"
-  },
-  "private": true
+  }
 }
diff --git a/expo-nativebase/App.js b/expo-nativebase/App.js
@@ -14,6 +14,7 @@ import {
   VStack,
   Code,
 } from "native-base";
+import NativeBaseIcon from "./components/NativeBaseIcon";
 
 // Define the config
 const config = {
@@ -34,15 +35,10 @@ export default function App() {
         flex={1}
       >
         <VStack space={5} alignItems="center">
-          <Image
-            source={require("./assets/nativebase-logo.svg")}
-            resizeMode="contain"
-            size={220}
-            alt="NativeBase logo"
-          />
+          <NativeBaseIcon />
           <Heading size="lg">Welcome to NativeBase</Heading>
           <Text>
-            Edit <Code>src/App.js</Code> and save to reload.
+            Edit <Code>App.js</Code> and save to reload.
           </Text>
           <Link href="https://docs.nativebase.io" isExternal>
             <Text color="primary.500" underline fontSize={"xl"}>

diff --git a/expo-nativebase/assets/nativebase-logo.svg b/expo-nativebase/assets/nativebase-logo.svg
diff --git a/expo-nativebase/components/NativeBaseIcon.js b/expo-nativebase/components/NativeBaseIcon.js
@@ -0,0 +1,44 @@
+import React from "react";
+import { Icon } from "native-base";
+import { G, Path } from "react-native-svg";
+const NativeBaseIcon = () => {
+  return (
+    <Icon size="220px" viewBox="0 0 602.339 681.729">
+      <G
+        id="Group_403"
+        data-name="Group 403"
+        transform="translate(14575 1918.542)"
+      >
+        <Path
+          id="Path_1"
+          data-name="Path 1"
+          d="M488.722,0A45.161,45.161,0,0,1,527.83,22.576L675.676,278.584a45.162,45.162,0,0,1,0,45.171L527.83,579.763a45.162,45.162,0,0,1-39.108,22.576H193.008A45.162,45.162,0,0,1,153.9,579.763L6.053,323.755a45.162,45.162,0,0,1,0-45.171L153.9,22.576A45.162,45.162,0,0,1,193.008,0Z"
+          transform="translate(-13972.661 -1918.542) rotate(90)"
+          fill="#356290"
+        />
+        <Path
+          id="Path_252"
+          data-name="Path 252"
+          d="M401.1,0A60.816,60.816,0,0,1,453.77,30.405L567.2,226.844a60.816,60.816,0,0,1,0,60.82L453.77,484.1A60.816,60.816,0,0,1,401.1,514.509H174.241A60.816,60.816,0,0,1,121.575,484.1L8.149,287.665a60.816,60.816,0,0,1,0-60.82L121.575,30.405A60.816,60.816,0,0,1,174.241,0Z"
+          transform="translate(-14016.576 -1865.281) rotate(90)"
+          fill="#1784b2"
+        />
+        <Path
+          id="Path_251"
+          data-name="Path 251"
+          d="M345.81,0a36.573,36.573,0,0,1,31.674,18.288L480.566,196.856a36.573,36.573,0,0,1,0,36.569L377.484,411.993a36.573,36.573,0,0,1-31.674,18.288H139.655a36.572,36.572,0,0,1-31.674-18.288L4.9,233.425a36.573,36.573,0,0,1,0-36.569L107.981,18.288A36.573,36.573,0,0,1,139.655,0Z"
+          transform="translate(-14058.69 -1820.41) rotate(90)"
+          fill="#50bfc3"
+        />
+        <Path
+          id="_x3C__x2F__x3E_"
+          d="M187.066,335.455V297.993l-65.272-21.949,65.272-22.523V216.059L81,259.5v32.521Zm38.726,29.3L286.123,174H256.7l-60.33,190.759Zm72.052-29.3,106.066-43.783V259.267L297.844,216.059V254.44l59.3,23.328-59.3,19.421Z"
+          transform="translate(-14516.286 -1846.988)"
+          fill="#fff"
+        />
+      </G>
+    </Icon>
+  );
+};
+
+export default NativeBaseIcon;
diff --git a/expo-nativebase/package.json b/expo-nativebase/package.json
@@ -2,6 +2,19 @@
   "name": "expo-template-nativebase",
   "version": "1.0.0",
   "main": "node_modules/expo/AppEntry.js",
+  "keywords": [
+    "react",
+    "expo",
+    "template",
+    "nativebase"
+  ],
+  "description": "The base template for expo with NativeBase.",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/GeekyAnts/nativebase-templates.git",
+    "directory": "expo-nativebase"
+  },
+  "license": "MIT",
   "scripts": {
     "start": "expo start",
     "android": "expo start --android",