page-updating.component_20241228141111.scss 1.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. /* 设置页面背景色 */
  2. ion-content {
  3. --background: #ffffff; /* 白色背景 */
  4. --background: url('https://nova-cloud.obs.cn-south-1.myhuaweicloud.com/storage/aigc/imagine/4RHC2Jhp2l-0.png') no-repeat fixed!important;
  5. --background-size: cover;
  6. }
  7. ion-card {
  8. margin: 10px; /* 卡片之间的间距 */
  9. border-radius: 10px; /* 圆角效果 */
  10. box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 阴影效果 */
  11. }
  12. ion-card-title {
  13. font-weight:bold;
  14. }
  15. .card-content-with-button {
  16. display: flex;
  17. justify-content: space-between;
  18. align-items: center;
  19. }
  20. .content-center {
  21. display: flex;
  22. justify-content: center;
  23. align-items: center;
  24. height: 100%;
  25. }
  26. .expect-message {
  27. font-size: 2rem; /* 放大字体 */
  28. color: gray; /* 灰色文字 */
  29. opacity: 0.7; /* 透明度 */
  30. }
  31. .content-section {
  32. flex-grow: 1;
  33. }
  34. .button-section {
  35. margin-left: 10px;
  36. }
  37. /* 确保按钮文本正常横排 */
  38. ion-button {
  39. white-space: nowrap;
  40. }
  41. /* 设置列表项的样式 */
  42. ion-item {
  43. margin: 5px 0; /* 列表项之间的间距 */
  44. }
  45. ion-title {
  46. font-size: 24px; /* 增大字体大小 */
  47. font-weight: bold; /* 加粗 */
  48. }
  49. /* 设置卡片的样式 */
  50. ion-list {
  51. margin: 10px; /* 卡片之间的间距 */
  52. border-radius: 10px; /* 圆角效果 */
  53. box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 阴影效果 */
  54. }
  55. ion-button {
  56. font-size: 15px; /* 增大字体大小 */
  57. margin-top: 8px; /* 上间距,仅在需要时添加 */
  58. text-transform: none; /* 按钮文字不变形 */
  59. height: 35px;
  60. }
  61. /* 设置列表项的样式 */
  62. ion-item {
  63. margin: 5px 0; /* 列表项之间的间距 */
  64. }
  65. /* 设置按钮的样式(如果按钮不在顶部方框内) */
  66. ion-toolbar {
  67. margin: auto;
  68. }
  69. .title-text{
  70. position: absolute;
  71. display: flex;
  72. left: 105px;
  73. margin: auto;
  74. top: 10px;
  75. }