Skip to content

Commit

Permalink
Add meta to splash screen for iOS
Browse files Browse the repository at this point in the history
  • Loading branch information
@silviolleite
silviolleite committed Jan 21, 2019
1 parent cd35170 commit e0c610a
Show file tree
Hide file tree
Showing 14 changed files with 62 additions and 4 deletions.
14 changes: 13 additions & 1 deletion Config/config.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,19 @@
'152x152' => '/images/icons/icon-152x152.png',
'192x192' => '/images/icons/icon-192x192.png',
'384x384' => '/images/icons/icon-384x384.png',
'512x512' => '/images/icons/icon-512x512.png',
'512x512' => '/images/icons/icon-512x512.png'
],
'splash' => [
'640x1136' => '/images/icons/splash-640x1136.png',
'750x1334' => '/images/icons/splash-750x1334.png',
'828x1792' => '/images/icons/splash-828x1792.png',
'1125x2436' => '/images/icons/splash-1125x2436.png',
'1242x2208' => '/images/icons/splash-1242x2208.png',
'1242x2688' => '/images/icons/splash-1242x2688.png',
'1536x2048' => '/images/icons/splash-1536x2048.png',
'1668x2224' => '/images/icons/splash-1668x2224.png',
'1668x2388' => '/images/icons/splash-1668x2388.png',
'2048x2732' => '/images/icons/splash-2048x2732.png',
]
]
];
37 changes: 35 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ Add the following to your `composer.json` file :

```json
"require": {
"silviolleite/laravelpwa": "^1.0.1",
"silviolleite/laravelpwa": "^1.0.2",
},
```

Expand All @@ -39,7 +39,7 @@ $ php artisan vendor:publish --provider="LaravelPWA\Providers\LaravelPWAServiceP

### Configuration

Configure your app name, description, and icons in `config/laravelpwa.php`.
Configure your app name, description, icons and splashes in `config/laravelpwa.php`.

```php
'manifest' => [
Expand All @@ -59,6 +59,18 @@ Configure your app name, description, and icons in `config/laravelpwa.php`.
'192x192' => '/images/icons/icon-192x192.png',
'384x384' => '/images/icons/icon-384x384.png',
'512x512' => '/images/icons/icon-512x512.png',
],
'splash' => [
'640x1136' => '/images/icons/splash-640x1136.png',
'750x1334' => '/images/icons/splash-750x1334.png',
'828x1792' => '/images/icons/splash-828x1792.png',
'1125x2436' => '/images/icons/splash-1125x2436.png',
'1242x2208' => '/images/icons/splash-1242x2208.png',
'1242x2688' => '/images/icons/splash-1242x2688.png',
'1536x2048' => '/images/icons/splash-1536x2048.png',
'1668x2224' => '/images/icons/splash-1668x2224.png',
'1668x2388' => '/images/icons/splash-1668x2388.png',
'2048x2732' => '/images/icons/splash-2048x2732.png',
]
]
```
Expand All @@ -83,6 +95,17 @@ how this example:
<meta name="apple-mobile-web-app-title" content="PWA">
<link rel="apple-touch-icon" href="/images/icons/icon-512x512.png">

<link href="/images/icons/splash-640x1136.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-750x1334.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1242x2208.png" media="(device-width: 621px) and (device-height: 1104px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1125x2436.png" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-828x1792.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1242x2688.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1536x2048.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1668x2224.png" media="(device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1668x2388.png" media="(device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-2048x2732.png" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />

<!-- Tile for Win8 -->
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/images/icons/icon-512x512.png">
Expand Down Expand Up @@ -130,6 +153,16 @@ var filesToCache = [
'/images/icons/icon-192x192.png',
'/images/icons/icon-384x384.png',
'/images/icons/icon-512x512.png',
'/images/icons/splash-640x1136.png',
'/images/icons/splash-750x1334.png',
'/images/icons/splash-1242x2208.png',
'/images/icons/splash-1125x2436.png',
'/images/icons/splash-828x1792.png',
'/images/icons/splash-1242x2688.png',
'/images/icons/splash-1536x2048.png',
'/images/icons/splash-1668x2224.png',
'/images/icons/splash-1668x2388.png',
'/images/icons/splash-2048x2732.png'
];

// Cache on install
Expand Down
3 changes: 2 additions & 1 deletion Services/ManifestService.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,8 @@ public function generate()
'display' => config('laravelpwa.manifest.display'),
'theme_color' => config('laravelpwa.manifest.theme_color'),
'background_color' => config('laravelpwa.manifest.background_color'),
'orientation' => config('laravelpwa.manifest.orientation')
'orientation' => config('laravelpwa.manifest.orientation'),
'splash' => config('laravelpwa.manifest.splash')
];

foreach (config('laravelpwa.manifest.icons') as $size => $file) {
Expand Down
Binary file added assets/images/icons/splash-1125x2436.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-1242x2208.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-1242x2688.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-1536x2048.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-1668x2224.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-1668x2388.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-2048x2732.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-640x1136.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-750x1334.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/icons/splash-828x1792.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
12 changes: 12 additions & 0 deletions resources/views/meta.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,18 @@
<meta name="apple-mobile-web-app-title" content="{{ $config['short_name'] }}">
<link rel="apple-touch-icon" href="{{ data_get(end($config['icons']), 'src') }}">


<link href="{{ $config['splash']['640x1136'] }}" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['750x1334'] }}" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['1242x2208'] }}" media="(device-width: 621px) and (device-height: 1104px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['1125x2436'] }}" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['828x1792'] }}" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['1242x2688'] }}" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['1536x2048'] }}" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['1668x2224'] }}" media="(device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['1668x2388'] }}" media="(device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="{{ $config['splash']['2048x2732'] }}" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />

<!-- Tile for Win8 -->
<meta name="msapplication-TileColor" content="{{ $config['background_color'] }}">
<meta name="msapplication-TileImage" content="{{ data_get(end($config['icons']), 'src') }}">
Expand Down

0 comments on commit e0c610a

Please sign in to comment.