timi/gaoYuJournal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

adaptation dark mode

Browse Source
This commit is contained in:
Timi
2025-12-10 15:02:17 +08:00
parent ad755c7d0e
commit 69bf186f0e
11 changed files with 195 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
miniprogram/components/calendar/index.less
View File

@ -7,9 +7,10 @@
flex-direction: column; flex-direction: column;
.year { .year {
color: var(--theme-text-secondary);
display: flex; display: flex;
padding: 16rpx 32rpx; padding: 16rpx 32rpx;
background: var(--theme-bg-secondary); background: transparent;
align-items: center; align-items: center;
margin-bottom: 24rpx; margin-bottom: 24rpx;
justify-content: space-between; justify-content: space-between;
@ -71,12 +72,12 @@
.day { .day {
display: flex; display: flex;
position: relative; position: relative;
background: transparent;
align-items: center; align-items: center;
aspect-ratio: 1; aspect-ratio: 1;
border-radius: 12rpx; border-radius: 12rpx;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
background: var(--theme-bg-card);
.number { .number {
color: var(--theme-text); color: var(--theme-text);
@ -97,7 +98,7 @@
&.has-journal { &.has-journal {
background: var(--theme-bg-journal); background: var(--theme-bg-journal);
.day-number { .number {
color: var(--theme-wx); color: var(--theme-wx);
font-weight: bold; font-weight: bold;
} }

10
miniprogram/pages/main/journal-creater/index.less
View File

@ -53,6 +53,7 @@
color: var(--theme-wx); color: var(--theme-wx);
margin: 0; margin: 0;
font-size: 80rpx; font-size: 80rpx;
background: transparent;
} }
.thumbnail { .thumbnail {
@ -85,15 +86,6 @@
position: absolute; position: absolute;
font-size: 45rpx; font-size: 45rpx;
} }
.delete {
top: 10rpx;
right: 10rpx;
color: rgba(0, 0, 0, .7);
z-index: 3;
position: absolute;
font-size: 45rpx;
}
} }
} }
} }

2
miniprogram/pages/main/journal-creater/index.wxml
View File

@ -76,7 +76,7 @@
disabled="{{isSubmitting}}" disabled="{{isSubmitting}}"
bind:tap="addMedia" bind:tap="addMedia"
> >
<t-icon name="add" /> <t-icon class="icon" name="add" />
</t-button> </t-button>
</view> </view>
</view> </view>

231
miniprogram/pages/main/journal-date/index.less
View File

@ -21,147 +21,146 @@
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, .15); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, .15);
} }
} }
}
.date-detail { .date-detail {
height: 61.8vh; height: 61.8vh;
display: flex;
border-radius: 24rpx 24rpx 0 0;
flex-direction: column;
.detail-content {
flex: 1;
display: flex; display: flex;
background: var(--theme-bg-card); overflow: hidden;
border-radius: 24rpx 24rpx 0 0;
flex-direction: column; flex-direction: column;
.detail-content { .header {
flex: 1;
display: flex; display: flex;
overflow: hidden; padding: 24rpx 24rpx 4rpx;
flex-direction: column; flex-shrink: 0;
align-items: flex-start;
justify-content: space-between;
.header { .info {
flex: 1;
display: flex; display: flex;
padding: 24rpx 24rpx 4rpx; flex-direction: column;
flex-shrink: 0;
align-items: flex-start;
justify-content: space-between;
.info { .date {
flex: 1; color: var(--theme-text);
display: flex; font-size: 32rpx;
flex-direction: column; font-weight: 600;
margin-bottom: 8rpx;
.date {
color: var(--theme-text);
font-size: 32rpx;
font-weight: 600;
margin-bottom: 8rpx;
}
.count {
color: var(--theme-text-secondary);
font-size: 26rpx;
}
} }
.actions { .count {
gap: 16rpx; color: var(--theme-text-secondary);
display: flex; font-size: 26rpx;
flex-shrink: 0;
align-items: center;
.indicator {
color: var(--theme-text-secondary);
padding: 8rpx 16rpx;
font-size: 24rpx;
border-radius: 24rpx;
background: var(--theme-bg);
}
} }
} }
.journals-swiper { .actions {
flex: 1; gap: 16rpx;
display: flex;
flex-shrink: 0;
align-items: center;
.swiper-item-wrapper { .indicator {
height: 100%; color: var(--theme-text-secondary);
padding: 8rpx 16rpx;
font-size: 24rpx;
border-radius: 24rpx;
background: var(--theme-bg);
}
}
}
.journals-swiper {
flex: 1;
.swiper-item-wrapper {
height: 100%;
display: flex;
padding: 0 24rpx;
box-sizing: border-box;
.journal-item {
flex: 1;
display: flex; display: flex;
padding: 0 24rpx; background: var(--theme-bg);
box-sizing: border-box; flex-direction: column;
.journal-item { .journal-header {
flex: 1;
display: flex; display: flex;
background: var(--theme-bg); margin-top: 16rpx;
flex-direction: column; flex-shrink: 0;
align-items: center;
justify-content: space-between;
.journal-header { .location {
display: flex;
margin-top: 16rpx;
flex-shrink: 0;
align-items: center;
justify-content: space-between;
.location {
flex: 1;
color: var(--theme-text);
overflow: hidden;
font-size: 28rpx;
white-space: nowrap;
text-overflow: ellipsis;
}
.time {
color: var(--theme-text-secondary);
font-size: 24rpx;
margin-left: 16rpx;
flex-shrink: 0;
}
}
.idea {
color: var(--theme-text);
display: block;
font-size: 28rpx;
line-height: 1.6;
flex-shrink: 0;
}
.items-scroll {
flex: 1; flex: 1;
height: 0; color: var(--theme-text);
margin-top: 16rpx; overflow: hidden;
font-size: 28rpx;
white-space: nowrap;
text-overflow: ellipsis;
}
.items { .time {
color: var(--theme-text-secondary);
font-size: 24rpx;
margin-left: 16rpx;
flex-shrink: 0;
}
}
.wrapper { .idea {
position: relative; color: var(--theme-text);
column-gap: 8rpx; display: block;
column-count: 3; font-size: 28rpx;
line-height: 1.6;
flex-shrink: 0;
}
.item { .items-scroll {
overflow: hidden; flex: 1;
break-inside: avoid; height: 0;
margin-bottom: 8rpx; margin-top: 16rpx;
background: var(--theme-bg-card);
&.thumbnail { .items {
width: 100%;
display: block;
}
&.video { .wrapper {
position: relative; position: relative;
column-gap: 8rpx;
column-count: 3;
&::after { .item {
top: 50%; overflow: hidden;
left: 53%; break-inside: avoid;
width: 0; margin-bottom: 8rpx;
height: 0; background: var(--theme-bg-card);
content: "";
position: absolute; &.thumbnail {
transform: translate(-50%, -50%); width: 100%;
border-top: 16rpx solid transparent; display: block;
border-left: 24rpx solid rgba(255, 255, 255, .9); }
border-bottom: 16rpx solid transparent;
pointer-events: none; &.video {
} position: relative;
&::after {
top: 50%;
left: 53%;
width: 0;
height: 0;
content: "";
position: absolute;
transform: translate(-50%, -50%);
border-top: 16rpx solid transparent;
border-left: 24rpx solid rgba(255, 255, 255, .9);
border-bottom: 16rpx solid transparent;
pointer-events: none;
} }
} }
} }

117
miniprogram/pages/main/journal-date/index.wxml
View File

@ -7,62 +7,63 @@
<view wx:if="{{isLoading}}" class="loading"> <view wx:if="{{isLoading}}" class="loading">
<view class="loading-text">加载中...</view> <view class="loading-text">加载中...</view>
</view> </view>
<!-- 详情面板 -->
<t-popup
visible="{{popupVisible}}"
placement="bottom"
bind:visible-change="onPopupVisibleChange"
>
<view class="date-detail">
<view class="detail-content">
<view class="header">
<view class="info">
<view class="date">{{selectedDate.displayDate}}</view>
<view class="count">{{selectedDate.journals.length}} 条日记</view>
</view>
<view class="actions">
<view wx:if="{{selectedDate.journals.length > 1}}" class="indicator">
{{currentJournalIndex + 1}}/{{selectedDate.journals.length}}
</view>
<t-icon name="close" catchtap="closeDetail" size="48rpx" />
</view>
</view>
<swiper
class="journals-swiper"
current="{{currentJournalIndex}}"
bindchange="onSwiperChange"
bindanimationfinish="onSwiperAnimationFinish"
previous-margin="{{0}}"
next-margin="{{swiperNextMargin}}"
>
<block wx:for="{{selectedDate.journals}}" wx:key="id">
<swiper-item class="swiper-item-wrapper">
<view class="journal-item" data-id="{{item.id}}">
<view class="journal-header">
<view wx:if="{{item.location}}" class="location">📍 {{item.location}}</view>
<view class="time">{{item.time}}</view>
</view>
<view wx:if="{{item.idea}}" class="idea">{{item.idea}}</view>
<scroll-view wx:if="{{item.items && item.items.length > 0}}" scroll-y class="items-scroll">
<view class="items">
<view class="wrapper">
<block wx:for="{{item.items}}" wx:key="mongoId" wx:for-item="media">
<image
class="item thumbnail {{media.type === 1 ? 'video' : 'image'}}"
src="{{media.thumbURL}}"
mode="widthFix"
catchtap="previewMedia"
data-media-index="{{mediaIndex}}"
/>
</block>
</view>
</view>
</scroll-view>
</view>
</swiper-item>
</block>
</swiper>
</view>
</view>
</t-popup>
</view> </view>
<!-- 详情面板 -->
<t-popup
class="popup"
visible="{{popupVisible}}"
placement="bottom"
bind:visible-change="onPopupVisibleChange"
>
<view class="date-detail">
<view class="detail-content">
<view class="header">
<view class="info">
<view class="date">{{selectedDate.displayDate}}</view>
<view class="count">{{selectedDate.journals.length}} 条日记</view>
</view>
<view class="actions">
<view wx:if="{{selectedDate.journals.length > 1}}" class="indicator">
{{currentJournalIndex + 1}}/{{selectedDate.journals.length}}
</view>
<t-icon name="close" catchtap="closeDetail" size="48rpx" />
</view>
</view>
<swiper
class="journals-swiper"
current="{{currentJournalIndex}}"
bindchange="onSwiperChange"
bindanimationfinish="onSwiperAnimationFinish"
previous-margin="{{0}}"
next-margin="{{swiperNextMargin}}"
>
<block wx:for="{{selectedDate.journals}}" wx:key="id">
<swiper-item class="swiper-item-wrapper">
<view class="journal-item" data-id="{{item.id}}">
<view class="journal-header">
<view wx:if="{{item.location}}" class="location">📍 {{item.location}}</view>
<view class="time">{{item.time}}</view>
</view>
<view wx:if="{{item.idea}}" class="idea">{{item.idea}}</view>
<scroll-view wx:if="{{item.items && item.items.length > 0}}" scroll-y class="items-scroll">
<view class="items">
<view class="wrapper">
<block wx:for="{{item.items}}" wx:key="mongoId" wx:for-item="media">
<image
class="item thumbnail {{media.type === 1 ? 'video' : 'image'}}"
src="{{media.thumbURL}}"
mode="widthFix"
catchtap="previewMedia"
data-media-index="{{mediaIndex}}"
/>
</block>
</view>
</view>
</scroll-view>
</view>
</swiper-item>
</block>
</swiper>
</view>
</view>
</t-popup>

1
miniprogram/pages/main/journal-editor/index.less
View File

@ -50,6 +50,7 @@
color: var(--theme-wx); color: var(--theme-wx);
margin: 0; margin: 0;
font-size: 80rpx; font-size: 80rpx;
background: transparent;
} }
.thumbnail { .thumbnail {

3
miniprogram/pages/main/journal-map/index.less
View File

@ -45,7 +45,6 @@
.location { .location {
flex: 1; flex: 1;
color: #999; color: #999;
display: flex;
overflow: hidden; overflow: hidden;
font-size: 24rpx; font-size: 24rpx;
white-space: nowrap; white-space: nowrap;
@ -91,7 +90,7 @@
z-index: 999; z-index: 999;
display: flex; display: flex;
position: fixed; position: fixed;
background: #FFF; background: var(--theme-bg-card);
box-shadow: 0 -2rpx 20rpx rgba(0, 0, 0, .15); box-shadow: 0 -2rpx 20rpx rgba(0, 0, 0, .15);
border-radius: 24rpx 24rpx 0 0; border-radius: 24rpx 24rpx 0 0;
flex-direction: column; flex-direction: column;

1
miniprogram/pages/main/journal-map/index.wxml
View File

@ -8,7 +8,6 @@
longitude="{{centerLng}}" longitude="{{centerLng}}"
scale="{{scale}}" scale="{{scale}}"
markers="{{markers}}" markers="{{markers}}"
show-location
bindmarkertap="onMarkerTap" bindmarkertap="onMarkerTap"
bindcallouttap="onCalloutTap" bindcallouttap="onCalloutTap"
> >

1
miniprogram/pages/main/journal/index.less
View File

@ -35,6 +35,7 @@
} }
.text { .text {
color: var(--theme-text-primary);
width: calc(100% - 32px - 2rem); width: calc(100% - 32px - 2rem);
padding: 8px 16px; padding: 8px 16px;
margin: .5rem 1rem 1rem 1rem; margin: .5rem 1rem 1rem 1rem;

1
miniprogram/pages/main/moment/index.less
View File

@ -127,6 +127,7 @@
} }
&.form { &.form {
padding-bottom: 32rpx;
.content { .content {
padding: 16rpx 32rpx; padding: 16rpx 32rpx;

22
miniprogram/theme.wxss
View File

@ -9,18 +9,18 @@ page {
--theme-wx: #07C160; --theme-wx: #07C160;
/* === 背景色 === */ /* === 背景色 === */
--theme-bg-primary: #FFFFFF; --theme-bg-primary: #FFF;
--theme-bg-secondary: #F5F5F5; --theme-bg-secondary: #F5F5F5;
--theme-bg-card: #FFFFFF; --theme-bg-card: #FFF;
--theme-bg-journal: #fff2c8; --theme-bg-journal: #fff2C8;
--theme-bg-overlay: rgba(0, 0, 0, .1); --theme-bg-overlay: rgba(0, 0, 0, .1);
--theme-bg-menu: rgba(255, 255, 255, .95); --theme-bg-menu: rgba(255, 255, 255, .95);
/* === 文字颜色 === */ /* === 文字颜色 === */
--theme-text-primary: #000000; --theme-text-primary: #333;
--theme-text-secondary: #777777; --theme-text-secondary: #777;
--theme-text-tertiary: #999999; --theme-text-tertiary: #999;
--theme-text-disabled: #CCCCCC; --theme-text-disabled: #CCC;
/* === 边框颜色 === */ /* === 边框颜色 === */
--theme-border-light: rgba(0, 0, 0, .1); --theme-border-light: rgba(0, 0, 0, .1);
@ -69,10 +69,10 @@ page[data-weui-theme="dark"] {
--theme-bg-menu: rgba(40, 40, 40, .95); --theme-bg-menu: rgba(40, 40, 40, .95);
/* === 文字颜色 === */ /* === 文字颜色 === */
--theme-text-primary: #FFFFFF; --theme-text-primary: #FFF;
--theme-text-secondary: #AAAAAA; --theme-text-secondary: #AAA;
--theme-text-tertiary: #888888; --theme-text-tertiary: #888;
--theme-text-disabled: #666666; --theme-text-disabled: #666;
/* === 边框颜色 === */ /* === 边框颜色 === */
--theme-border-light: rgba(255, 255, 255, .1); --theme-border-light: rgba(255, 255, 255, .1);