Page.scss 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. @import './adaptivefont.scss';
  2. .page {
  3. display: flex;
  4. height: 89vh;
  5. overflow: none;
  6. &__window {
  7. width: 80%;
  8. height: inherit;
  9. overflow: auto;
  10. }
  11. }
  12. .startpage {
  13. &__ulwrapper {
  14. width: 50%;
  15. margin: 0 auto;
  16. ul {
  17. text-align: start;
  18. small {
  19. color: whitesmoke;
  20. }
  21. }
  22. }
  23. }
  24. .playlist {
  25. background-color: #1e1d45;
  26. height: fit-content;
  27. width: 90%;
  28. margin: 0 auto;
  29. padding: 1% 2%;
  30. &__track {
  31. display: flex;
  32. align-items: center;
  33. background-color: #2a3da941;
  34. margin: 10px;
  35. padding: 2% 0;
  36. color: #83d6f6;
  37. box-shadow: 0 0 5px black;
  38. button {
  39. display: block;
  40. background-color: #1e1d45;
  41. border-style: solid;
  42. font-size: x-large;
  43. padding: 1%;
  44. margin: 0 5%;
  45. }
  46. small,
  47. strong {
  48. display: block;
  49. }
  50. .artist {
  51. @include adaptive-font(16, 12);
  52. font-weight: 700;
  53. text-align: start;
  54. }
  55. .album {
  56. @include adaptive-font(14, 10);
  57. font-weight: 400;
  58. text-align: start;
  59. }
  60. .title {
  61. @include adaptive-font(18, 13);
  62. //font-size: large;
  63. font-weight: 700;
  64. text-align: start;
  65. }
  66. }
  67. }