Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
0 parents
commit 68bdb39
Showing
23 changed files
with
14,932 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. | ||
|
||
# dependencies | ||
/node_modules | ||
/.pnp | ||
.pnp.js | ||
|
||
# testing | ||
/coverage | ||
|
||
# production | ||
/build | ||
|
||
# misc | ||
.DS_Store | ||
.env.local | ||
.env.development.local | ||
.env.test.local | ||
.env.production.local | ||
.vscode | ||
|
||
npm-debug.log* | ||
yarn-debug.log* | ||
yarn-error.log* |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
{ | ||
"appId": "io.ionic.starter", | ||
"appName": "photo-gallery-capacitor-react", | ||
"bundledWebRuntime": false, | ||
"npmClient": "npm", | ||
"webDir": "build", | ||
"cordova": {} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
{ | ||
"name": "photo-gallery-capacitor-react", | ||
"integrations": { | ||
"capacitor": {} | ||
}, | ||
"type": "react" | ||
} |
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,51 @@ | ||
{ | ||
"name": "photo-gallery-capacitor-react", | ||
"version": "0.0.1", | ||
"private": true, | ||
"dependencies": { | ||
"@capacitor/core": "1.4.0", | ||
"@ionic/react": "^4.11.0", | ||
"@ionic/react-router": "^4.11.0", | ||
"@testing-library/jest-dom": "^4.2.4", | ||
"@testing-library/react": "^9.4.0", | ||
"@testing-library/user-event": "^8.0.3", | ||
"@types/jest": "^24.0.25", | ||
"@types/node": "^12.12.24", | ||
"@types/react": "^16.9.17", | ||
"@types/react-dom": "^16.9.4", | ||
"@types/react-router": "^5.1.4", | ||
"@types/react-router-dom": "^5.1.3", | ||
"ionicons": "^4.6.3", | ||
"react": "^16.12.0", | ||
"react-dom": "^16.12.0", | ||
"react-router": "^5.1.2", | ||
"react-router-dom": "^5.1.2", | ||
"react-scripts": "3.3.0", | ||
"typescript": "3.7.4" | ||
}, | ||
"scripts": { | ||
"start": "react-scripts start", | ||
"build": "react-scripts build", | ||
"test": "react-scripts test", | ||
"eject": "react-scripts eject" | ||
}, | ||
"eslintConfig": { | ||
"extends": "react-app" | ||
}, | ||
"browserslist": { | ||
"production": [ | ||
">0.2%", | ||
"not dead", | ||
"not op_mini all" | ||
], | ||
"development": [ | ||
"last 1 chrome version", | ||
"last 1 firefox version", | ||
"last 1 safari version" | ||
] | ||
}, | ||
"devDependencies": { | ||
"@capacitor/cli": "1.4.0" | ||
}, | ||
"description": "An Ionic project" | ||
} |
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="utf-8" /> | ||
<title>Ionic App</title> | ||
|
||
<base href="/" /> | ||
|
||
<meta | ||
name="viewport" | ||
content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" | ||
/> | ||
<meta name="format-detection" content="telephone=no" /> | ||
<meta name="msapplication-tap-highlight" content="no" /> | ||
|
||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> | ||
|
||
<link rel="shortcut icon" type="image/png" href="%PUBLIC_URL%/assets/icon/favicon.png" /> | ||
|
||
<!-- add to homescreen for ios --> | ||
<meta name="apple-mobile-web-app-capable" content="yes" /> | ||
<meta name="apple-mobile-web-app-title" content="Ionic App" /> | ||
<meta name="apple-mobile-web-app-status-bar-style" content="black" /> | ||
</head> | ||
|
||
<body> | ||
<div id="root"></div> | ||
</body> | ||
|
||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
{ | ||
"short_name": "Ionic App", | ||
"name": "My Ionic App", | ||
"icons": [ | ||
{ | ||
"src": "assets/icon/favicon.png", | ||
"sizes": "64x64 32x32 24x24 16x16", | ||
"type": "image/x-icon" | ||
}, | ||
{ | ||
"src": "assets/icon/icon.png", | ||
"type": "image/png", | ||
"sizes": "512x512", | ||
"purpose": "maskable" | ||
} | ||
], | ||
"start_url": ".", | ||
"display": "standalone", | ||
"theme_color": "#ffffff", | ||
"background_color": "#ffffff" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
import React from 'react'; | ||
import { render } from '@testing-library/react'; | ||
import App from './App'; | ||
|
||
test('renders without crashing', () => { | ||
const { baseElement } = render(<App />); | ||
expect(baseElement).toBeDefined(); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,68 @@ | ||
import React from 'react'; | ||
import { Redirect, Route } from 'react-router-dom'; | ||
import { | ||
IonApp, | ||
IonIcon, | ||
IonLabel, | ||
IonRouterOutlet, | ||
IonTabBar, | ||
IonTabButton, | ||
IonTabs | ||
} from '@ionic/react'; | ||
import { IonReactRouter } from '@ionic/react-router'; | ||
import { apps, flash, send } from 'ionicons/icons'; | ||
import Tab1 from './pages/Tab1'; | ||
import Tab2 from './pages/Tab2'; | ||
import Tab3 from './pages/Tab3'; | ||
import Details from './pages/Details'; | ||
|
||
/* Core CSS required for Ionic components to work properly */ | ||
import '@ionic/react/css/core.css'; | ||
|
||
/* Basic CSS for apps built with Ionic */ | ||
import '@ionic/react/css/normalize.css'; | ||
import '@ionic/react/css/structure.css'; | ||
import '@ionic/react/css/typography.css'; | ||
|
||
/* Optional CSS utils that can be commented out */ | ||
import '@ionic/react/css/padding.css'; | ||
import '@ionic/react/css/float-elements.css'; | ||
import '@ionic/react/css/text-alignment.css'; | ||
import '@ionic/react/css/text-transformation.css'; | ||
import '@ionic/react/css/flex-utils.css'; | ||
import '@ionic/react/css/display.css'; | ||
|
||
/* Theme variables */ | ||
import './theme/variables.css'; | ||
|
||
const App: React.FC = () => ( | ||
<IonApp> | ||
<IonReactRouter> | ||
<IonTabs> | ||
<IonRouterOutlet> | ||
<Route path="/tab1" component={Tab1} exact={true} /> | ||
<Route path="/tab2" component={Tab2} exact={true} /> | ||
<Route path="/tab2/details" component={Details} /> | ||
<Route path="/tab3" component={Tab3} /> | ||
<Route path="/" render={() => <Redirect to="/tab1" />} exact={true} /> | ||
</IonRouterOutlet> | ||
<IonTabBar slot="bottom"> | ||
<IonTabButton tab="tab1" href="/tab1"> | ||
<IonIcon icon={flash} /> | ||
<IonLabel>Tab One</IonLabel> | ||
</IonTabButton> | ||
<IonTabButton tab="tab2" href="/tab2"> | ||
<IonIcon icon={apps} /> | ||
<IonLabel>Tab Two</IonLabel> | ||
</IonTabButton> | ||
<IonTabButton tab="tab3" href="/tab3"> | ||
<IonIcon icon={send} /> | ||
<IonLabel>Tab Three</IonLabel> | ||
</IonTabButton> | ||
</IonTabBar> | ||
</IonTabs> | ||
</IonReactRouter> | ||
</IonApp> | ||
); | ||
|
||
export default App; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,11 @@ | ||
import React from 'react'; | ||
import ReactDOM from 'react-dom'; | ||
import App from './App'; | ||
import * as serviceWorker from './serviceWorker'; | ||
|
||
ReactDOM.render(<App />, document.getElementById('root')); | ||
|
||
// If you want your app to work offline and load faster, you can change | ||
// unregister() to register() below. Note this comes with some pitfalls. | ||
// Learn more about service workers: https://bit.ly/CRA-PWA | ||
serviceWorker.unregister(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import React from 'react'; | ||
import { IonBackButton, IonButtons, IonHeader, IonPage, IonToolbar, IonTitle, IonContent } from '@ionic/react'; | ||
|
||
const Details: React.FC = () => { | ||
return ( | ||
<IonPage> | ||
<IonHeader> | ||
<IonToolbar> | ||
<IonButtons slot="start"> | ||
<IonBackButton defaultHref="/tab2" /> | ||
</IonButtons> | ||
<IonTitle>Detail</IonTitle> | ||
</IonToolbar> | ||
</IonHeader> | ||
<IonContent> | ||
<p>Details</p> | ||
</IonContent> | ||
</IonPage> | ||
); | ||
}; | ||
|
||
export default Details; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
.welcome-card img { | ||
max-height: 35vh; | ||
overflow: hidden; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,71 @@ | ||
import { | ||
IonCard, | ||
IonCardContent, | ||
IonCardHeader, | ||
IonCardSubtitle, | ||
IonCardTitle, | ||
IonContent, | ||
IonHeader, | ||
IonIcon, | ||
IonItem, | ||
IonLabel, | ||
IonList, | ||
IonListHeader, | ||
IonPage, | ||
IonTitle, | ||
IonToolbar | ||
} from '@ionic/react'; | ||
import { book, build, colorFill, grid } from 'ionicons/icons'; | ||
import React from 'react'; | ||
import './Tab1.css'; | ||
|
||
const Tab1: React.FC = () => { | ||
return ( | ||
<IonPage> | ||
<IonHeader> | ||
<IonToolbar> | ||
<IonTitle>Tab One</IonTitle> | ||
</IonToolbar> | ||
</IonHeader> | ||
<IonContent> | ||
<IonCard className="welcome-card"> | ||
<img src="/assets/shapes.svg" alt="" /> | ||
<IonCardHeader> | ||
<IonCardSubtitle>Get Started</IonCardSubtitle> | ||
<IonCardTitle>Welcome to Ionic</IonCardTitle> | ||
</IonCardHeader> | ||
<IonCardContent> | ||
<p> | ||
Now that your app has been created, you'll want to start building out features and | ||
components. Check out some of the resources below for next steps. | ||
</p> | ||
</IonCardContent> | ||
</IonCard> | ||
|
||
<IonList lines="none"> | ||
<IonListHeader> | ||
<IonLabel>Resources</IonLabel> | ||
</IonListHeader> | ||
<IonItem href="https://ionicframework.com/docs/" target="_blank"> | ||
<IonIcon slot="start" color="medium" icon={book} /> | ||
<IonLabel>Ionic Documentation</IonLabel> | ||
</IonItem> | ||
<IonItem href="https://ionicframework.com/docs/building/scaffolding" target="_blank"> | ||
<IonIcon slot="start" color="medium" icon={build} /> | ||
<IonLabel>Scaffold Out Your App</IonLabel> | ||
</IonItem> | ||
<IonItem href="https://ionicframework.com/docs/layout/structure" target="_blank"> | ||
<IonIcon slot="start" color="medium" icon={grid} /> | ||
<IonLabel>Change Your App Layout</IonLabel> | ||
</IonItem> | ||
<IonItem href="https://ionicframework.com/docs/theming/basics" target="_blank"> | ||
<IonIcon slot="start" color="medium" icon={colorFill} /> | ||
<IonLabel>Theme Your App</IonLabel> | ||
</IonItem> | ||
</IonList> | ||
</IonContent> | ||
</IonPage> | ||
); | ||
}; | ||
|
||
export default Tab1; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
import React from 'react'; | ||
import { IonContent, IonHeader, IonItem, IonLabel, IonList, IonPage, IonTitle, IonToolbar } from '@ionic/react'; | ||
|
||
const Tab2: React.FC = () => { | ||
return ( | ||
<IonPage> | ||
<IonHeader> | ||
<IonToolbar> | ||
<IonTitle>Tab Two</IonTitle> | ||
</IonToolbar> | ||
</IonHeader> | ||
<IonContent> | ||
<IonList> | ||
<IonItem routerLink="/tab2/details"> | ||
<IonLabel> | ||
<h2>Go to detail</h2> | ||
</IonLabel> | ||
</IonItem> | ||
</IonList> | ||
</IonContent> | ||
</IonPage> | ||
); | ||
}; | ||
|
||
export default Tab2; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import React from 'react'; | ||
import { IonContent, IonHeader, IonPage, IonTitle, IonToolbar } from '@ionic/react'; | ||
|
||
const Tab3Page: React.FC = () => { | ||
return ( | ||
<IonPage> | ||
<IonHeader> | ||
<IonToolbar> | ||
<IonTitle>Tab Three</IonTitle> | ||
</IonToolbar> | ||
</IonHeader> | ||
<IonContent></IonContent> | ||
</IonPage> | ||
); | ||
}; | ||
|
||
export default Tab3Page; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
/// <reference types="react-scripts" /> |
Oops, something went wrong.