dietpi/svelte-makigas
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

20 css

Browse Source
This commit is contained in:
clonbg
2023-09-05 16:17:34 +02:00
parent c13e8672dd
commit 6eacf87d25
13 changed files with 1789 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
como_css/.gitignore vendored Normal file
View File

@@ -0,0 +1,11 @@
.DS_Store
node_modules
/build
/dist
/.svelte-kit
/package
.env
.env.*
!.env.example
vite.config.js.timestamp-*
vite.config.ts.timestamp-*

2
como_css/.npmrc Normal file
View File

@@ -0,0 +1,2 @@
engine-strict=true
resolution-mode=highest

58
como_css/README.md Normal file
View File

@@ -0,0 +1,58 @@
# create-svelte
Everything you need to build a Svelte library, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte).
Read more about creating a library [in the docs](https://kit.svelte.dev/docs/packaging).
## Creating a project
If you're seeing this, you've probably already done this step. Congrats!
```bash
# create a new project in the current directory
npm create svelte@latest
# create a new project in my-app
npm create svelte@latest my-app
```
## Developing
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
```bash
npm run dev
# or start the server and open the app in a new browser tab
npm run dev -- --open
```
Everything inside `src/lib` is part of your library, everything inside `src/routes` can be used as a showcase or preview app.
## Building
To build your library:
```bash
npm run package
```
To create a production version of your showcase app:
```bash
npm run build
```
You can preview the production build with `npm run preview`.
> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment.
## Publishing
Go into the `package.json` and give your package the desired name through the `"name"` option. Also consider adding a `"license"` field and point it to a `LICENSE` file which you can create from a template (one popular option is the [MIT license](https://opensource.org/license/mit/)).
To publish your library to [npm](https://www.npmjs.com):
```bash
npm publish
```

11
como_css/jsconfig.json Normal file
View File

@@ -0,0 +1,11 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"resolveJsonModule": true,
"skipLibCheck": true,
"sourceMap": true,
"moduleResolution": "NodeNext"
}
}

1568
como_css/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

41
como_css/package.json Normal file
View File

@@ -0,0 +1,41 @@
{
"name": "como-css",
"version": "0.0.1",
"scripts": {
"dev": "vite dev",
"build": "vite build && npm run package",
"preview": "vite preview",
"package": "svelte-kit sync && svelte-package && publint",
"prepublishOnly": "npm run package"
},
"exports": {
".": {
"types": "./dist/index.d.ts",
"svelte": "./dist/index.js"
}
},
"files": [
"dist",
"!dist/**/*.test.*",
"!dist/**/*.spec.*"
],
"peerDependencies": {
"svelte": "^4.0.0"
},
"devDependencies": {
"@sveltejs/adapter-auto": "^2.0.0",
"@sveltejs/kit": "^1.20.4",
"@sveltejs/package": "^2.0.0",
"publint": "^0.1.9",
"svelte": "^4.0.5",
"tslib": "^2.4.1",
"typescript": "^5.0.0",
"vite": "^4.4.2"
},
"svelte": "./dist/index.js",
"types": "./dist/index.d.ts",
"type": "module",
"dependencies": {
"bootstrap": "^5.3.1"
}
}

12
como_css/src/app.html Normal file
View File

@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div>%sveltekit.body%</div>
</body>
</html>

1
como_css/src/lib/index.js Normal file
View File

@@ -0,0 +1 @@
// Reexport your entry components here

5
como_css/src/routes/+layout.svelte Normal file
View File

@@ -0,0 +1,5 @@
<script>
import "bootstrap/dist/css/bootstrap.min.css";
</script>
<slot />

61
como_css/src/routes/+page.svelte Normal file
View File

@@ -0,0 +1,61 @@
<script>
let nombre = "Manuel";
let apellido = "Riquelme";
</script>
<div class="body w-25 p-6 flex mx-auto">
<form>
<div class="form-group mb-3">
<label
for="nombre"
class="text-danger"
on:mouseover={() => document.getElementById("nombre").focus()}
on:focus={() => document.getElementById("nombre").focus()}>Nombre</label
>
<input
type="text"
class="form-control"
id="nombre"
placeholder="Introduzca su nombre"
bind:value={nombre}
/>
</div>
<div class="form-group mb-3">
<label
for="apellido"
class="text-danger"
on:mouseover={() => document.getElementById("apellido").focus()}
on:focus={() => document.getElementById("apellido").focus()}
>Apellido</label
>
<input
type="apellido"
class="form-control"
placeholder="Introduzca su apellido"
bind:value={apellido}
id="apellido"
/>
</div>
<button type="submit" class="btn btn-primary mb-3">Submit</button>
<p class="soy label"><strong>Tu eres: </strong>{nombre} {apellido}</p>
</form>
</div>
<div class="flex mx-auto">Cojón</div>
<style scoped>
.body {
margin: 0;
display: flex;
place-items: center;
min-width: 320px;
min-height: 100vh;
}
input:hover {
border: 1px solid red;
}
.soy:hover {
color: green;
text-decoration: underline;
}
</style>

BIN
como_css/static/favicon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

13
como_css/svelte.config.js Normal file
View File

@@ -0,0 +1,13 @@
import adapter from '@sveltejs/adapter-auto';
/** @type {import('@sveltejs/kit').Config} */
const config = {
kit: {
// adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
// If your environment is not supported or you settled on a specific environment, switch out the adapter.
// See https://kit.svelte.dev/docs/adapters for more information about adapters.
adapter: adapter()
}
};
export default config;

6
como_css/vite.config.js Normal file
View File

@@ -0,0 +1,6 @@
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
export default defineConfig({
plugins: [sveltekit()]
});