Skip to content

Instantly share code, notes, and snippets.

View shinokada's full-sized avatar

Shinichi Okada shinokada

352 followers · 5 following
View GitHub Profile
@shinokada
shinokada / types.d.ts
Created May 4, 2023 06:51
import type { SvelteComponent } from 'svelte';
export interface ActivityType {
title: HTMLElement | string;
date: Date | string;
src: string;
alt: string;
text?: HTMLElement | string;
}
@shinokada
shinokada / plantuml-in-markdown.md
Created April 10, 2023 01:38

How to add PlantUML to a markdown file

Code:

@startjson
{
   "fruit":"Apple",
 "size":"Large",
@shinokada
shinokada / index.html
Created April 8, 2023 23:13
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Svelte + PWA</title>
<link rel="manifest" href="/assets/manifest-1a803fe8.webmanifest" />
<meta name="theme-color" content="#ffffff" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
@shinokada
shinokada / manifest.webmanifest
Created April 8, 2023 12:40
{
"name": "Vite Svelte PWA",
"short_name": "vite-svelte-pwa",
"scope": "/",
"start_url": ".",
"icons": [
{
"src": "/apple-touch-icon.png",
"sizes": "180x180",
"type": "image/png"
@shinokada
shinokada / service-worker.js
Last active April 8, 2023 04:47
const GHPATH = 'https://vite-svelte-pwa.codewithshin.com';
const APP_PREFIX = 'vite_svelte_pwa_';
const VERSION = 'version_02';
const URLS = [
`${GHPATH}/`,
`${GHPATH}/index.html`
];
const CACHE_NAME = APP_PREFIX + VERSION;
self.addEventListener('fetch', function (e) {
@shinokada
shinokada / add-exports-to-package-json.js
Last active April 5, 2023 08:25
/*
This script reads the files in the dist directory and creates a new exports object in the package.json file
with the appropriate svelte and types paths for each Svelte component file found in the dist directory,
except for index.js and index.d.ts.
The resulting exports object is structured as follows:
"exports": {
".": {
"types": "./dist/index.d.ts",
"svelte": "./dist/index.js"
},
@shinokada
shinokada / add-exports-to-package-json.js
Created April 5, 2023 05:29
// Use this script where you have sub-directories
// This script reads the files in the dist directory and creates a new exports object in the package.json file
import fs from 'fs';
import path from 'path';
const distDir = './dist';
const packageJsonPath = './package.json';
const componentNames = fs.readdirSync(distDir);
const componentExports = {};
@shinokada
shinokada / +page.svelte
Last active March 31, 2023 04:07
<script>
import { Heading, Button, Modal, ImagePlaceholder, TextPlaceholder } from 'flowbite-svelte'
let defaultModal = false;
</script>
<Heading tag="h1" customSize="text-5xl">My website</Heading>
<ImagePlaceholder class='my-4'/>
<Button on:click={() => defaultModal = true} class='mb-4'>Default modal</Button>
<TextPlaceholder class='pb-8' size='xxl'/>
<TextPlaceholder class='pb-8' size='xxl'/>
@shinokada
shinokada / +layout.svelte
Last active March 30, 2023 06:29
<script lang='ts'>
import "../app.postcss"
import { Navbar, NavBrand, NavLi, NavUl, NavHamburger, Footer, FooterBrand, FooterCopyright, FooterLinkGroup, FooterLink, Hr } from 'flowbite-svelte'
</script>
<Navbar let:hidden let:toggle>
<NavBrand href="/">
<img
src="https://flowbite-svelte.com/images/flowbite-svelte-icon-logo.svg"
class="mr-3 h-6 sm:h-9"
@shinokada
shinokada / +layout.svelte
Last active March 30, 2023 06:29
<script lang='ts'>
import "../app.postcss"
import { Navbar, NavBrand, NavLi, NavUl, NavHamburger } from 'flowbite-svelte'
</script>
<Navbar let:hidden let:toggle>
<NavBrand href="/">
<img
src="https://flowbite-svelte.com/images/flowbite-svelte-icon-logo.svg"
class="mr-3 h-6 sm:h-9"