Skip to content

Commit 2c1c1ff

Browse files
tangly1024tangly1024
committed
commerce-footer样式微调
1 parent 5e3fa19 commit 2c1c1ff

File tree

3 files changed

+101
-90
lines changed

3 files changed

+101
-90
lines changed

‎themes/commerce/components/Footer.js

+98-87
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ const Footer = props => {
1818
return (
1919
<footer
2020
id='footer-wrapper'
21-
className='relative bg-[#2A2A2A] justify-center w-full leading-6 text-gray-300 text-sm p-10'>
21+
className='relative bg-[#2A2A2A] justify-center w-full leading-6 text-gray-300 text-sm md:p-10'>
2222
<div id='footer-container' className='w-full mx-auto max-w-screen-xl'>
2323
<div className='flex'>
2424
{/* 页脚左侧菜单组 */}
@@ -72,105 +72,116 @@ const Footer = props => {
7272
</div>
7373
</div>
7474

75-
{/* 页脚中部联系方式 */}
75+
{/* 页脚右侧联系方式 */}
7676
{
77-
<div className='md:border-l pl-4 border-gray-600 my-6 whitespace-pre-line text-left flex-grow'>
78-
<div className='font-bold text-l text-white mb-6'>
79-
{siteConfig('COMMERCE_TEXT_FOOTER_TITLE', 'Contact US', CONFIG)}
80-
</div>
81-
<div className='space-y-4'>
82-
<div className='flex space-x-4 text-2xl'>
83-
{JSON.parse(
84-
siteConfig('COMMERCE_CONTACT_WHATSAPP_SHOW', null, CONFIG),
85-
true
86-
) && (
87-
<div>
88-
{
89-
<a
90-
target='_blank'
91-
rel='noreferrer'
92-
href={siteConfig('CONTACT_WHATSAPP', '#', CONFIG)}
93-
title={'telegram'}>
94-
<i className='transform hover:scale-125 duration-150 fa-brands fa-whatsapp dark:hover:text-red-400 hover:text-red-600' />
95-
</a>
96-
}
97-
</div>
98-
)}
99-
100-
{JSON.parse(
101-
siteConfig('COMMERCE_CONTACT_TELEGRAM_SHOW', true, CONFIG)
102-
) && (
103-
<div>
104-
{
105-
<a
106-
target='_blank'
107-
rel='noreferrer'
108-
href={siteConfig('CONTACT_TELEGRAM', '#', CONFIG)}
109-
title={'telegram'}>
110-
<i className='transform hover:scale-125 duration-150 fab fa-telegram dark:hover:text-red-400 hover:text-red-600' />
111-
</a>
112-
}
113-
</div>
114-
)}
115-
</div>
116-
<div className='text-lg'>
117-
{' '}
118-
{siteConfig('CONTACT_EMAIL') && (
119-
<a
120-
target='_blank'
121-
rel='noreferrer'
122-
title={'email'}
123-
href={`mailto:${siteConfig('CONTACT_EMAIL')}`}>
124-
<i className='transform hover:scale-125 duration-150 fas fa-envelope dark:hover:text-red-400 hover:text-red-600' />{' '}
125-
{siteConfig('CONTACT_EMAIL')}
126-
</a>
77+
<div className='md:border-l pl-8 space-x-8 border-gray-600 flex flex-grow'>
78+
{/* 电话邮箱等 */}
79+
<div className='my-6 whitespace-pre-line text-left'>
80+
<div className='font-bold text-l text-white mb-6'>
81+
{siteConfig(
82+
'COMMERCE_TEXT_FOOTER_TITLE',
83+
'Contact US',
84+
CONFIG
12785
)}
12886
</div>
129-
<div className='text-lg'>
130-
{' '}
131-
{siteConfig('CONTACT_PHONE', null) && (
132-
<div>
133-
<i className='transform hover:scale-125 duration-150 fas fa-user dark:hover:text-red-400 hover:text-red-600' />{' '}
134-
{siteConfig('CONTACT_PHONE', null)}
135-
</div>
136-
)}
87+
<div className='space-y-4'>
88+
<div className='flex space-x-4 text-2xl'>
89+
{JSON.parse(
90+
siteConfig(
91+
'COMMERCE_CONTACT_WHATSAPP_SHOW',
92+
null,
93+
CONFIG
94+
),
95+
true
96+
) && (
97+
<div>
98+
{
99+
<a
100+
target='_blank'
101+
rel='noreferrer'
102+
href={siteConfig('CONTACT_WHATSAPP', '#', CONFIG)}
103+
title={'telegram'}>
104+
<i className='transform hover:scale-125 duration-150 fa-brands fa-whatsapp dark:hover:text-red-400 hover:text-red-600' />
105+
</a>
106+
}
107+
</div>
108+
)}
109+
110+
{JSON.parse(
111+
siteConfig('COMMERCE_CONTACT_TELEGRAM_SHOW', true, CONFIG)
112+
) && (
113+
<div>
114+
{
115+
<a
116+
target='_blank'
117+
rel='noreferrer'
118+
href={siteConfig('CONTACT_TELEGRAM', '#', CONFIG)}
119+
title={'telegram'}>
120+
<i className='transform hover:scale-125 duration-150 fab fa-telegram dark:hover:text-red-400 hover:text-red-600' />
121+
</a>
122+
}
123+
</div>
124+
)}
125+
</div>
126+
<div className='text-lg'>
127+
{' '}
128+
{siteConfig('CONTACT_EMAIL') && (
129+
<a
130+
target='_blank'
131+
rel='noreferrer'
132+
title={'email'}
133+
href={`mailto:${siteConfig('CONTACT_EMAIL')}`}>
134+
<i className='transform hover:scale-125 duration-150 fas fa-envelope dark:hover:text-red-400 hover:text-red-600' />{' '}
135+
{siteConfig('CONTACT_EMAIL')}
136+
</a>
137+
)}
138+
</div>
139+
<div className='text-lg'>
140+
{' '}
141+
{siteConfig('CONTACT_PHONE', null) && (
142+
<div>
143+
<i className='transform hover:scale-125 duration-150 fas fa-user dark:hover:text-red-400 hover:text-red-600' />{' '}
144+
{siteConfig('CONTACT_PHONE', null)}
145+
</div>
146+
)}
147+
</div>
137148
</div>
138149
</div>
139-
</div>
140-
}
141150

142-
{/* 页脚右侧图片二维码和文字描述 */}
143-
{
144-
<div className='pl-4 border-gray-600 my-6 whitespace-pre-line text-center flex-grow'>
145-
<div className='font-bold text-l text-white mb-6 text-center'>
146-
{/* eslint-disable-next-line @next/next/no-img-element */}
147-
<img
148-
className='h-36'
149-
src={siteConfig(
150-
'COMMERCE_FOOTER_RIGHT_IMG_URL',
151-
null,
152-
CONFIG
153-
)}></img>
154-
</div>
155-
<div className='space-y-4'>
156-
<div
157-
className='flex space-x-4 text-center'
158-
dangerouslySetInnerHTML={{
159-
__html: siteConfig(
160-
'COMMERCE_FOOTER_RIGHT_TEXT',
161-
null,
162-
CONFIG
163-
)
164-
}}></div>
165-
</div>
151+
{/* 页脚右侧图片二维码和文字描述 */}
152+
{
153+
<div className=' border-gray-600 my-6 whitespace-pre-line text-center'>
154+
<div className='font-bold text-l text-white mb-6 text-center'>
155+
{/* eslint-disable-next-line @next/next/no-img-element */}
156+
<img
157+
className='h-36'
158+
src={siteConfig(
159+
'COMMERCE_FOOTER_RIGHT_IMG_URL',
160+
null,
161+
CONFIG
162+
)}></img>
163+
</div>
164+
<div className='space-y-4'>
165+
<div
166+
className='flex space-x-4 text-center'
167+
dangerouslySetInnerHTML={{
168+
__html: siteConfig(
169+
'COMMERCE_FOOTER_RIGHT_TEXT',
170+
null,
171+
CONFIG
172+
)
173+
}}></div>
174+
</div>
175+
</div>
176+
}
166177
</div>
167178
}
168179
</div>
169180

170181
{/* 底部版权相关 */}
171182
<div
172183
id='footer-copyright-wrapper'
173-
className='flex flex-col md:flex-row justify-between border-t border-gray-600 pt-8'>
184+
className='flex flex-col md:flex-row justify-between border-t border-gray-600 pt-8 px-4 md:px-0'>
174185
<div className='text-start space-y-1'>
175186
{/* 网站所有者 */}
176187
<div>

‎themes/commerce/components/ProductCenter.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export default function ProductCenter(props) {
1616
)
1717

1818
return (
19-
<div className='w-full my-4 mx-4'>
19+
<div className='w-full'>
2020
<div className='w-full text-center text-4xl font-bold'>
2121
{siteConfig('COMMERCE_TEXT_CENTER_TITLE', 'Product Center', CONFIG)}
2222
</div>
@@ -29,7 +29,7 @@ export default function ProductCenter(props) {
2929
<div className='flex'>
3030
<ProductCategories {...props} />
3131

32-
<div className='w-full p-4 mx-2'>
32+
<div className='w-full px-4'>
3333
{/* 文章列表 */}
3434
<div className='grid md:grid-cols-3 grid-cols-2 gap-5'>
3535
{posts?.map(post => (

‎themes/commerce/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,7 @@ const LayoutIndex = props => {
129129

130130
{/* 首页企业/品牌介绍 这里展示公告 */}
131131
{notice && (
132-
<div id='brand-introduction' className='w-full my-4 mx-4'>
132+
<div id='brand-introduction' className='w-full'>
133133
<div className='w-full text-center text-4xl font-bold pt-12'>
134134
{notice.title}
135135
</div>

0 commit comments

Comments
 (0)