@opensig/opendesign/lib/_components/inner-input/style/index.css

<p align="center"><img src="../docs/public/opendesign-logo-light.png"/></p> <h1 align="center">opendesign</h1> <p align="center">一个 Vue 3 组件库</p> <p align="center"><b>皮肤可定制，使用 TypeScript</b></p>

.o-i-input {
  --ii-placeholder-color: var(--o-color-info4);
}

.o-i-input {
  display: flex;
  width: 100%;
}

.o-ii-input {
  outline: none;
  border: none;
  color: inherit;
  cursor: inherit;
  background-color: transparent;
  display: inline-flex;
  padding: 0;
  line-height: inherit;
  height: 100%;
  width: 100%;
  font-size: inherit;
  min-width: 20px;
}
.o-ii-input::-webkit-input-placeholder {
  color: var(--ii-placeholder-color);
}

.o-ii-suffix {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  position: relative;
  margin-left: 4px;
}

.o-ii-prefix {
  display: flex;
  align-items: center;
  margin-right: 4px;
}

.o-ii-suffix-icon {
  display: flex;
  transition: all var(--o-duration-m1) var(--o-easing-standard-out);
}

.o-ii-clear {
  visibility: hidden;
  flex-shrink: 0;
  opacity: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--icon-color);
  font-size: var(--icon-size);
}
.o-ii-clear {
  overflow: hidden;
}
.o-ii-clear svg {
  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
}
@media (hover: hover) {
  .o-ii-clear:hover svg {
    transform: rotate(180deg);
  }
}
@media (hover: hover) {
  .o-ii-clear:hover {
    color: var(--icon-color-hover);
  }
  .o-ii-suffix-icon + .o-ii-clear {
    position: absolute;
  }
}

@media (hover: hover) {
  .o-ii-clearable:hover .o-ii-suffix-icon {
    visibility: hidden;
    opacity: 0;
    transition: none;
  }
  .o-ii-clearable:hover .o-ii-clear {
    visibility: visible;
    opacity: 1;
    transition: all var(--o-duration-m1) var(--o-easing-standard-in);
  }
}
@media (hover: none) {
  .o-ii-clearable .o-ii-suffix-icon,
  .o-ii-clearable .o-ii-clear {
    visibility: visible;
    opacity: 1;
  }
}

.o-ii-eye {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: var(--icon-size);
  color: var(--icon-color);
  margin-left: 4px;
}
@media (hover: hover) {
  .o-ii-eye:hover {
    color: var(--icon-color-hover);
  }
}
.o-ii-eye :first-child {
  margin-left: 0;
}
.o-ii-disabled .o-ii-eye, .o-ii-readonly .o-ii-eye {
  color: var(--icon-color-disabled);
}

.o-ii-password {
  font-family: Arial, "Helvetica Neue", Helvetica, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}