高端亚洲风情组件库

组件库已成功应用到 Asia Wonder Tours 网站。以下是可用的组件和使用方法。

色彩系统

墨色 Ink	#1a1a2e
朱砂红 Vermillion	#c73e3a
香槟金 Gold	#b8860b
玉石绿 Jade	#2d6a4f
宣纸白 Cream	#faf8f5

按钮组件

主按钮 (朱砂红)

使用方法：添加 CSS 类 awt-btn-primary

立即预订

次按钮 (金色边框)

使用方法：添加 CSS 类 awt-btn-secondary

了解更多

CTA 按钮 (金色奢华)

使用方法：添加 CSS 类 awt-btn-cta

免费获取报价

玉石按钮

使用方法：添加 CSS 类 awt-btn-jade

探索更多

统计模块

成就展示条

使用说明

在 Elementor 或 HTML 模块中使用以上 CSS 类名即可应用样式。

示例：

<a href="/booking/" class="awt-btn-primary">立即预订</a>
<a href="/tours/" class="awt-btn-secondary">查看更多</a>
<a href="/contact/" class="awt-btn-cta">获取报价</a>

/* Footer Styling */
#footer {
background: #1a1a2e !important;
}
#footer .footer-widget {
background: #1a1a2e;
padding: 60px 0 40px;
}
#footer .widget-title {
color: #d4a853 !important;
font-size: 16px !important;
letter-spacing: 2px;
text-transform: uppercase;
margin-bottom: 20px;
font-weight: 500;
}
#footer .widget ul li a {
color: #e8e0d5 !important;
font-size: 14px;
transition: color 0.3s ease;
}
#footer .widget ul li a:hover {
color: #b8860b !important;
}
#footer p {
color: #e8e0d5 !important;
}
#footer a {
color: #e8e0d5;
transition: color 0.3s ease;
}
#footer a:hover {
color: #b8860b;
}
#footer .copywrap {
background: #0f0f1a;
padding: 20px 0;
border-top: 1px solid rgba(255,255,255,0.1);
}
#footer .copywrap p {
color: #e8e0d5;
font-size: 13px;
margin: 0;
}
#footer .copywrap a {
color: #b8860b;
}
/* Hide default widget styling */
#footer aside.widget {
background: transparent;
border: none;
padding: 0;
}