202226701044/Mind-app/src/app/tab1/tab1.page.scss

.button-container {
    position: absolute; /* 绝对定位 */
    top: 66px; /* 距离顶部的距离 */
    left: 16px; /* 距离左侧的距离 */
    display: flex; /* 使用flexbox布局 */
    flex-direction: row; /* 垂直排列 */
    gap: 8px; /* 按钮之间的间距 */
  }
  
  .custom-button {
    font-size: 12px; /* 按钮字体大小 */
    border-radius: 6px; /* 圆角按钮 */
    color: rgb(245, 82, 82); /* 字体颜色 */
    transition: opacity 0.3s, color 0.3s; /* 添加过渡效果 */
    
  }

  /* 添加按钮的悬停效果 */
  .custom-button:hover {
    opacity: 0.5 !important; /* 悬停时透明度变化 */
    color:aqua !important;
  }
  
  ion-content {
    --background: #ffcccb; /* 设置背景颜色为粉色 */
    color: black; /* 设置文本颜色为黑色，确保可读性 */
  }
  ion-header {
    background-color: #f19595; /* 设置背景颜色为淡粉色 */
    color: black; /* 设置文本颜色为黑色 */
  }
  
  ion-toolbar {
    --background: transparent; /* 如果需要透明效果，可以设置为透明 */
  }
  

  .card1 {
    margin-top: 70px; /* 增加顶部边距 */
    background-color:rgb(250, 222, 222);
  }

  .card2 {
    margin-top: 60px; /* 增加顶部边距 */
    background-color:rgb(250, 222, 222);
  }