diff --git a/css/styles.css b/css/styles.css index 9c8a1b3..bf7e196 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1,62 +1,4 @@ -body { - margin: 0; - background-color: lightblue; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +ion-toolbar { + --ion-background-color: aliceblue; } -.home-page { - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; -} - -.about-page { - min-height: 100vh; - display: grid; - grid-template-columns: auto auto; - align-items: center; - justify-items: center; - gap: 1em; -} - -.about-page img { - max-width: 50%; - display: inline-block; - text-align: center; - transform: scale(1); - transition: transform 0.5s; -} - -.about-page img:hover { - transform: scale(1.5); -} - -.home-page ul { - margin: 0; - padding: 0; - width: 75%; - background-color: white; - list-style-type: none; - text-align: center; -} - -.home-page li { - border-bottom: 1px solid lightblue; -} - -li a { - display: block; - padding: 1em 0; - font-size: 2em; - background-color: darkslateblue; - color: white; - text-decoration: none; -} - -li a:hover { - color: darkslateblue; - background-color: white; - transition: all 0.5s; -} diff --git a/gallery.html b/gallery.html deleted file mode 100644 index 82368db..0000000 --- a/gallery.html +++ /dev/null @@ -1,23 +0,0 @@ - - - - - - - Gallery | Offline First Demo - - - - - - - - - - - - - - - - diff --git a/index.html b/index.html index c369b72..1ef4966 100644 --- a/index.html +++ b/index.html @@ -1,21 +1,114 @@ - - - - - Home | Offline First Demo - - - - - - + + + + + + Home | Offline First Demo + + + + + + + + + + + + + + + + +
+ + + + + + Photo Gallery + + + + + + Antelope + + Antelope + + + + + Bobcat + + Bobcat + + + + + + + Caracal + + Caracal + + + + + Caribou + + Caribou Bulls + + + + + Caribou + + Caribou + + + + + Cheetah + + Cheetah + + + + + Coyote + + Coyote + + + + + Ferrets + + Ferrets + + + + + Ox + + Ox + + + + + Coyote + + Tiger + + + + +
+ + + + \ No newline at end of file diff --git a/sw.js b/sw.js new file mode 100644 index 0000000..9195f20 --- /dev/null +++ b/sw.js @@ -0,0 +1,29 @@ +// Name of our cache +const cacheName = 'offline-pwa-gallery-v1'; + +// URLs to cache for offline mode +const urlsToCache = [ + +]; + +// Cache files on service worker registration +self.addEventListener('install', (event) => { + event.waitUntil( + caches.open(cacheName).then((cache) => { + return cache.addAll(urlsToCache); + }) + ); +}); + +// Intercept fetch requests to serve cached assets +self.addEventListener('fetch', (event) => { + if(event.request.url.match(/^https:\/\//)){ + console.log('Browser is requesting:', event.request.url); + } + event.respondWith( + caches.match(event.request).then((cachedResponse) => { + // It can update the cache to serve updated content on the next request + return cachedResponse || fetch(event.request); + }) + ); +});