style.css 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. window {
  2. font-family: monospace;
  3. font-size: 14pt;
  4. color: #cdd6f4; /* text */
  5. background-color: rgba(30, 30, 46, 0.5);
  6. }
  7. button {
  8. background-repeat: no-repeat;
  9. background-position: center;
  10. background-size: 25%;
  11. border: none;
  12. background-color: rgba(30, 30, 46, 0);
  13. margin: 5px;
  14. transition: box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  15. }
  16. button:hover {
  17. background-color: rgba(49, 50, 68, 0.1);
  18. }
  19. button:focus {
  20. background-color: #cba6f7;
  21. color: #1e1e2e;
  22. }
  23. #lock {
  24. background-image: image(url("./lock.png"));
  25. }
  26. #lock:focus {
  27. background-image: image(url("./lock-hover.png"));
  28. }
  29. #logout {
  30. background-image: image(url("./logout.png"));
  31. }
  32. #logout:focus {
  33. background-image: image(url("./logout-hover.png"));
  34. }
  35. #suspend {
  36. background-image: image(url("./sleep.png"));
  37. }
  38. #suspend:focus {
  39. background-image: image(url("./sleep-hover.png"));
  40. }
  41. #shutdown {
  42. background-image: image(url("./power.png"));
  43. }
  44. #shutdown:focus {
  45. background-image: image(url("./power-hover.png"));
  46. }
  47. #reboot {
  48. background-image: image(url("./restart.png"));
  49. }
  50. #reboot:focus {
  51. background-image: image(url("./restart-hover.png"));
  52. }