Appwrite/console
1
0
Fork 0
mirror of https://github.com/appwrite/console.git synced 2026-06-06 19:27:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: update classes and imports to use pink

Browse Source
This commit is contained in:
Arman
2023-01-31 18:12:13 +01:00
parent 55a7094c45
commit 5a98b5eaf2
22 changed files with 99 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+31 -32
View File
@@ -9,9 +9,8 @@
"version": "0.0.1",
"dependencies": {
"@analytics/google-analytics": "^1.0.5",
"@appwrite.io/pink": "^0.0.2",
"@aw-labs/appwrite-console": "^13.1.0",
"@aw-labs/icons": "0.0.0-82",
"@aw-labs/ui": "0.0.0-82",
"@popperjs/core": "^2.11.6",
"@sentry/svelte": "^7.19.0",
"@sentry/tracing": "^7.19.0",
@@ -144,6 +143,21 @@
"resolved": "https://registry.npmjs.org/@analytics/type-utils/-/type-utils-0.6.0.tgz",
"integrity": "sha512-1Yw7u/COtxx06BfwlI+kVhsa/upKYzmCNrT4c8QDeCY2KMYlnijkUjtHiPU08HxyTIVB5j6d75O0YWVIHwQS8g=="
},
"node_modules/@appwrite.io/pink": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/@appwrite.io/pink/-/pink-0.0.2.tgz",
"integrity": "sha512-fLrA+QWLmxXjK9tIw55S3jHHPhOzW8vAfuPgx0PQGgwt0N7mObNrx6WK5VvdEhJ2Z7fdfgPlNpu5sqoDolpetQ==",
"dependencies": {
"@appwrite.io/pink-icons": "*",
"normalize.css": "^8.0.1",
"the-new-css-reset": "^1.7.3"
}
},
"node_modules/@appwrite.io/pink-icons": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/@appwrite.io/pink-icons/-/pink-icons-0.0.2.tgz",
"integrity": "sha512-yv8IpWzgRj+C3fMbG0PwweIKUDBFz+GQZPpsiqdQEBNuMhNSwWSkYqTj7gumO3GUiIcMl4xhSGXY+vE2itswRg=="
},
"node_modules/@aw-labs/appwrite-console": {
"version": "13.1.0",
"resolved": "https://registry.npmjs.org/@aw-labs/appwrite-console/-/appwrite-console-13.1.0.tgz",
@@ -153,21 +167,6 @@
"isomorphic-form-data": "2.0.0"
}
},
"node_modules/@aw-labs/icons": {
"version": "0.0.0-82",
"resolved": "https://registry.npmjs.org/@aw-labs/icons/-/icons-0.0.0-82.tgz",
"integrity": "sha512-TQ3abZGBjisd4WpeBVSUihY98drljdlcdw++z8icNpQVYohmUejRHU59mhmIfXCkhpA1s0tW+5xEMp0WmLNp9Q=="
},
"node_modules/@aw-labs/ui": {
"version": "0.0.0-82",
"resolved": "https://registry.npmjs.org/@aw-labs/ui/-/ui-0.0.0-82.tgz",
"integrity": "sha512-zZDTP117uxMrwzAacOcpSXI77FMFcfv6+Da1R5sDWoqxhvZ0Wyx0Z6cn3dakV0M3zJfYZQ49LmSnU/5wqHPc7A==",
"dependencies": {
"@aw-labs/icons": "*",
"normalize.css": "^8.0.1",
"the-new-css-reset": "^1.7.3"
}
},
"node_modules/@babel/code-frame": {
"version": "7.16.7",
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.16.7.tgz",
@@ -7739,6 +7738,21 @@
"resolved": "https://registry.npmjs.org/@analytics/type-utils/-/type-utils-0.6.0.tgz",
"integrity": "sha512-1Yw7u/COtxx06BfwlI+kVhsa/upKYzmCNrT4c8QDeCY2KMYlnijkUjtHiPU08HxyTIVB5j6d75O0YWVIHwQS8g=="
},
"@appwrite.io/pink": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/@appwrite.io/pink/-/pink-0.0.2.tgz",
"integrity": "sha512-fLrA+QWLmxXjK9tIw55S3jHHPhOzW8vAfuPgx0PQGgwt0N7mObNrx6WK5VvdEhJ2Z7fdfgPlNpu5sqoDolpetQ==",
"requires": {
"@appwrite.io/pink-icons": "*",
"normalize.css": "^8.0.1",
"the-new-css-reset": "^1.7.3"
}
},
"@appwrite.io/pink-icons": {
"version": "0.0.2",
"resolved": "https://registry.npmjs.org/@appwrite.io/pink-icons/-/pink-icons-0.0.2.tgz",
"integrity": "sha512-yv8IpWzgRj+C3fMbG0PwweIKUDBFz+GQZPpsiqdQEBNuMhNSwWSkYqTj7gumO3GUiIcMl4xhSGXY+vE2itswRg=="
},
"@aw-labs/appwrite-console": {
"version": "13.1.0",
"resolved": "https://registry.npmjs.org/@aw-labs/appwrite-console/-/appwrite-console-13.1.0.tgz",
@@ -7748,21 +7762,6 @@
"isomorphic-form-data": "2.0.0"
}
},
"@aw-labs/icons": {
"version": "0.0.0-82",
"resolved": "https://registry.npmjs.org/@aw-labs/icons/-/icons-0.0.0-82.tgz",
"integrity": "sha512-TQ3abZGBjisd4WpeBVSUihY98drljdlcdw++z8icNpQVYohmUejRHU59mhmIfXCkhpA1s0tW+5xEMp0WmLNp9Q=="
},
"@aw-labs/ui": {
"version": "0.0.0-82",
"resolved": "https://registry.npmjs.org/@aw-labs/ui/-/ui-0.0.0-82.tgz",
"integrity": "sha512-zZDTP117uxMrwzAacOcpSXI77FMFcfv6+Da1R5sDWoqxhvZ0Wyx0Z6cn3dakV0M3zJfYZQ49LmSnU/5wqHPc7A==",
"requires": {
"@aw-labs/icons": "*",
"normalize.css": "^8.0.1",
"the-new-css-reset": "^1.7.3"
}
},
"@babel/code-frame": {
"version": "7.16.7",
"resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.16.7.tgz",
package.json
+2 -3
View File
@@ -20,13 +20,12 @@
},
"dependencies": {
"@analytics/google-analytics": "^1.0.5",
"analytics": "^0.8.1",
"@appwrite.io/pink": "^0.0.2",
"@aw-labs/appwrite-console": "^13.1.0",
"@aw-labs/icons": "0.0.0-82",
"@aw-labs/ui": "0.0.0-82",
"@popperjs/core": "^2.11.6",
"@sentry/svelte": "^7.19.0",
"@sentry/tracing": "^7.19.0",
"analytics": "^0.8.1",
"echarts": "^5.4.0",
"pretty-bytes": "^6.0.0",
"prismjs": "^1.29.0",
src/lib/components/alert.svelte
+6 -5
View File
@@ -19,7 +19,8 @@
{#if dismissible}
<button
type="button"
class="x-button"
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="close alert box"
on:click={() => dispatch('dismiss')}>
<span class="icon-x" aria-hidden="true" />
@@ -31,15 +32,15 @@
class:icon-exclamation={type === 'warning'}
class:icon-exclamation-circle={type === 'error'}
aria-hidden="true" />
<div class="content">
<div class="alert-content">
{#if $$slots.title}
<h6 class="title">
<h6 class="alert-title">
<slot name="title" />
</h6>
{/if}
<p class="message"><slot /></p>
<p class="alert-message"><slot /></p>
{#if buttons?.length}
<div class="buttons u-flex">
<div class="alert-buttons u-flex">
{#each buttons as button}
<button class="button is-text" on:click={button.method}>
<span class="text">{button.name}</span>
src/lib/components/eventModal.svelte
+2 -2
View File
@@ -285,7 +285,7 @@
{:else}
{#each Array.from(eventString.values()) as route, i}
<button
class:u-opacity-0-5={helper !== route.description}
class:u-opacity-50={helper !== route.description}
on:mouseenter={() => {
helper = route.description;
}}
@@ -294,7 +294,7 @@
}}>
{route.value}
</button>
<span class="u-opacity-0-5">
<span class="u-opacity-50">
{i + 1 < eventString?.size ? '.' : ''}
</span>
{/each}
src/lib/components/feedbackGeneral.svelte
+2 -1
View File
@@ -34,7 +34,8 @@
<h4 class="body-text-1">How can we improve?</h4>
<button
type="button"
class="x-button u-margin-inline-start-auto"
class="button is-text is-only-icon u-margin-inline-start-auto"
style="--button-size:1.5rem;"
aria-label="Close Modal"
title="Close Modal"
on:click={() => (show = false)}>
src/lib/components/feedbackNPS.svelte
+2 -1
View File
@@ -37,7 +37,8 @@
<h4 class="body-text-1">How are we doing?</h4>
<button
type="button"
class="x-button u-margin-inline-start-auto"
class="button is-text is-only-icon u-margin-inline-start-auto"
style="--button-size:1.5rem;"
aria-label="Close Modal"
title="Close Modal"
on:click={() => (show = false)}>
src/lib/components/innerModal.svelte
+2 -1
View File
@@ -14,7 +14,8 @@
</h4>
<button
type="button"
class="x-button"
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="Close"
title="Close"
on:click={() => (show = false)}>
src/lib/components/modal.svelte
+2 -1
View File
@@ -91,7 +91,8 @@
{#if closable}
<button
type="button"
class="x-button"
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="Close Modal"
title="Close Modal"
on:click={() =>
src/lib/components/searchQuery.svelte
+5 -1
View File
@@ -63,7 +63,11 @@
bind:value={search} />
<span class="icon-search" aria-hidden="true" />
{#if isWithEndButton && search}
<button class="x-button" aria-label="Clear search" on:click={() => (search = '')}>
<button
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="Clear search"
on:click={() => (search = '')}>
<span class="icon-x" aria-hidden="true" />
</button>
{/if}
src/lib/components/uploadBox.svelte
+4 -4
View File
@@ -20,7 +20,7 @@
<span class="amount">{$uploader.files.length}</span>
</h4>
<button
class="icon-button"
class="upload-box-button"
class:is-open={!$uploader.isCollapsed}
aria-label="toggle upload box"
on:click={() => uploader.toggle()}>
@@ -28,7 +28,7 @@
</button>
<button
on:click={() => uploader.reset()}
class="icon-button"
class="upload-box-button"
aria-label="close upload box">
<span class="icon-x" aria-hidden="true" />
</button>
@@ -52,7 +52,7 @@
<label for={file.name} class="file-name u-trim">{file.name}</label>
<button
class="icon-button"
class="upload-box-button"
aria-label="Failed"
on:mouseenter={() => (hovering = true)}
on:mouseleave={() => (hovering = false)}
@@ -74,7 +74,7 @@
<label for={file.name} class="file-name u-trim">{file.name}</label>
<Pill danger>Failed</Pill>
<button
class="icon-button"
class="upload-box-button"
aria-label="Failed"
on:click|preventDefault={() => uploader.removeFromQueue(file.$id)}>
<span class="icon-x" />
src/lib/elements/forms/helper.svelte
+4 -4
View File
@@ -4,10 +4,10 @@
<p
class="helper u-margin-block-start-12"
class:u-info={type === 'info'}
class:u-error={type === 'error'}
class:u-success={type === 'success'}
class:u-warning={type === 'warning'}>
class:u-color-text-info={type === 'info'}
class:u-color-text-danger={type === 'error'}
class:u-color-text-success={type === 'success'}
class:u-color-text-warning={type === 'warning'}>
{#if type}
<span
class:icon-info={type === 'info' || type === 'neutral'}
src/lib/elements/forms/inputFile.svelte
+2 -1
View File
@@ -68,7 +68,8 @@
<button
on:click={() => (files = null)}
type="button"
class="x-button"
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="remove file"
title="Remove file">
<span class="icon-x" aria-hidden="true" />
src/lib/elements/forms/inputSearch.svelte
+5 -1
View File
@@ -52,7 +52,11 @@
on:input={valueChange} />
<span class="icon-search" aria-hidden="true" />
{#if isWithEndButton && value}
<button class="x-button" aria-label="Clear search" on:click={() => (value = '')}>
<button
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="Clear search"
on:click={() => (value = '')}>
<span class="icon-x" aria-hidden="true" />
</button>
{/if}
src/lib/layout/logs.svelte
+5 -1
View File
@@ -50,7 +50,11 @@
<section class="cover-frame">
<header class="cover-frame-header u-flex u-gap-16 u-main-space-between u-cross-center">
<h1 class="body-text-1" name="title">Function ID: {$log.func.$id}</h1>
<button on:click={() => ($log.show = false)} class="x-button" aria-label="close popup">
<button
on:click={() => ($log.show = false)}
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="close popup">
<span class="icon-x" aria-hidden="true" />
</button>
</header>
src/lib/layout/notification.svelte
+6 -2
View File
@@ -15,7 +15,11 @@
class:is-warning={type === 'warning'}
class:is-danger={type === 'error'}
class:is-info={type === 'info'}>
<button class="x-button" aria-label="close alert" on:click={() => dispatch('dismiss')}>
<button
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="close alert"
on:click={() => dispatch('dismiss')}>
<span class="icon-x" aria-hidden="true" />
</button>
<div class="alert-sticky-image">
@@ -33,7 +37,7 @@
<p><slot /></p>
</div>
{#if buttons}
<div class="buttons u-flex">
<div class="alert-sticky-buttons u-flex">
{#each buttons as button}
<button class="button is-text is-small" on:click={button.method}>
<span class="text">{button.name}</span>
src/lib/layout/unauthenticated.svelte
+5 -5
View File
@@ -33,9 +33,9 @@
<div class="u-margin-block-start-auto" />
<div class="u-margin-block-start-auto is-no-mobile" />
<div class="u-margin-block-start-auto is-not-mobile" />
<div
class="container u-margin-block-start-20 is-no-mobile"
class="container u-margin-block-start-20 is-not-mobile"
style="--p-container-max-size: var(--container-size-large);">
{#if $app.themeInUse === 'dark'}
<img src={LoginDark} alt="" class="u-only-dark" />
@@ -46,13 +46,13 @@
<div class="u-margin-block-start-auto" />
<div class="u-margin-block-start-auto is-no-mobile" />
<div class="u-margin-block-start-auto is-not-mobile" />
<div
class="container u-text-color-light-gray is-no-mobile"
class="container u-color-text-gray is-not-mobile"
style="--p-container-max-size:var(--container-size-small); --p-container-padding-inline:1rem;">
<p>Integrate with your favourite technologies</p>
<ul
class="u-flex u-main-center u-flex-wrap u-gap-16 u-margin-block-start-32 u-line-height-1 u-opacity-0-5">
class="u-flex u-main-center u-flex-wrap u-gap-16 u-margin-block-start-32 u-line-height-1 u-opacity-50">
{#each technologies as tech}
<li>
<img
src/lib/layout/wizard.svelte
+5 -1
View File
@@ -88,7 +88,11 @@
<div class="body-text-1">{title}</div>
<slot name="header" />
<button class="x-button" aria-label="close wizard" on:click={handleExit}>
<button
class="button is-text is-only-icon"
style="--button-size:1.5rem;"
aria-label="close wizard"
on:click={handleExit}>
<span class="icon-x" aria-hidden="true" />
</button>
</header>
src/routes/+layout.ts
+2 -1
View File
@@ -1,4 +1,5 @@
import '@aw-labs/ui/src/_index.scss';
import '@appwrite.io/pink';
import '@appwrite.io/pink-icons';
import 'tippy.js/dist/tippy.css';
import { sdkForConsole } from '$lib/stores/sdk';
import { redirect } from '@sveltejs/kit';
src/routes/console/project-[project]/overview/onboard.svelte
+1 -1
View File
@@ -50,7 +50,7 @@
<h2 class="heading-level-5">Getting Started Guide</h2>
<p class="u-line-height-1-5">Let's get your project up and running</p>
</div>
<div class="grid-1-2-col-2 u-flex u-main-end u-cross-end is-no-mobile">
<div class="grid-1-2-col-2 u-flex u-main-end u-cross-end is-not-mobile">
<img src={onBoardIntro} alt="" class="card-header-image" />
</div>
</header>
src/routes/console/project-[project]/settings/webhooks/[webhook]/updateSecurity.svelte
+2 -2
View File
@@ -85,8 +85,8 @@
id="Security"
label="Certificate verification (SSL/TLS)"
bind:value={security}>
<span class="u-error">Warning:</span> Untrusted or self-signed certificates may
not be secure.
<span class="u-color-text-danger">Warning:</span> Untrusted or self-signed
certificates may not be secure.
<a
href="https://appwrite.io/docs/custom-domains#enjoySSLCert"
target="_blank"
src/routes/console/project-[project]/settings/webhooks/wizard/step3.svelte
+2 -2
View File
@@ -32,8 +32,8 @@
id="Security"
label="Certificate verification (SSL/TLS)"
bind:value={$createWebhook.security}>
<span class="u-error">Warning:</span> Untrusted or self-signed certificates may not be
secure.
<span class="u-color-text-danger">Warning:</span> Untrusted or self-signed certificates
may not be secure.
<a
href="https://appwrite.io/docs/custom-domains#enjoySSLCert"
target="_blank"
src/routes/console/project-[project]/storage/[[page]]/+page.svelte
+2 -2
View File
@@ -54,7 +54,7 @@
<svelte:fragment slot="icons">
<li>
<span
class:u-opacity-0-2={!bucket.encryption}
class:u-opacity-20={!bucket.encryption}
class="icon-lock-closed"
aria-hidden="true"
use:tooltip={{
@@ -65,7 +65,7 @@
</li>
<li>
<span
class:u-opacity-0-2={!bucket.antivirus}
class:u-opacity-20={!bucket.antivirus}
class="icon-shield-check"
aria-hidden="true"
use:tooltip={{