数据可视化大屏
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.

62 line
1.1KB

  1. .chart-card {
  2. display: flex;
  3. flex-direction: column;
  4. align-items: center;
  5. justify-content: space-around; /* 或者使用 space-between 根据您的喜好 */
  6. text-align: center;
  7. }
  8. .chart-text {
  9. margin: 0;
  10. font-size: 24px;
  11. color: rgb(126 221 243 / 100%);
  12. }
  13. .chart-button {
  14. width: 17rem;
  15. height: 5;
  16. margin: 5px;
  17. font-size: 28px;
  18. line-height: 22px;
  19. color: rgb(255 0 0 / 100%);
  20. text-align: center;
  21. background-color: rgb(6 70 120 / 0%);
  22. background-image: url('/assets/dashboardButtonBg.png');
  23. background-repeat: no-repeat;
  24. background-position: center;
  25. background-size: contain; /* 或者可以使用 'contain' 根据你的需要 */
  26. border-width: 0;
  27. }
  28. @media (min-width:0){
  29. .chart-button {font-size:12px;}
  30. }
  31. @media (min-width: 360px){
  32. .chart-button {font-size:14px;}
  33. }
  34. @media (min-width: 920px){
  35. .chart-button {font-size:18px;}
  36. }
  37. @media (min-width: 1920px){
  38. .chart-button {font-size:26px;}
  39. }
  40. .chart-container {
  41. width: 10rem;
  42. height: 10rem;
  43. }