@thenamespace/ens-components 0.2.0 → 0.4.0

package/dist/index.css

@@ -808,6 +808,111 @@ html{
   margin:0;
 }
 
+.ns-textarea__wrapper{
+  display:block;
+  flex:1 1 auto;
+  min-width:0;
+  position:relative;
+  width:100%;
+}
+
+.ns-textarea{
+  background:#fcfcfc;
+  border:1px solid var(--ns-color-border);
+  border-radius:var(--ns-radius-md);
+  box-sizing:border-box;
+  color:var(--ns-color-fg);
+  font-family:var(--ns-font-family);
+  min-height:35px;
+  outline:none;
+  padding:.7rem;
+  resize:vertical;
+  transition:border-color .15s ease,box-shadow .15s ease;
+  width:100%;
+}
+
+.ns-textarea:focus{
+  border-color:var(--ns-color-primary);
+  box-shadow:0 0 0 2px color-mix(in srgb, var(--ns-color-primary) 15%, transparent);
+}
+
+.ns-textarea:disabled{
+  background:color-mix(in srgb, var(--ns-color-bg) 95%, var(--ns-color-muted));
+  color:var(--ns-color-muted);
+  cursor:not-allowed;
+}
+
+.ns-textarea--error{
+  border-color:#ef4444;
+}
+
+.ns-textarea--error:focus{
+  border-color:#ef4444;
+  box-shadow:0 0 0 2px color-mix(in srgb, #ef4444 15%, transparent);
+}
+
+.ns-textarea--sm{
+  font-size:.775rem;
+  min-height:40px;
+}
+
+.ns-textarea--md{
+  font-size:.85rem;
+  min-height:60px;
+}
+
+.ns-textarea--lg{
+  font-size:1rem;
+  min-height:90px;
+}
+
+.ns-textarea__prefix,.ns-textarea__suffix{
+  align-items:flex-start;
+  color:var(--ns-color-muted);
+  display:flex;
+  pointer-events:none;
+  position:absolute;
+  z-index:1;
+}
+
+.ns-textarea__prefix{
+  left:10px;
+  top:10px;
+}
+
+.ns-textarea__suffix{
+  right:10px;
+  top:10px;
+}
+
+.ns-textarea__wrapper:has(.ns-textarea__prefix) .ns-textarea{
+  padding-left:2.5rem;
+}
+
+.ns-textarea__wrapper:has(.ns-textarea__suffix) .ns-textarea{
+  padding-right:2.5rem;
+}
+
+.ns-textarea::-moz-placeholder{
+  color:var(--ns-color-muted);
+  font-size:13px;
+  font-weight:400;
+  opacity:.5;
+}
+
+.ns-textarea::placeholder{
+  color:var(--ns-color-muted);
+  font-size:13px;
+  font-weight:400;
+  opacity:.5;
+}
+
+.ns-textarea{
+  font-weight:400;
+  line-height:1.5;
+}
+
+
 .ns-text{
   font-family:var(--ns-font-family);
   line-height:1.5;
@@ -1668,13 +1773,27 @@ html{
   border-radius:5px;
 }
 
+.ns-text-records .row{
+  display:flex;
+  flex-wrap:wrap;
+}
+
+.ns-text-records .row>[class*=col-]{
+  display:flex;
+}
+
 .ns-text-records .ns-text-suggestion{
+  align-items:center;
   border-radius:5px;
   cursor:pointer;
+  display:flex;
+  flex-direction:column;
+  justify-content:center;
   outline:1px solid var(--ns-color-border);
   padding:5px;
   text-align:center;
   transition:all .25s linear;
+  width:100%;
 }
 
 .ns-text-records .ns-text-suggestion:hover{
@@ -1746,6 +1865,7 @@ html{
 .ns-image-records .ns-image-handle{
   background-color:var(--ns-color-bg-accent);
   border-radius:100%;
+  cursor:pointer;
   height:50px;
   width:50px;
 }
@@ -1759,6 +1879,7 @@ html{
   align-items:center;
   background-color:rgba(0,0,0,.1);
   border-radius:100%;
+  cursor:pointer;
   display:flex;
   height:50px;
   justify-content:center;