ember-assembly/addon/components/ui-tag-input/styles.css

A collection of beautiful UI components built by Goods

.ui-tag-input {
  border: 1px solid var(--ea-colour-border-default);
  border-radius: 3px;
  display: flex;
  flex-wrap: wrap;
  padding: scale(2) scale(2) 0;
  width: 100%;
}

.ui-tag-input.has-error {
  border-color: var(--ea-colour-border-error);
}

.tag {
  background: var(--ea-colour-neutral-n3);
  border: 0;
  border-radius: 3px;
  box-shadow: none;
  flex: 0 0 auto;
  font-size: 14px;
  margin: 0 scale(2) scale(2) 0;
  padding: scale(1) scale(2);
}

.tag:hover {
  background: var(--ea-colour-neutral-n4);
}

.ui-tag-input .input {
  border: 0;
  flex: 1 1 auto;
  padding: scale(1) scale(2);
  height: auto;
  width: auto;
  margin-bottom: scale(2);
}

.ui-tag-input .input::placeholder {
  color: var(--ea-colour-text-muted);
}

.ui-tag-input .input:focus {
  box-shadow: none;
}