skolhustick

name: Node.js CI

on: [push]

jobs:
  build:

    runs-on: self-hosted

    strategy:

skolhustick

const withPWA = require('next-pwa')
 
module.exports = withPWA({
    pwa: {
        dest: 'public'
    }
})

skolhustick

<meta charset='utf-8' />
<meta http-equiv='X-UA-Compatible' content='IE=edge' />
<meta name='viewport' content='width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no' />
<meta name='description' content='Description' />
<meta name='keywords' content='Keywords' />
<title>Next.js PWA Example</title>

<link rel="manifest" href="/manifest.json" />
<link href='/favicon-16x16.png' rel='icon' type='image/png' sizes='16x16' />
<link href='/favicon-32x32.png' rel='icon' type='image/png' sizes='32x32' />

skolhustick

import React from 'react'
import Link from 'next/link'
import Head from 'next/head'

const links = [
  { href: 'https://zeit.co/now', label: 'ZEIT' },
  { href: 'https://github.com/zeit/next.js', label: 'GitHub' }
].map(link => ({
  ...link,
  key: `nav-link-${link.href}-${link.label}`

skolhustick

import styled from 'styled-components'

const Button = styled.button`
  background: ${props => props.theme.bg.primary};
  color: ${props => props.theme.fontColor};
`

Button.defaultProps = {
  theme: {
    bg: 'white',

skolhustick

const light = {
  bg: 'white',
  fontColor: 'purple'
}

const dark = {
  bg: 'black',
  fontColor: 'white'
}

skolhustick

import styled from 'styled-components'

const Button = styled.button`
  background: ${props => props.theme.bg};
  color: ${props => props.theme.fontColor};
`

Button.defaultProps = {
  theme: {
    bg: 'white',

skolhustick

import React, { useState, useEffect } from 'react'
import useDarkMode from 'use-dark-mode'
import { ThemeProvider } from 'styled-components'
import { lightTheme, darkTheme } from '../theme'

const MyApp = ({ Component, pageProps }) => {
  const [isMounted, setIsMounted] = useState(false)
  const darkMode = useDarkMode(true)
  const theme = darkMode.value ? darkTheme : lightTheme

skolhustick

import React from 'react'
import Button from '../components/Button'

const Home = () => {
  return <Button>Theme Test</Button>
}

export default Home

skolhustick

import React from 'react'
import {
  ThemeProvider,
  theme,
  ColorModeProvider,
  CSSReset,
  Box,
  Flex,
  IconButton,
  useColorMode,