@elenajs/components 0.3.0 → 0.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/bundle.css +1 -1
  2. package/dist/button.css +4 -0
  3. package/dist/stack.css +1 -0
  4. package/package.json +2 -2
package/dist/bundle.css CHANGED
@@ -1 +1 @@
1
- elena-button{--elena-button-bg:transparent;--elena-button-text:#333;--elena-button-border:#f19c77;--elena-button-radius:10rem;--elena-button-font:sans-serif;all:unset;display:inline-block}:is(elena-button:not(.elena-hydrated),.elena-button){all:unset;-webkit-appearance:none;appearance:none;display:inline-flex;-webkit-user-select:none;user-select:none;background:var(--elena-button-bg);color:var(--elena-button-text);border-radius:var(--elena-button-radius);border:2px solid var(--elena-button-border);font-family:var(--elena-button-font);font-weight:700;padding:0.75rem 1.25rem;cursor:pointer}elena-button:hover{opacity:0.8}elena-button:active{opacity:0.6}elena-button:focus-within{box-shadow:0 0 0 3px red}elena-button[disabled]{--elena-button-bg:#2b1c15;--elena-button-text:#fff;--elena-button-border:#2b1c15;opacity:0.3;pointer-events:none}elena-button[variant="primary"]{--elena-button-bg:#f19c77;--elena-button-text:#2b1c15}elena-button[variant="danger"]{--elena-button-text:red;--elena-button-border:red}elena-input{--elena-input-bg:transparent;--elena-input-text:#333;--elena-input-border:#333;--elena-input-radius:4px;--elena-input-font:sans-serif;all:unset;min-inline-size:300px;box-sizing:border-box;display:inline-block;flex-direction:column;gap:5px}:is(elena-input:not(.elena-hydrated),.elena-input){-webkit-appearance:none;appearance:none;display:inline-flex;-webkit-user-select:none;user-select:none;line-height:1;block-size:3rem;background:var(--elena-input-bg);color:var(--elena-input-text);border-radius:var(--elena-input-radius);border:1px solid var(--elena-input-border);font-family:var(--elena-input-font);font-weight:700;padding:0.75rem 1.25rem;cursor:text;position:relative}elena-input:not(.elena-hydrated){margin-block-start:1.82rem}elena-input:not(.elena-hydrated)::before{content:attr(label);position:absolute;font-weight:700;top:-1.78rem;left:-1px;display:block;inline-size:100%}elena-input:not(.elena-hydrated)::after{content:attr(placeholder);display:flex;align-items:center;block-size:100%;color:#aaa}elena-input .elena-input{font-size:100%;box-sizing:border-box;inline-size:100%}elena-input label{font-weight:700;display:block;block-size:1.5rem;margin:0;inline-size:100%}.elena-input-container{inline-size:100%}elena-input input:focus{box-shadow:0 0 0 1px red}elena-input input::placeholder{opacity:1;color:#aaa}elena-input[error]{--elena-input-border:red}elena-input .elena-error{color:red}elena-stack{display:flex;justify-content:flex-start;flex-flow:column wrap;gap:0.5rem}elena-stack[direction="row"]{flex-direction:row}
1
+ elena-button{--elena-button-bg:transparent;--elena-button-text:#333;--elena-button-border:#f19c77;--elena-button-radius:10rem;--elena-button-font:sans-serif;all:unset;display:inline-block}:is(elena-button:not(.elena-hydrated),.elena-button){all:unset;-webkit-appearance:none;appearance:none;display:inline-flex;-webkit-user-select:none;user-select:none;background:var(--elena-button-bg);color:var(--elena-button-text);border-radius:var(--elena-button-radius);border:2px solid var(--elena-button-border);font-family:var(--elena-button-font);font-weight:700;padding:0.75rem 1.25rem;cursor:pointer}:is(elena-button:not(.elena-hydrated))::after{content:attr(label)}elena-button:hover{opacity:0.8}elena-button:active{opacity:0.6}elena-button:focus-within{box-shadow:0 0 0 3px red}elena-button[disabled]{--elena-button-bg:#2b1c15;--elena-button-text:#fff;--elena-button-border:#2b1c15;opacity:0.3;pointer-events:none}elena-button[variant="primary"]{--elena-button-bg:#f19c77;--elena-button-text:#2b1c15}elena-button[variant="danger"]{--elena-button-text:red;--elena-button-border:red}elena-input{--elena-input-bg:transparent;--elena-input-text:#333;--elena-input-border:#333;--elena-input-radius:4px;--elena-input-font:sans-serif;all:unset;min-inline-size:300px;box-sizing:border-box;display:inline-block;flex-direction:column;gap:5px}:is(elena-input:not(.elena-hydrated),.elena-input){-webkit-appearance:none;appearance:none;display:inline-flex;-webkit-user-select:none;user-select:none;line-height:1;block-size:3rem;background:var(--elena-input-bg);color:var(--elena-input-text);border-radius:var(--elena-input-radius);border:1px solid var(--elena-input-border);font-family:var(--elena-input-font);font-weight:700;padding:0.75rem 1.25rem;cursor:text;position:relative}elena-input:not(.elena-hydrated){margin-block-start:1.82rem}elena-input:not(.elena-hydrated)::before{content:attr(label);position:absolute;font-weight:700;top:-1.78rem;left:-1px;display:block;inline-size:100%}elena-input:not(.elena-hydrated)::after{content:attr(placeholder);display:flex;align-items:center;block-size:100%;color:#aaa}elena-input .elena-input{font-size:100%;box-sizing:border-box;inline-size:100%}elena-input label{font-weight:700;display:block;block-size:1.5rem;margin:0;inline-size:100%}.elena-input-container{inline-size:100%}elena-input input:focus{box-shadow:0 0 0 1px red}elena-input input::placeholder{opacity:1;color:#aaa}elena-input[error]{--elena-input-border:red}elena-input .elena-error{color:red}elena-stack{display:flex;justify-content:flex-start;align-items:flex-start;flex-flow:column wrap;gap:0.5rem}elena-stack[direction="row"]{flex-direction:row}
package/dist/button.css CHANGED
@@ -37,6 +37,10 @@ elena-button {
37
37
  cursor: pointer;
38
38
  }
39
39
 
40
+ :is(elena-button:not(.elena-hydrated))::after {
41
+ content: attr(label);
42
+ }
43
+
40
44
  /* ---------------------------------------------
41
45
  / EXAMPLE STATES
42
46
  / --------------------------------------------- */
package/dist/stack.css CHANGED
@@ -5,6 +5,7 @@
5
5
  elena-stack {
6
6
  display: flex;
7
7
  justify-content: flex-start;
8
+ align-items: flex-start;
8
9
  flex-flow: column wrap;
9
10
  gap: 0.5rem;
10
11
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elenajs/components",
3
- "version": "0.3.0",
3
+ "version": "0.4.1",
4
4
  "description": "Elena component library demonstrating how to build progressive web components.",
5
5
  "author": "Elena <hi@elenajs.com>",
6
6
  "homepage": "https://elenajs.com/",
@@ -39,5 +39,5 @@
39
39
  "@elenajs/bundler": "^0.0.8",
40
40
  "@web/dev-server": "0.4.6"
41
41
  },
42
- "gitHead": "26b5fcaa2941ef54df4f3575571b5528b6dc092a"
42
+ "gitHead": "c6901f8c7538d0739631534c774741a357995f44"
43
43
  }