You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

_box.scss 1.3KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. /*
  2. * DreamTime | (C) 2019 by Ivan Bravo Bravo <ivan@dreamnet.tech>
  3. *
  4. * This program is free software: you can redistribute it and/or modify
  5. * it under the terms of the GNU General Public License 3.0 as published by
  6. * the Free Software Foundation.
  7. *
  8. * You should have received a copy of the GNU General Public License
  9. * along with this program. If not, see <https://www.gnu.org/licenses/>.
  10. */
  11. .box {
  12. @apply bg-dark-500 rounded px-5 py-3 shadow mb-5;
  13. &.is-transparent {
  14. @apply bg-transparent rounded-none shadow-none;
  15. }
  16. .box-title {
  17. @apply font-bold text-generic-300 text-lg mb-2;
  18. }
  19. }
  20. .box-section {
  21. @apply px-0 py-1;
  22. .box-section-item {
  23. @apply flex py-3 px-5;
  24. &:not(:last-child) {
  25. @apply border-b border-dark-400;
  26. }
  27. .item-icon {
  28. @apply mr-4 flex items-center justify-center text-2xl;
  29. width: 42px;
  30. img {
  31. @apply rounded-full;
  32. }
  33. }
  34. .item-text {
  35. @apply flex-1 flex flex-col justify-center;
  36. .item-label {
  37. @apply text-generic-300 font-semibold;
  38. transition: all 0.1s ease-in-out;
  39. }
  40. .item-description {
  41. @apply text-sm;
  42. a {
  43. @apply underline;
  44. }
  45. }
  46. }
  47. .item-extra {
  48. @apply ml-4 flex items-center justify-center;
  49. max-width: 200px;
  50. }
  51. }
  52. }