1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465 |
- /* 页面整体样式 */
- ion-content {
- --background: #f5f5f5;
- }
-
- /* 欢迎卡片样式 */
- .welcome-card {
- text-align: center;
- margin: 20px auto;
- max-width: 800px;
- border-radius: 15px;
- box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
- ion-card-header {
- padding-bottom: 0;
- }
- }
-
- /* 功能卡片样式 */
- .features-grid {
- max-width: 1200px;
- margin: 0 auto;
- }
-
- .feature-card {
- height: 100%;
- border-radius: 12px;
- transition: transform 0.3s ease, box-shadow 0.3s ease;
- &:hover {
- transform: translateY(-5px);
- box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
- }
- ion-card-header {
- text-align: center;
- padding-bottom: 0;
- }
- ion-card-content {
- min-height: 80px;
- }
- }
-
- .feature-icon {
- font-size: 48px;
- margin-bottom: 16px;
- }
-
- /* 特殊功能卡片样式 */
- .special-feature {
- margin-top: 20px;
- border-radius: 12px;
- background: linear-gradient(135deg, #fff8f8, #ffffff);
- border-left: 4px solid var(--ion-color-danger);
- ion-card-header {
- text-align: center;
- }
- ion-card-content {
- min-height: 80px;
- }
- }
-
- /* 响应式调整 */
- @media (max-width: 768px) {
- .feature-card, .special-feature {
- margin-bottom: 20px;
- }
- }
|