Repositorio del curso CCOM4030 el semestre B91 del proyecto Artesanías con el Instituto de Cultura

textarea.css 1.8KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. :root {
  2. --textarea-color: var(--input-text-color);
  3. --textarea-border: 1px solid var(--input-border-color);
  4. --textarea-padding: 5px 5px 5px 5px;
  5. --textarea-box-shadow: none;
  6. --textarea-border-radius: 4px;
  7. }
  8. /*~
  9. name: Textarea
  10. category: Textarea
  11. markup: |
  12. <textarea class="textarea" rows="3" placeholder="Textarea"></textarea>
  13. */
  14. .textarea {
  15. @apply(--reset-box-model);
  16. @apply(--reset-base);
  17. @apply(--reset-font);
  18. vertical-align: top;
  19. resize: none;
  20. outline: none;
  21. padding: var(--textarea-padding);
  22. font-size: var(--text-input-font-size);
  23. font-weight: var(--font-weight);
  24. border-radius: var(--textarea-border-radius);
  25. border: var(--textarea-border);
  26. background-color: var(--input-bg-color);
  27. color: var(--textarea-color);
  28. letter-spacing: 0;
  29. box-shadow: var(--textarea-box-shadow);
  30. appearance: none;
  31. width: auto;
  32. }
  33. .textarea:disabled {
  34. @apply(--disabled);
  35. }
  36. .textarea::placeholder {
  37. color: var(--input-placeholder-color);
  38. }
  39. /*~
  40. name: Textarea Transparent
  41. category: Textarea
  42. markup: |
  43. <textarea class="textarea textarea--transparent" rows="3" placeholder="Textarea"></textarea>
  44. */
  45. .textarea--transparent {
  46. @apply(--reset-box-model);
  47. @apply(--reset-base);
  48. @apply(--reset-font);
  49. vertical-align: top;
  50. resize: none;
  51. outline: none;
  52. padding: var(--textarea-padding);
  53. padding-left: 0;
  54. padding-right: 0;
  55. font-size: var(--text-input-font-size);
  56. font-weight: var(--font-weight);
  57. border-radius: var(--textarea-border-radius);
  58. border: none;
  59. background-color: transparent;
  60. color: var(--textarea-color);
  61. letter-spacing: 0;
  62. box-shadow: var(--textarea-box-shadow);
  63. appearance: none;
  64. width: auto;
  65. }
  66. .textarea--transparent:disabled {
  67. @apply(--disabled);
  68. }
  69. .textarea--transparent::placeholder {
  70. color: var(--input-placeholder-color);
  71. }