package view

templ textLikeField(fieldType string, name string, placeholder string) {
  <input
    type={ fieldType }
    name={ name }
    placeholder={ placeholder }
    class="
      bg-slate-800 focus:bg-slate-700
      text-slate-200 placeholder-slate-500
      p-2
      rounded-md border border-slate-600 border-b-slate-500
      focus:bg-slate-700
      shadow-inner
    "
  />
}

templ TextField(name string, placeholder string) {
  @textLikeField("text", name, placeholder)
}

templ PasswordField(name string, placeholder string) {
  @textLikeField("password", name, placeholder)
}

templ Button(fieldType string, name string, attrs templ.Attributes) {
  <button
    type={ fieldType }
    class="
      text-slate-200
      bg-blue-500 hover:bg-blue-400 active:bg-blue-600
      py-2 px-6
      rounded-full border-t border-t-blue-400
    "
    { attrs... }
  >{ name }</button>
}
 
templ SecondaryButton(fieldType string, name string, attrs templ.Attributes) {
  <button
    type={ fieldType }
    class="
      text-slate-100/50
      bg-transparent hover:bg-slate-300/10 active:bg-slate-300/20
      py-2 px-6
      rounded-full border border-slate-100/50
    "
    { attrs... }
  >{ name }</button>
}