LukeParke/dev-extension-template-demo
1
0
Fork 0
mirror of https://github.com/LukeHagar/dev-extension-template-demo.git synced 2025-12-07 20:37:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Demo upload

Browse Source
This commit is contained in:
Luke Hagar
2023-05-22 15:56:47 -05:00
parent 770d397dfe
commit 2fffb663c2
3 changed files with 17 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -19,6 +19,7 @@
"@sveltejs/kit": "^1.5.0", "@sveltejs/kit": "^1.5.0",
"@tailwindcss/forms": "^0.5.3", "@tailwindcss/forms": "^0.5.3",
"@tailwindcss/typography": "^0.5.9", "@tailwindcss/typography": "^0.5.9",
"@types/chrome": "^0.0.236",
"@typescript-eslint/eslint-plugin": "^5.45.0", "@typescript-eslint/eslint-plugin": "^5.45.0",
"@typescript-eslint/parser": "^5.45.0", "@typescript-eslint/parser": "^5.45.0",
"autoprefixer": "^10.4.14", "autoprefixer": "^10.4.14",

18
src/routes/+layout.svelte
View File

@@ -1,11 +1,22 @@
<script lang='ts'> <script lang="ts">
// The ordering of these imports is critical to your app working properly // The ordering of these imports is critical to your app working properly
import '@skeletonlabs/skeleton/themes/theme-skeleton.css'; import '@skeletonlabs/skeleton/themes/theme-skeleton.css';
// If you have source.organizeImports set to true in VSCode, then it will auto change this ordering // If you have source.organizeImports set to true in VSCode, then it will auto change this ordering
import '@skeletonlabs/skeleton/styles/skeleton.css'; import '@skeletonlabs/skeleton/styles/skeleton.css';
// Most of your app wide CSS should be put in this file // Most of your app wide CSS should be put in this file
import { AppBar, AppShell } from '@skeletonlabs/skeleton';
import '../app.postcss'; import '../app.postcss';
import { AppShell, AppBar } from '@skeletonlabs/skeleton'; import { onMount } from 'svelte';
let environment: string;
onMount(() => {
if (window.chrome && chrome.runtime && chrome.runtime.id) {
environment = 'Chrome Extension';
} else {
environment = 'Development Environment';
}
});
</script> </script>
<!-- App Shell --> <!-- App Shell -->
@@ -16,6 +27,9 @@
<svelte:fragment slot="lead"> <svelte:fragment slot="lead">
<strong class="text-xl uppercase">Skeleton</strong> <strong class="text-xl uppercase">Skeleton</strong>
</svelte:fragment> </svelte:fragment>
<p class="text-center">{environment}</p>
<svelte:fragment slot="trail"> <svelte:fragment slot="trail">
<a <a
class="btn btn-sm variant-ghost-surface" class="btn btn-sm variant-ghost-surface"

2
src/routes/+page.svelte
View File

@@ -1,5 +1,3 @@
<!-- YOU CAN DELETE EVERYTHING IN THIS PAGE -->
<div class="container h-full mx-auto flex justify-center items-center"> <div class="container h-full mx-auto flex justify-center items-center">
<div class="space-y-10 text-center flex flex-col items-center"> <div class="space-y-10 text-center flex flex-col items-center">
<h2 class="h2 font-bold">Welcome to Skeleton.</h2> <h2 class="h2 font-bold">Welcome to Skeleton.</h2>