added style
This commit is contained in:
parent
7430890d03
commit
eda1670f9c
|
@ -4,7 +4,7 @@ apply plugin: "com.facebook.react"
|
|||
apply from: file("../../node_modules/react-native-vector-icons/fonts.gradle")
|
||||
|
||||
project.ext.vectoricons = [
|
||||
iconFontNames: [ 'Feather.ttf' ]
|
||||
iconFontNames: [ 'Feather.ttf', 'Ionicons.ttf' ]
|
||||
]
|
||||
|
||||
/**
|
||||
|
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"migIndex": 1,
|
||||
"data": [
|
||||
{
|
||||
"path": "src/assets/fonts/Inconsolata Condensed Medium.ttf",
|
||||
"sha1": "352263ace35c1aefd0cdc387e32189351cbbc112"
|
||||
},
|
||||
{
|
||||
"path": "src/assets/fonts/Inconsolata Medium.ttf",
|
||||
"sha1": "f72a59ce0107983a5fff171d27da81e8c128c8b2"
|
||||
},
|
||||
{
|
||||
"path": "src/assets/fonts/Inconsolata Regular.ttf",
|
||||
"sha1": "55181a8eafc09ca273f978d6e35d2ed46e47e570"
|
||||
}
|
||||
]
|
||||
}
|
|
@ -14,6 +14,9 @@
|
|||
13B07FC11A68108700A75B9A /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
|
||||
7699B88040F8A987B510C191 /* libPods-keycardExit-keycardExitTests.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 19F6CBCC0A4E27FBF8BF4A61 /* libPods-keycardExit-keycardExitTests.a */; };
|
||||
81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */; };
|
||||
B9C3311BDD14496BBB4E1CA8 /* Inconsolata Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = C152A6052C4C4603A1D67162 /* Inconsolata Regular.ttf */; };
|
||||
BB2182DA25304A4597E3C05B /* Inconsolata Condensed Medium.ttf in Resources */ = {isa = PBXBuildFile; fileRef = B73A75AC252241AD9A88316F /* Inconsolata Condensed Medium.ttf */; };
|
||||
B411AC695C5A4B95AD8C63CF /* Inconsolata Medium.ttf in Resources */ = {isa = PBXBuildFile; fileRef = BFDDB358DEF6415188C7C046 /* Inconsolata Medium.ttf */; };
|
||||
/* End PBXBuildFile section */
|
||||
|
||||
/* Begin PBXContainerItemProxy section */
|
||||
|
@ -45,6 +48,9 @@
|
|||
81AB9BB72411601600AC10FF /* LaunchScreen.storyboard */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = file.storyboard; name = LaunchScreen.storyboard; path = keycardExit/LaunchScreen.storyboard; sourceTree = "<group>"; };
|
||||
89C6BE57DB24E9ADA2F236DE /* Pods-keycardExit-keycardExitTests.release.xcconfig */ = {isa = PBXFileReference; includeInIndex = 1; lastKnownFileType = text.xcconfig; name = "Pods-keycardExit-keycardExitTests.release.xcconfig"; path = "Target Support Files/Pods-keycardExit-keycardExitTests/Pods-keycardExit-keycardExitTests.release.xcconfig"; sourceTree = "<group>"; };
|
||||
ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
|
||||
C152A6052C4C4603A1D67162 /* Inconsolata Regular.ttf */ = {isa = PBXFileReference; name = "Inconsolata Regular.ttf"; path = "../src/assets/fonts/Inconsolata Regular.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
B73A75AC252241AD9A88316F /* Inconsolata Condensed Medium.ttf */ = {isa = PBXFileReference; name = "Inconsolata Condensed Medium.ttf"; path = "../src/assets/fonts/Inconsolata Condensed Medium.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
BFDDB358DEF6415188C7C046 /* Inconsolata Medium.ttf */ = {isa = PBXFileReference; name = "Inconsolata Medium.ttf"; path = "../src/assets/fonts/Inconsolata Medium.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
|
||||
/* End PBXFileReference section */
|
||||
|
||||
/* Begin PBXFrameworksBuildPhase section */
|
||||
|
@ -124,6 +130,7 @@
|
|||
83CBBA001A601CBA00E9B192 /* Products */,
|
||||
2D16E6871FA4F8E400B85C8A /* Frameworks */,
|
||||
BBD78D7AC51CEA395F1C20DB /* Pods */,
|
||||
992F09F0E661463D9AC551F7 /* Resources */,
|
||||
);
|
||||
indentWidth = 2;
|
||||
sourceTree = "<group>";
|
||||
|
@ -150,6 +157,17 @@
|
|||
path = Pods;
|
||||
sourceTree = "<group>";
|
||||
};
|
||||
992F09F0E661463D9AC551F7 /* Resources */ = {
|
||||
isa = "PBXGroup";
|
||||
children = (
|
||||
C152A6052C4C4603A1D67162 /* Inconsolata Regular.ttf */,
|
||||
B73A75AC252241AD9A88316F /* Inconsolata Condensed Medium.ttf */,
|
||||
BFDDB358DEF6415188C7C046 /* Inconsolata Medium.ttf */,
|
||||
);
|
||||
name = Resources;
|
||||
sourceTree = "<group>";
|
||||
path = "";
|
||||
};
|
||||
/* End PBXGroup section */
|
||||
|
||||
/* Begin PBXNativeTarget section */
|
||||
|
@ -245,6 +263,9 @@
|
|||
files = (
|
||||
81AB9BB82411601600AC10FF /* LaunchScreen.storyboard in Resources */,
|
||||
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
|
||||
B9C3311BDD14496BBB4E1CA8 /* Inconsolata Regular.ttf in Resources */,
|
||||
BB2182DA25304A4597E3C05B /* Inconsolata Condensed Medium.ttf in Resources */,
|
||||
B411AC695C5A4B95AD8C63CF /* Inconsolata Medium.ttf in Resources */,
|
||||
);
|
||||
runOnlyForDeploymentPostprocessing = 0;
|
||||
};
|
||||
|
|
|
@ -26,14 +26,13 @@
|
|||
<true/>
|
||||
<key>NSAppTransportSecurity</key>
|
||||
<dict>
|
||||
<!-- Do not change NSAllowsArbitraryLoads to true, or you will risk app rejection! -->
|
||||
<key>NSAllowsArbitraryLoads</key>
|
||||
<false/>
|
||||
<key>NSAllowsLocalNetworking</key>
|
||||
<true/>
|
||||
</dict>
|
||||
<key>NSLocationWhenInUseUsageDescription</key>
|
||||
<string></string>
|
||||
<string/>
|
||||
<key>UILaunchStoryboardName</key>
|
||||
<string>LaunchScreen</string>
|
||||
<key>UIRequiredDeviceCapabilities</key>
|
||||
|
@ -48,5 +47,11 @@
|
|||
</array>
|
||||
<key>UIViewControllerBasedStatusBarAppearance</key>
|
||||
<false/>
|
||||
<key>UIAppFonts</key>
|
||||
<array>
|
||||
<string>Inconsolata Regular.ttf</string>
|
||||
<string>Inconsolata Condensed Medium.ttf</string>
|
||||
<string>Inconsolata Medium.ttf</string>
|
||||
</array>
|
||||
</dict>
|
||||
</plist>
|
||||
|
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"migIndex": 1,
|
||||
"data": [
|
||||
{
|
||||
"path": "src/assets/fonts/Inconsolata Condensed Medium.ttf",
|
||||
"sha1": "352263ace35c1aefd0cdc387e32189351cbbc112"
|
||||
},
|
||||
{
|
||||
"path": "src/assets/fonts/Inconsolata Medium.ttf",
|
||||
"sha1": "f72a59ce0107983a5fff171d27da81e8c128c8b2"
|
||||
},
|
||||
{
|
||||
"path": "src/assets/fonts/Inconsolata Regular.ttf",
|
||||
"sha1": "55181a8eafc09ca273f978d6e35d2ed46e47e570"
|
||||
}
|
||||
]
|
||||
}
|
|
@ -0,0 +1,3 @@
|
|||
module.exports = {
|
||||
assets: ['./src/assets/fonts/'],
|
||||
};
|
|
@ -123,7 +123,7 @@ const Main = () => {
|
|||
didMount.current = true;
|
||||
|
||||
const loadPairing = async () => {
|
||||
await Keycard.setPairings(await getPairings());
|
||||
await Keycard.setPairings(await getPairings());
|
||||
};
|
||||
|
||||
loadPairing().catch(console.log);
|
||||
|
@ -181,7 +181,7 @@ const Main = () => {
|
|||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
height: '100%'
|
||||
},
|
||||
});
|
||||
|
||||
|
|
|
@ -1,6 +1,9 @@
|
|||
import React, {FC, useEffect, useState } from "react";
|
||||
import {Platform, StyleSheet, Text, View } from "react-native";
|
||||
import {Platform, StyleSheet, Text, useColorScheme, View } from "react-native";
|
||||
import Modal from "react-native-modal/dist/modal";
|
||||
import Icon from 'react-native-vector-icons/Feather';
|
||||
import { Colors } from "react-native/Libraries/NewAppScreen";
|
||||
import Button from "./components/Button";
|
||||
|
||||
type NFCModalProps = {
|
||||
isVisible: boolean;
|
||||
|
@ -9,12 +12,17 @@ type NFCModalProps = {
|
|||
|
||||
const NFCModal: FC<NFCModalProps> = props => {
|
||||
const {isVisible, onChangeFunc} = props;
|
||||
const isDarkMode = useColorScheme() === 'dark';
|
||||
|
||||
return (
|
||||
<Modal isVisible={(Platform.OS === 'android') && isVisible} onSwipeComplete={() => onChangeFunc(!isVisible)} swipeDirection={['up', 'left', 'right', 'down']} style={modalStyle.modalContainer}>
|
||||
<View style={modalStyle.container}>
|
||||
<Modal isVisible={(Platform.OS === 'android') && isVisible} style={modalStyle.modalContainer}>
|
||||
<View style={[modalStyle.container, {backgroundColor: isDarkMode ? Colors.darker : Colors.lighter}]}>
|
||||
<Text style={modalStyle.header}>Ready to Scan</Text>
|
||||
<View style={modalStyle.iconContainer}>
|
||||
<Icon name="smartphone" size={40} style={modalStyle.icon}/>
|
||||
</View>
|
||||
<Text style={modalStyle.prompt}>Tap your Keycard</Text>
|
||||
<Button label="Cancel" disabled={false} btnColor="white" btnBorderColor="white" btnFontSize={13} btnBorderWidth={1} btnWidth="100%" onChangeFunc={() => onChangeFunc(!isVisible)} btnJustifyContent='center'></Button>
|
||||
</View>
|
||||
</Modal>
|
||||
)};
|
||||
|
@ -25,8 +33,7 @@ const modalStyle = StyleSheet.create({
|
|||
margin: 0
|
||||
},
|
||||
container: {
|
||||
backgroundColor: '#4A646C',
|
||||
height: 250,
|
||||
height: 350,
|
||||
paddingBottom: 20,
|
||||
alignItems: 'center',
|
||||
borderTopLeftRadius: 10,
|
||||
|
@ -34,13 +41,27 @@ const modalStyle = StyleSheet.create({
|
|||
borderColor: 'rgba(0, 0, 0, 0.1)',
|
||||
},
|
||||
header: {
|
||||
paddingTop: '5%',
|
||||
fontSize: 24
|
||||
paddingTop: '7%',
|
||||
fontSize: 22,
|
||||
fontFamily: 'Inconsolata Regular'
|
||||
},
|
||||
prompt: {
|
||||
paddingTop: '10%',
|
||||
paddingBottom: '10%',
|
||||
fontSize: 15
|
||||
fontSize: 16,
|
||||
fontFamily: 'Inconsolata Regular'
|
||||
},
|
||||
iconContainer: {
|
||||
width: 80,
|
||||
height: 80,
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
borderColor: '#0e4e0b',
|
||||
borderWidth: 3,
|
||||
borderRadius: 80,
|
||||
marginTop: '7%',
|
||||
},
|
||||
icon: {
|
||||
color: '#0e4e0b'
|
||||
}
|
||||
});
|
||||
|
||||
|
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
@ -6,17 +6,20 @@ type ButtonProps = {
|
|||
disabled: boolean;
|
||||
btnColor: string;
|
||||
btnWidth: string;
|
||||
btnFontSize?: number;
|
||||
btnBorderColor?: string;
|
||||
btnBorderWidth?: number;
|
||||
btnJustifyContent: string;
|
||||
onChangeFunc: () => void;
|
||||
};
|
||||
|
||||
const Button: FC<ButtonProps> = props => {
|
||||
const {label, disabled, btnColor, btnWidth, btnJustifyContent, onChangeFunc} = props;
|
||||
const {label, disabled, btnColor, btnWidth, btnJustifyContent, btnFontSize, btnBorderWidth, btnBorderColor, onChangeFunc} = props;
|
||||
|
||||
return (
|
||||
<View style={[buttonStyle.textBtnContainer, {width: btnWidth as DimensionValue, justifyContent: btnJustifyContent as any}]}>
|
||||
<TouchableOpacity key={label} disabled={disabled} style={buttonStyle.button} onPress={onChangeFunc}>
|
||||
<Text style={[buttonStyle.title, {color: btnColor}]}>{label}</Text>
|
||||
<Text style={[buttonStyle.title, {color: btnColor, borderBottomColor: btnBorderColor || 'none', borderBottomWidth: btnBorderWidth || 0, fontSize: btnFontSize}]}>{label}</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
)};
|
||||
|
@ -32,9 +35,8 @@ const buttonStyle = StyleSheet.create({
|
|||
button: {
|
||||
},
|
||||
title: {
|
||||
fontSize: 15,
|
||||
textTransform: 'uppercase',
|
||||
|
||||
fontFamily: 'Inconsolata Medium',
|
||||
},
|
||||
});
|
||||
|
||||
|
|
|
@ -10,10 +10,12 @@ const DiscoveryScreen: FC<DiscoveryScreenProps> = props => {
|
|||
const {onPressFunc} = props;
|
||||
|
||||
return (
|
||||
<View>
|
||||
<View>
|
||||
<View style={styles.container}>
|
||||
<View style={styles.headingContainer}>
|
||||
<Text style={styles.heading}> We are recruiting Operators to be the founders of a new, self-sovereign world in cyberspace</Text>
|
||||
<Button label="Discover" disabled={false} btnColor="#4A646C" btnWidth="100%" onChangeFunc={onPressFunc} btnJustifyContent='center'></Button>
|
||||
</View>
|
||||
<View style={styles.btnContainer}>
|
||||
<Button label="Connect" disabled={false} btnColor="#199515" btnBorderColor="#199515" btnFontSize={17} btnBorderWidth={1} btnWidth="100%" onChangeFunc={onPressFunc} btnJustifyContent='center'></Button>
|
||||
</View>
|
||||
<View>
|
||||
</View>
|
||||
|
@ -21,9 +23,23 @@ const DiscoveryScreen: FC<DiscoveryScreenProps> = props => {
|
|||
)};
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
container: {
|
||||
width: '100%',
|
||||
height: '100%'
|
||||
},
|
||||
headingContainer: {
|
||||
width: '100%',
|
||||
paddingLeft: '5.5%',
|
||||
paddingRight: '5.5%',
|
||||
paddingTop: '50%',
|
||||
},
|
||||
heading: {
|
||||
textAlign: 'center',
|
||||
fontSize: 16
|
||||
fontSize: 18,
|
||||
fontFamily: 'Inconsolata Regular'
|
||||
},
|
||||
btnContainer: {
|
||||
paddingTop: '7%'
|
||||
}
|
||||
});
|
||||
|
||||
|
|
Loading…
Reference in New Issue