daoqi/youlegames
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Apply Morandi 2024 Color Scheme to Calculator page

Browse Source
This commit is contained in:
Joywayer
2026-02-07 21:09:39 +08:00
parent 19c762b3fa
commit 17e32d7cc1
3 changed files with 74 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
codes/minipro/calculation/miniprogram/pages/index/index.wxss
View File

@@ -3,7 +3,7 @@ page {
height: 100vh;
display: flex;
flex-direction: column;
background-color: #f5f6fa;
background-color: #EBF4F8; /* Color 03 */
}
.scrollarea {
flex: 1;
@@ -19,14 +19,14 @@ page {
.header-bg {
width: 100%;
height: 380rpx;
background: linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%);
background: #11616B; /* Color 01 - Solid Color */
border-bottom-left-radius: 48rpx;
border-bottom-right-radius: 48rpx;
padding: 40rpx;
box-sizing: border-box;
display: flex;
justify-content: center;
box-shadow: 0 12rpx 32rpx rgba(108, 92, 231, 0.25);
box-shadow: 0 12rpx 32rpx rgba(17, 97, 107, 0.25);
position: relative;
overflow: hidden;
}
@@ -122,12 +122,12 @@ page {
padding: 32rpx;
display: flex;
align-items: center;
box-shadow: 0 8rpx 32rpx rgba(108, 92, 231, 0.08);
box-shadow: 0 8rpx 24rpx rgba(17, 97, 107, 0.06); /* Teal shadow */
}
.grid-item-hover {
transform: scale(0.97);
background-color: #f8f7ff;
background-color: #EBF4F8; /* Color 03 hover */
}
.icon-box {
@@ -143,22 +143,23 @@ page {
.icon {
font-size: 46rpx;
color: #11616B; /* Icon color dark teal */
}
.bg-gradient-blue {
background: linear-gradient(135deg, #e0e6ff 0%, #c7d2fe 100%);
background: #EBF4F8; /* Color 03 */
}
.bg-gradient-pink {
background: linear-gradient(135deg, #fce4ec 0%, #f8bbd0 100%);
background: #FED9CD; /* Color 04 */
}
.bg-gradient-green {
background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
background: #7BBDB6; /* Color 02 */
}
.bg-gradient-orange {
background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%);
background: #FED9CD; /* Color 04 */
}
.bg-gradient-purple {
background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
background: #DC8B70; /* Color 05 */
}
.text-box {