seahub/frontend/src/css/password-input.css

.password .password-icon {
  color: #999;
}

.password .password-icon:hover {
  color: #666;
}

.password-input-container .password-strength-check-container {
  position: absolute;
  top: 50%;
  right: 475px;
  border: 1px solid #ddd;
  border-radius: 3px;
  width: 250px;
  background: #fff;
  transform: translateY(-50%);
}

.password-input-container.mobile .password-strength-check-container {
  top: -77px;
  right: 0;
  z-index: 2;
}

.password-strength-check-container .password-strength-check-box {
  position: relative;
  padding: 12px;
}

.password-strength-check-box .password-strength-value {
  margin-bottom: 4px;
}

.password-strength-check-box .password-strength-value .too-short,
.password-strength-check-box .password-strength-value .weak {
  color: #E43C44;
}

.password-strength-check-box .password-strength-value .medium {
  color: #FFA800;
}

.password-strength-check-box .password-strength-value .strong,
.password-strength-check-box .password-strength-value .very-strong {
  color: #26B20E;
}

.password-strength-check-container .password-strength-check-box::before,
.password-strength-check-container .password-strength-check-box::after {
  display: block;
  position: absolute;
  top: 50%;
  right: -7px;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  content: '';
  transform: translateY(-50%);
}

.password-strength-check-container .password-strength-check-box::before {
  border-left: 7px solid #ddd;
}

.password-strength-check-container .password-strength-check-box::after {
  right: -5.6px;
  border-left: 7px solid #fff;
}

.password-input-container.mobile .password-strength-check-container .password-strength-check-box::before,
.password-input-container.mobile .password-strength-check-container .password-strength-check-box::after {
  top: 100%;
  right: 80%;
  border-right: 7px solid transparent;
  border-left: 7px solid transparent;
  content: '';
  transform: unset;
}

.password-input-container.mobile .password-strength-check-container .password-strength-check-box::before {
  border-top: 7px solid #ddd;
}

.password-input-container.mobile .password-strength-check-container .password-strength-check-box::after {
  top: calc(100% - 1.4px);
  border-top: 7px solid #fff;
}

.password-strength-check-container .progress {
  border-radius: 0;
  background-color: #fff;
}

.password-strength-check-container .progress .progress-bar {
  margin-right: 2px;
  height: 4px;
}

.password-strength-check-container .progress .default {
  background-color: #DBDBDB;
}

.password-strength-check-container .progress .too-short,
.password-strength-check-container .progress .weak {
  background-color: #E43C44;
}

.password-strength-check-container .progress .medium {
  background-color: #FFA800;
}

.password-strength-check-container .progress .strong,
.password-strength-check-container .progress .very-strong {
  background-color:#26B20E;
}

.password-strength-check-container .password-strength-description {
  font-size: 12px;
  color: #666;
}