feat: index - 首页及顶部导航处理

This commit is contained in:
2025-04-07 18:10:50 +08:00
parent f914082909
commit 24575245c0
101 changed files with 5823 additions and 5 deletions

4
.gitignore vendored
View File

@@ -9,4 +9,6 @@ Thumbs.db
/vendor
/.settings
/.buildpath
/.project
/.project
app/index/controller/DataMigration.php

View File

@@ -0,0 +1,210 @@
<?php
declare (strict_types = 1);
namespace app\index\controller;
use app\BaseController;
use app\index\model\LanguageModel;
use app\index\model\ProductCategoryModel;
use app\index\model\ProductModel;
use app\index\model\SysConfigModel;
use app\index\model\SysNavigationItemModel;
use think\facade\Lang;
use think\facade\View;
abstract class Common extends BaseController
{
// 当前语言id
protected $lang_id = 1;
/**
* 控制器初始化
* @access public
*/
public function initialize()
{
// 获取国家/语言列表
$languages = $this->getLanguages();
// 输出国家/语言列表
View::assign('header_languages', $languages);
// 获取当前语言
$current_language = $this->getCurrentLanguage($languages);
if (!empty($current_language)) {
$this->lang_id = $current_language['id'];
}
// 获取产品分类
$categorys = $this->getProductCategory($this->lang_id);
// 输出产品分类
View::assign('header_categorys', $categorys);
// 获取热销产品
$hot_products = $this->getHotProducts($this->lang_id);
// 输出热销产品
View::assign('header_hot_products', $hot_products);
// 输出顶部导航
View::assign('header_navigation', $this->getNavigation('NAV_67f3701f3e831', $this->lang_id));
// 获取系统配置
$configs = $this->getSysConfig($this->lang_id, ['basic', 'contact', 'media']);
// 输出系统配置
View::assign('basic_config', $configs['basic']);
View::assign('contact_config', $configs['contact']);
View::assign('media_config', $configs['media']);
// 获取底部导航
$footer_navigation = $this->getNavigation('NAV_67f60be43df8d', $this->lang_id);
// 输出底部导航
View::assign('footer_navigation', $footer_navigation);
}
// 获取当前语言
private function getCurrentLanguage($languages)
{
$current_code = Lang::getLangSet();
foreach ($languages as $item) {
if ($item['lang_code'] == $current_code) {
return $item;
}
}
return [];
}
// 获取产品分类
protected function getProductCategory($language = 1)
{
$categorys = ProductCategoryModel::field([
'id',
'pid',
'name',
'icon',
'level'
])
->language($language)
->displayed()
->order(['sort' => 'asc', 'id' => 'desc'])
->select();
if ($categorys->isEmpty()) {
return [];
}
return array_to_tree($categorys->toArray(), 0, 'pid', 1, false);
}
// 获取顶部导航
protected function getNavigation($unique_label, $language = 1)
{
$nav = SysNavigationItemModel::hasWhere('navigation', [
'unique_label' => $unique_label,
'language_id' => $language,
'status' => 1
])
->order(['sort' => 'asc', 'id' => 'asc'])
->select();
if ($nav->isEmpty()) {
return [];
}
return array_to_tree($nav->toArray(), 0, 'pid', 1, false);
}
// 获取热销产品
protected function getHotProducts($language = 1, $limit = 3)
{
$products = ProductModel::field([
'id',
'name',
'cover_image',
])
->language($language)
->onSale(true)
->onShelves(true)
->hot(true)
->limit($limit)
->order(['sort' => 'asc', 'id' => 'desc'])
->select();
if ($products->isEmpty()) {
return [];
}
return $products->toArray();
}
// 获取国家/语言列表
protected function getLanguages()
{
$languages = LanguageModel::alias('l')
->field([
'l.id',
'l.name' => 'lang_name',
'l.en_name' => 'lang_en_name',
'l.code' => 'lang_code',
'l.icon' => 'lang_icon',
'l.url' => 'lang_url',
'c.id' => 'country_id',
'c.name' => 'country_zh_name',
'c.en_name' => 'country_en_name',
'c.code' => 'country_code',
])
->join('sys_country c', 'c.id = l.country_id')
->where('l.status', '=', 1)
->where('c.status', '=', 1)
->order(['l.sort' => 'asc', 'l.id' => 'asc'])
->select();
return $languages;
}
// 获取系统联系方式配置
protected function getSysConfig($language, $group = [])
{
$configs = SysConfigModel::alias('c')
->field([
'c.id',
'c.title',
'c.name',
'c.value',
'c.extra',
'c.type',
'g.unique_label'
])
->join('sys_config_group g', 'g.id = c.group_id')
->where('g.unique_label', 'in', $group)
->where('g.language_id', '=', $language)
->order(['c.sort' => 'asc', 'c.id' => 'desc'])
->select();
if ($configs->isEmpty()) {
return [];
}
$configs = $configs->toArray();
$data = [];
foreach ($configs as $cfg) {
$current = &$data;
if (!isset($current[$cfg['unique_label']])) {
$current[$cfg['unique_label']] = [];
}
$current = &$current[$cfg['unique_label']];
// 根据name中"."拆分为多维数组
$parts = explode('.', $cfg['name']);
foreach ($parts as $part) {
if (!isset($current[$part])) {
$current[$part] = [];
}
$current = &$current[$part];
}
$current = [
'title' => $cfg['title'],
'type' => $cfg['type'],
'value' => $cfg['value'],
'extra' => $cfg['extra'],
];
}
unset($current);
return $data;
}
}

View File

@@ -3,10 +3,147 @@ declare (strict_types = 1);
namespace app\index\controller;
class Index
use app\index\model\ArticleModel;
use app\index\model\FaqModel;
use app\index\model\ProductModel;
use app\index\model\SysBannerModel;
use think\facade\View;
/**
* 首页控制器
*/
class Index extends Common
{
public function index()
{
return '您好!这是一个[' . lang('home') . ']示例应用';
// 获取banner数据
$banner = $this->getBannerData();
View::assign('focus_images', $banner['focus_images']);
View::assign('product_categorys', $banner['product_categorys']);
View::assign('featured_topics', $banner['featured_topics']);
View::assign('video', array_shift($banner['video']));
View::assign('scenes', $banner['scenes']);
View::assign('brand_story', $banner['brand_story']);
View::assign('data_statistics', $banner['data_statistics']);
// 获取明星产品/热点产品
View::assign('featured_products', $this->getFeaturedProducts());
// 获取推荐文章
View::assign('recommend_articles', $this->getRecommendArticles());
// 获取常见问题
View::assign('recommend_faq', $this->getRecommendFAQ());
return View::fetch('index');
}
// 获取banner数据
private function getBannerData()
{
$banners = SysBannerModel::with(['items'])
->uniqueLabel([
'BANNER_67f61cd70e8e1',
'BANNER_67f633023a5b3',
'BANNER_67f63f8ab5029',
'BANNER_67f724ed81b1e',
'BANNER_67f7392b4d83a',
'BANNER_67f7410e244fb',
'BANNER_67f76a96545f9',
])
->language($this->lang_id)
->recommend(true)
->enabled(true)
->select();
$banner_map = [];
foreach ($banners as $v) {
$banner_map[$v->unique_label] = $v;
}
// 处理焦点轮播图和产品分类
$data['focus_images'] = []; // 焦点轮播图
$data['product_categorys'] = []; // 产品分类信息
$data['featured_topics'] = []; // 特色专题及公司实力
$data['video'] = []; // 视频
$data['scenes'] = []; // 场景介绍
$data['brand_story'] = []; // 品牌故事
$data['data_statistics'] = []; // 数据统计
if (!empty($banner_map)) {
$data['focus_images'] = $banner_map['BANNER_67f61cd70e8e1']->items->where('type', '=', 'image')->where('status', '=', 1)->order('sort', 'asc')->toArray();
$data['product_categorys'] = $banner_map['BANNER_67f633023a5b3']->items->where('type', '=', 'image')->where('status', '=', 1)->order('sort', 'asc')->toArray();
$data['product_categorys'] = $banner_map['BANNER_67f633023a5b3']->items->where('type', '=', 'image')->where('status', '=', 1)->order('sort', 'asc')->toArray();
$data['featured_topics'] = $banner_map['BANNER_67f63f8ab5029']->items->where('type', '=', 'image')->where('status', '=', 1)->order('sort', 'asc')->toArray();
$data['video'] = $banner_map['BANNER_67f724ed81b1e']->items->where('type', '=', 'video')->where('status', '=', 1)->order('sort', 'asc')->toArray();
$data['scenes'] = $banner_map['BANNER_67f7392b4d83a']->items->where('type', '=', 'image')->where('status', '=', 1)->order('sort', 'asc')->toArray();
$data['brand_story'] = $banner_map['BANNER_67f7410e244fb']->items->where('type', '=', 'image')->where('status', '=', 1)->order('sort', 'asc')->toArray();
$data['data_statistics'] = $banner_map['BANNER_67f76a96545f9']->items->where('type', '=', 'image')->where('status', '=', 1)->order('sort', 'asc')->toArray();
}
return $data;
}
// 获取明星/热点产品
private function getFeaturedProducts()
{
$products = ProductModel::field([
'id',
'name',
'short_name',
'cover_image',
])
->language($this->lang_id)
->enabled(true)
->onSale(true)
->onShelves(true)
->hot(true)
->order(['sort' => 'asc', 'id' => 'desc'])
->select();
if ($products->isEmpty()) {
return [];
}
return $products->toArray();
}
// 获取推荐文章
private function getRecommendArticles()
{
$articles = ArticleModel::field([
'id',
'title',
'desc',
'image'
])
->language($this->lang_id)
->enabled(true)
->recommend(true)
->order(['sort' => 'asc', 'id' => 'desc'])
->limit(6)
->select();
if ($articles->isEmpty()) {
return [];
}
return $articles->toArray();
}
// 获取推荐问题
private function getRecommendFAQ()
{
$faqs = FaqModel::field([
'id',
'question',
'image',
'answer'
])
->language($this->lang_id)
->recommend(true)
->order(['sort' => 'asc', 'id' => 'desc'])
->limit(6)
->select();
if ($faqs->isEmpty()) {
return [];
}
return $faqs->toArray();
}
}

View File

@@ -1,5 +1,25 @@
<?php
return [
'home' => 'Home',
'header_navigation' => [
'product_categorys' => 'Products'
],
'header_search' => [
'history' => 'Search History',
'hot_product' => 'Popular Products',
],
'footer_navigation' => [
'product_categorys' => 'Product'
],
'footer_contact' => 'Contact',
'index' => [
'featured_products' => 'Featured Products',
'view_all' => 'View All',
'learn_more' => 'Learn More',
'orico_technology' => 'ORICO Technology',
'orico_technology_desc' => 'Designed to be just as easy to learn as iPhone.Chatting with friends.',
'faq' => 'FAQ',
'faq_short_desc' => 'What are you most concerned about',
'faq_desc' => 'Our customer support is available Manday to Friday 9am600pmAverage arswer time 24h',
]
];

View File

@@ -1,5 +1,25 @@
<?php
return [
'home' => '首页',
'header_navigation' => [
'product_categorys' => '产品列表'
],
'header_search' => [
'hot_product' => '热销产品',
'history' => '搜索记录',
],
'footer_navigation' => [
'product_categorys' => '产品'
],
'footer_contact' => '联系我们',
'index' => [
'featured_products' => '明星产品/热点产品',
'view_all' => '查看所有',
'learn_more' => '了解更多',
'orico_technology' => 'ORICO 技术',
'orico_technology_desc' => '强大功能、简单使用',
'faq' => '常见问题',
'faq_short_desc' => '回答您最关心的问题',
'faq_desc' => '客服团队的工作时间周一到周五早9点到晚6点 平均应答时间24小时内',
]
];

View File

@@ -0,0 +1,19 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\ArticleCategoryBaseModel;
use think\model\concern\SoftDelete;
/**
* 文章分类模型
* @mixin \think\Model
*/
class ArticleCategoryModel extends ArticleCategoryBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
}

View File

@@ -0,0 +1,19 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\ArticleLeaveMessageBaseModel;
use think\model\concern\SoftDelete;
/**
* 文章留言模型
* @mixin \think\Model
*/
class ArticleLeaveMessageModel extends ArticleLeaveMessageBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
}

View File

@@ -0,0 +1,37 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\ArticleBaseModel;
use think\model\concern\SoftDelete;
/**
* 文章模型
* @mixin \think\Model
*/
class ArticleModel extends ArticleBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
// 语言范围查询
public function scopeLanguage($query, $language)
{
return $query->where('language_id', '=', $language);
}
// 首页推荐状态范围查询
public function scopeRecommend($query, bool $stat = true)
{
return $query->where('recommend', '=', (int)$stat);
}
// 启用状态范围查询
public function scopeEnabled($query, bool $stat = true)
{
return $query->where('enabled', '=', (int)$stat);
}
}

View File

@@ -0,0 +1,15 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\CountryBaseModel;
/**
* 国家模型
* @mixin \think\Model
*/
class CountryModel extends CountryBaseModel
{
//
}

View File

@@ -0,0 +1,31 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\FaqBaseModel;
use think\model\concern\SoftDelete;
/**
* FAQ模型
* @mixin \think\Model
*/
class FaqModel extends FaqBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
// 语言范围查询
public function scopeLanguage($query, $language)
{
return $query->where('language_id', '=', $language);
}
// 推荐状态范围查询
public function scopeRecommend($query, bool $stat)
{
return $query->where('recommend', '=', (int)$stat);
}
}

View File

@@ -0,0 +1,15 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\LanguageBaseModel;
/**
* 语言模型
* @mixin \think\Model
*/
class LanguageModel extends LanguageBaseModel
{
//
}

View File

@@ -0,0 +1,31 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\ProductCategoryBaseModel;
use think\model\concern\SoftDelete;
/**
* 产品分类模型
* @mixin \think\Model
*/
class ProductCategoryModel extends ProductCategoryBaseModel
{
// 启用软件删除
use SoftDelete;
// 软件删除时间字段
protected $deleteTime = 'deleted_at';
// 所属语言范围查询
public function scopeLanguage($query, $language)
{
$query->where('language_id', '=', $language);
}
// 显示的分类范围查询
public function scopeDisplayed($query)
{
$query->where('is_show', '=', 1);
}
}

View File

@@ -0,0 +1,49 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\ProductBaseModel;
use think\model\concern\SoftDelete;
/**
* 产品模型
* @mixin \think\Model
*/
class ProductModel extends ProductBaseModel
{
// 启用软件删除
use SoftDelete;
// 软件删除时间字段
protected $deleteTime = 'deleted_at';
// 所属语言范围查询
public function scopeLanguage($query, $language)
{
$query->where('language_id', '=', $language);
}
// 启用状态范围查询
public function scopeEnabled($query)
{
$query->where('status', '=', 1);
}
// 在售状态范围查询
public function scopeOnSale($query, bool $stat = true)
{
$query->where('is_sale', '=', (int)$stat);
}
// 上架状态范围查询
public function scopeOnShelves($query, bool $stat = true)
{
$query->where('is_show', '=', (int)$stat);
}
// 热销状态范围查询
public function scopeHot($query, bool $stat = true)
{
$query->where('is_hot', '=', (int)$stat);
}
}

View File

@@ -0,0 +1,25 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\SysBannerItemBaseModel;
use think\model\concern\SoftDelete;
/**
* 横幅模型
* @mixin \think\Model
*/
class SysBannerItemModel extends SysBannerItemBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
// 启用状态范围查询
public function scopeEnabled($query)
{
$query->where('status', '=', 1);
}
}

View File

@@ -0,0 +1,53 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\SysBannerBaseModel;
use think\model\concern\SoftDelete;
/**
* 横幅(分类)模型
* @mixin \think\Model
*/
class SysBannerModel extends SysBannerBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
// 关联横幅数据项
public function items()
{
return $this->hasMany(SysBannerItemModel::class, 'banner_id', 'id');
}
// 唯一标识范围查询
public function scopeUniqueLabel($query, string|array $unique_label)
{
if (is_array($unique_label)) {
$query->whereIn('unique_label', $unique_label);
return;
}
$query->where('unique_label', '=', $unique_label);
}
// 所属语言范围查询
public function scopeLanguage($query, $language)
{
$query->where('language_id', '=', $language);
}
// 首页推荐状态范围查询
public function scopeRecommend($query, bool $recommend = true)
{
$query->where('recommend', '=', (int)$recommend);
}
// 启用状态范围查询
public function scopeEnabled($query, bool $enabled = true)
{
$query->where('status', '=', (int)$enabled);
}
}

View File

@@ -0,0 +1,19 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\SysConfigGroupBaseModel;
use think\model\concern\SoftDelete;
/**
* 系统配置分组模型
* @mixin \think\Model
*/
class SysConfigGroupModel extends SysConfigGroupBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
}

View File

@@ -0,0 +1,25 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\SysConfigBaseModel;
use think\model\concern\SoftDelete;
/**
* 系统配置模型
* @mixin \think\Model
*/
class SysConfigModel extends SysConfigBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
// 关联分组
public function group()
{
return $this->belongsTo(SysConfigGroupModel::class, 'group_id', 'id');
}
}

View File

@@ -0,0 +1,20 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\SysNavigationItemBaseModel;
/**
* 导航项模型
* @mixin \think\Model
*/
class SysNavigationItemModel extends SysNavigationItemBaseModel
{
// 关联导航
public function navigation()
{
return $this->hasOne(SysNavigationModel::class, 'id', 'nav_id');
}
}

View File

@@ -0,0 +1,25 @@
<?php
declare (strict_types = 1);
namespace app\index\model;
use app\common\model\SysNavigationBaseModel;
use think\model\concern\SoftDelete;
/**
* 导航模型
* @mixin \think\Model
*/
class SysNavigationModel extends SysNavigationBaseModel
{
// 启用软删除
use SoftDelete;
// 软删除字段
protected $deleteTime = 'deleted_at';
// 根据unique_label获取
public function scopeUniqueLabel($query, string $unique_label)
{
$query->where('unique_label', '=', $unique_label);
}
}

View File

@@ -11,3 +11,15 @@
use think\facade\Route;
Route::get('/', 'Index/index');
Route::group('product', function() {
// 产品列表页
Route::get('index/:id', 'Product/index')->name('product_index');
// 产品详情页
Route::get('detail/:id', 'Product/detail')->name('product_detail');
// 产品搜索页
Route::get('search', 'Product/search')->name('product_search');
});
// 数据迁移
Route::get('/data/migration', 'DataMigration/index');

View File

@@ -0,0 +1,382 @@
{extend name="public/base" /}
{block name="style"}
<link rel="stylesheet" type="text/css" href="static/index/css/index.css" />
{/block}
{block name="main"}
<div class="orico_Page_index">
<div class="pageMain">
<!-- banner -->
{notempty name="focus_images"}
<div class="swiper-container bannerswiper">
<div class="swiper-wrapper">
{volist name="focus_images" id="focus"}
<div class="swiper-slide">
<a href="{$focus.link}" target="_blank"><img src="{$focus.image}" alt="{$focus.title}"></a>
</div>
{/volist}
</div>
<!-- 如果需要分页器 -->
<div class="swiper-pagination"></div>
<!-- 如果需要导航按钮 -->
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
{/notempty}
<!-- 产品分类信息 -->
{notempty name="product_categorys"}
<div class="catMain">
{volist name="product_categorys" id="cate"}
<a class="catit" href="{$cate.link}">
<img src="{$cate.image}" src="catIcoImg" />
<span class="catName" {notempty name="cate.title_txt_color"}style="color:{$cate.title_txt_color};"{/notempty}>{$cate.title}</span>
</a>
{/volist}
</div>
{/notempty}
<!-- 特色专题及公司实力 -->
{notempty name="featured_topics"}
<div class="featuredtopicsMain">
<div class="ftcontent">
{volist name="featured_topics" id="topic" mod="2"}
<a class="ftItme" href="{$topic.link}">
{if condition="$mod == '1'"}
<div class="ftItme_right">
<img src="{$topic.image}" />
</div>
<div class="ftItme_left">
<p>{$topic.title}</p>
<div class="subtitle">
<span>{:lang('index.view_all')} ></span>
<div class="tpicture"></div>
</div>
</div>
{else/}
<div class="ftItme_left">
<p>{$topic.title}</p>
<div class="subtitle">
<span>{:lang('index.view_all')}</span>
<div class="tpicture"></div>
</div>
</div>
<div class="ftItme_right">
<img src="{$topic.image}" />
</div>
{/if}
</a>
{/volist}
</div>
</div>
{/notempty}
<!-- 明星产品/热点产品 -->
{notempty name="featured_products"}
<div class="featuredProducts">
<p class="biaoti">{:lang('index.featured_products')}</p>
<div class="swiper fpSwiper">
<div class="swiper-wrapper">
{volist name="featured_products" id="product"}
<div class="swiper-slide picture">
<a class="primg">
<img src="{$product.cover_image}" />
</a>
<div class="fpptitle">{$product.name}</div>
<div class="subtitle">{$product.short_name}</div>
<a class="more">{:lang('index.learn_more')} ></a>
</div>
{/volist}
</div>
<div class="swiperasd">
<div class="swiper-container1">
<div class="slideshow-pag swiper-pagination"></div>
</div>
<div class="swiper-container swi1">
<img class="slideshow-btn swiper-button-next" src="static/index/temp_images/rightcheck.png">
<img class="slideshow-btn swiper-button-prev" src="static/index/temp_images/lefta.png">
</div>
</div>
</div>
</div>
{/notempty}
<!-- 视频宣传 -->
{notempty name="video"}
<div class="hotProduct">
<div class="hotvideo">
<iframe src="{$video.video}" title="YouTube video player" style="width:100%;height:67rem;z-index:9999;" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen id="videoElement"></iframe>
</div>
<img src="{$video.image}" class="hotImg" />
</div>
{/notempty}
<!-- 场景介绍 -->
{notempty name="scenes"}
<div class="sceneIntroduction">
{volist name="scenes" id="scene"}
<div class="sceneitem">
<div class="sceneInfo">
<p class="scenetitle" {notempty name="scene.title_txt_color"}style="color:{$scene.title_txt_color};"{/notempty}>{$scene.title}</p>
<p class="subtitle" {notempty name="scene.desc_txt_color"}style="color:{$scene.desc_txt_color};"{/notempty}>{$scene.desc}</p>
<a class="sceneMore" href="{$scene.link}">{:lang('index.learn_more')} ></a>
</div>
<div style="background-image: url('{$scene.image}');" class="sceneimg"></div>
</div>
{/volist}
</div>
{/notempty}
<!-- orico科技 -->
<div class="oricoTechnology">
<p class="ottitle">{:lang('index.orico_technology')}</p>
<span class="otsbtitle">{:lang('index.orico_technology_desc')}</span>
<div class="beforeafter">
<div id="after"></div>
<div id="before"></div>
<div class="drag-circle"></div>
</div>
</div>
<!-- 品牌故事 -->
{notempty name="brand_story"}
<div class="brandStory">
<div class="swiper brandStoryswiper">
<div class="swiper-wrapper">
{volist name="brand_story" id="story"}
<div class="swiper-slide bsitem">
<div class="itmImg">
<img src="{$story.image}" class="bsImg" />
</div>
<div class="bsinf">
<div class="bstitle" {notempty name="story.title_txt_color"}style="color:{$story.title_txt_color};"{/notempty}>{$story.title}</div>
<div class="bssubtitle" {notempty name="story.desc_txt_color"}style="color:{$story.desc_txt_color};"{/notempty}>{$story.desc}</div>
<a class="bsmore" href="{$story.link}">{:lang('index.learn_more')} ></a>
</div>
</div>
{/volist}
</div>
<div class="swiperasd bs_swiperasd" id="timeline">
<div class="bs_swcontainer">
<div class="swiper-pagination bs_pagination"></div>
<hr>
<!-- <span class="time1">2021</span> -->
<!-- <span class="time2">2022</span> -->
<!-- <span class="time3">2023</span> -->
</div>
<div class="swiper-container bs_bts">
<img class="slideshow-btn swiper-button-next" src="static/index/temp_images/rightcheck.png" alt="" />
<img class="slideshow-btn swiper-button-prev " src="static/index/temp_images/lefta.png" alt="" />
</div>
</div>
</div>
</div>
{/notempty}
<!-- 数据统计-->
{notempty name="data_statistics"}
<div class="oricoDataStatistics">
<div class="odsmain">
{volist name="data_statistics" id="ods"}
<div class="odsItem">
<h1 {notempty name="ods.desc_txt_color"}style="color:{$ods.desc_txt_color};"{/notempty}>{$ods.desc}</h1>
<h3 {notempty name="ods.title_txt_color"}style="color:{$ods.title_txt_color};"{/notempty}>{$ods.title}</h3>
</div>
{/volist}
</div>
</div>
{/notempty}
<!-- 文章轮播 -->
{notempty name="recommend_articles"}
<div class="oricoPub">
<div class="swiper pubswiper">
<div class="swiper-wrapper">
{volist name="recommend_articles" id="article"}
<div class="swiper-slide pubSwitem">
<a class="pubimgdiv" href="{:url('article/index', ['id' => $article.id])}">
<img src="{$article.image}" class="pubimg" />
</a>
<a class="pubinfo">
<span>{$article.title}</span>
</a>
</div>
{/volist}
</div>
<div class="swiperasd pubswiperasd">
<div class="swiper-container">
<img class="slideshow-btn swiper-button-next" src="static/index/temp_images/rightcheck.png">
<img class="slideshow-btn swiper-button-prev" src="static/index/temp_images/lefta.png">
</div>
</div>
</div>
</div>
{/notempty}
<!-- FAQ-->
{notempty name="recommend_faq"}
<div class="oricoFQA">
<div class="fqaleft">
<h1 class="title">{:lang('index.faq')}</h1>
<p class="dec">{:lang('index.faq_short_desc')}</p>
<p class="sudec">{:lang('index.faq_desc')}</p>
</div>
<div class="fqaright">
<ul class="accordion">
{volist name="recommend_faq" id="faq"}
<li class="fqali">
<div class="fqa-question">
<h3>{$faq.question} </h3>
<span class="xiala">+</span>
</div>
<div class="fqa-answer">
<p>{$faq.answer|raw}</p>
</div>
</li>
{/volist}
</ul>
</div>
</div>
{/notempty}
<!-- 底部固定提示 -->
<div class="oricofixd-info">
<div class="ofiinfo">We use cookies to ensure you get the best experience on our website. By
continuing to browse, you agree to our use of cookies.</div>
<div class="ofibt"><button>OK,got it!</button></div>
<div class="oficlose"><span class="close-btn">×</span></div>
</div>
</div>
</div>
{/block}
{block name="script"}
<script>
$(document).ready(function() {
let isDragging = false;
let startX;
let initialLeft;
$('.drag-circle').mousedown(function(e) {
isDragging = true;
startX = e.pageX;
initialLeft = $('.drag-circle').position().left;
});
$(document).mousemove(function(e) {
if (isDragging) {
const currentX = e.pageX;
const diffX = currentX - startX;
let newLeft = initialLeft + diffX;
const containerWidth = $('.beforeafter').width();
newLeft = Math.max(20, Math.min(containerWidth - 20, newLeft));
$('.drag-circle').css('left', newLeft);
$('#before').width(newLeft);
}
});
$(document).mouseup(function() {
isDragging = false;
});
// 底部关闭
$(".oficlose").on("click", function() {
$(".oricofixd-info").hide();
});
});
$(function() {
// banner轮播
var mySwiper = new Swiper('.bannerswiper', {
// 配置选项
loop: true,
autoplay: {
delay: 3000,
},
pagination: {
el: '.swiper-pagination',
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
});
var fpSwiper = new Swiper(".fpSwiper", {
slidesPerView: 3,
spaceBetween: 30,
slidesPerGroup: 1,
loop: true,
autoplay: {
delay: 5000,
pauseOnMouseEnter: true,
disableOnInteraction: false,
},
slidesPerView: "auto",
centeredSlides: true,
loopFillGroupWithBlank: true,
loopAdditionalSlides: 3,
pagination: {
el: ".swiper-pagination",
type: "progressbar",
},
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
//品牌故事轮播
var brandStoryswiper = new Swiper(".brandStoryswiper", {
pagination: {
el: ".swiper-pagination",
},
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
// 宣传banner
var pubswiper = new Swiper(".pubswiper", {
loop: true,
autoplay: {
delay: 5000,
pauseOnMouseEnter: true,
disableOnInteraction: false,
},
//slidesPerView: 1,
slidesPerView: "auto",
centeredSlides: true,
spaceBetween: 32,
pagination: {
el: ".swiper-pagination",
click: true
},
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
// FAQ问答展开收起
$(".fqali").on('click', function() {
if ($(this).children("div.fqa-answer").is(':visible')) {
$(".fqali").removeClass('active');
$(".fqa-answer").hide();
$(".text-name").addClass('text-hidden');
$(".xiala").text('+');
} else {
$(".fqali").removeClass('active');
$(".fqa-answer").hide();
$(".text-name").addClass('text-hidden')
$(".xiala").text('+');
$(this).addClass('active');
$(this).children('div.fqa-answer').show();
$(this).children('div.fqa-question').find('span').text('-');
$(this).children('div.fqa-question').find('h3').removeClass('text-hidden');
}
})
// 首先隐藏视频元素和加载中的图片 要放开注释
$("#hotvideo").hide();
// 监听视频的加载事件
setTimeout(function() {
$("#hotvideo").on("load", function() {
// 视频加载完成时,显示视频元素,隐藏加载中的图片
$("#hotvideo").show();
$("#hotImg").hide();
});
}, 1000);
// 监听视频的加载失败事件
setTimeout(function() {
$("#hotvideo").on("error", function() {
// 视频加载失败时,显示加载中的图片,隐藏视频元素
$("#hotImg").show();
$("#videoElement").hide();
});
}, 1500);
});
</script>
{/block}

View File

@@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
{block name="title"}<title>{$basic_config['website_seo_title']['value']}</title>{/block}
{block name="seo"}
<meta name="keywords" content="{$basic_config['website_seo_keyword']['value']}" />
<meta name="description" content="{$basic_config['website_seo_description']['value']}" />
{/block}
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="static/index/css/public.css" />
<link rel="stylesheet" type="text/css" href="static/index/css/fonts.css" />
<link rel="stylesheet" type="text/css" href="static/index/css/orico_header.css" />
<link rel="stylesheet" type="text/css" href="static/index/css/orico_footer.css" />
{block name="style"}{/block}
<link rel="stylesheet" href="https://unpkg.com/swiper@9/swiper-bundle.min.css">
<script type="text/javascript" src='https://code.jquery.com/jquery-3.6.0.min.js'></script>
<script type="text/javascript" src="https://unpkg.com/swiper@9.4.1/swiper-bundle.min.js"></script>
</head>
<body>
{block name="header"}
{include file="public/header"/}
{/block}
{block name="main"}{/block}
{block name="footer"}
{include file="public/footer"/}
{/block}
{block name="script"}{/block}
</body>
</html>
</html>

View File

@@ -0,0 +1,74 @@
<footer class="orico_footer">
<div class="fotter">
<!--中间信息-->
<div class="footerMain">
<!-- 上面-->
<div class="foottxttop">
<!--ico -->
<a href="/">
<img src="static/index/images/bottomlogo.png" class="footerico" />
</a>
<div class="foootCt">
<p class="ftitle">{:lang('footer_navigation.product_categorys')}</p>
<ul>
{volist name="header_categorys" id="vo"}
<li><a href="{:url('product_index', ['id' => $vo.id])}" class="fline">{$vo.name}</a></li>
{/volist}
</ul>
</div>
{if condition="!empty($footer_navigation)"}
{volist name="footer_navigation" id="vo"}
<div class="foootCt">
<p class="ftitle">{$vo.name}</p>
{if condition="!empty($vo.children)"}
<ul>
{volist name="vo.children" id="vc"}
<li><a href="{$vo.link}" class="fline">{$vc.name}</a></li>
{/volist}
</ul>
{/if}
</div>
{/volist}
{/if}
<div class="foootCt">
<p class="ftitle">{:lang('footer_contact')}</p>
{if condition="!empty($contact_config)"}
<ul>
{volist name="contact_config" id="vo"}
<li>
<a href="javascript:void(0);" class="fline">
{if condition="$vo.type == 'image'"}
<img src="{$vo.value}" {if condition="!empty($vo.extra)"}style="{$vo.extra}"{/if} />
{else/}
{$vo.value}
{/if}
</a>
</li>
{/volist}
</ul>
{/if}
</div>
</div>
<div class="foottxtbottom">
{if condition="!empty($media_config)"}
<div class="ftopicos">
<ul>
{volist name="media_config" id="vo"}
<a href="{$vo.url.value}"><img src="{$vo.image.value}" {if condition="!empty($vo.image.extra)"}style="{$vo.image.extra}"{/if} /></a>
{/volist}
</ul>
</div>
{/if}
{if condition="!empty($basic_config.website_powerby)"}
<div class="ftcopyright">
<span>{$basic_config.website_powerby.value}</span>
{if condition="!empty($basic_config.website_icp)"}
<a href="https://beian.miit.gov.cn/">{$basic_config.website_icp.value}</a>
{/if}
</div>
{/if}
<!-- <div class="batext">粤公网安备 44030702002297号</div> -->
</div>
</div>
</div>
</footer>

View File

@@ -0,0 +1,200 @@
<header class="header-PC">
<div id="header">
<!-- LOG -->
<div class="nav1">
<a>
<img src="static/index/images/logo.png" />
</a>
</div>
<!--顶部导航栏 -->
<div class="nav2">
<nav id="booNavigation" class="booNavigation">
<ul>
{if condition="!empty($header_categorys)"}
<li class="navItem">
<a href="javascript:void(0);">{:lang('header_navigation.product_categorys')}</a>
<img src="static/index/images/black-down.png" class="downimg" />
<ol class="navItemConten">
<!-- 左边子菜单-->
<ul class="navItem_cyleft">
{volist name="header_categorys" id="vo"}
<li class="{$key == 0 ? 'it_active' : ''}">
<a href="javascript:void(0);">{$vo.name}</a>
</li>
{/volist}
</ul>
<!-- 右边子菜单-->
{volist name="header_categorys" id="vo"}
{if condition="$key == 0"}
<div class="navItem_cyright" style="display: block;">
{else/}
<div class="navItem_cyright" style="display: none;">
{/if}
{volist name="vo.children" id="vc"}
<dl class="nav_cyrightit">
<dt>
<a href="{:url('product_index', ['id' => $vc.id])}">{$vc.name}</a>
</dt>
{volist name="vc.children" id="vcc"}
<dd>
<a href="{:url('product_index', ['id' => $vcc.id])}">{$vcc.name}</a>
</dd>
{/volist}
<dl>
{/volist}
</div>
{/volist}
</ol>
{/if}
{volist name="header_navigation" id="vo"}
<li class="navItem">
<a href="{$vo.link}" target="{$vo.blank==1?'_blank':'_self'}">{$vo.name}</a>
{if condition="!empty($vo.children)"}
<img src="static/index/images/black-down.png" class="downimg" />
<!--下拉菜单 -->
<ol class="navItemConten1">
{volist name="vo.children" id="voc"}
<li>
<a href="{$vo.link}" target="{$voc.blank==1?'_blank':'_self'}">{$voc.name}</a>
</li>
{/volist}
</ol>
{/if}
</li>
{/volist}
</ul>
</nav>
</div>
<!-- 顶部搜索/国家选择/商店-->
<div class="nav3">
<img src="static/index/images/icon-search.png" id="openModalBtn" class="searchimg" />
<div class="choesCountry">
<img src="static/index/images/icon-language.png" id="countrycheck" class="checkimg" />
<!--国家选择 -->
<div class="topCountry" id="top-country">
<ul>
<li class="closec">
<span class="closecountrybt">×</span>
</li>
{volist name="header_languages" id="vo"}
<a href="{$vo.lang_url}">
<li>
<div class="cico">
<img src="{$vo.lang_icon}" class="countryimg" />
</div>
<p class="countryName">{$vo.country_en_name} - {$vo.lang_en_name}</p>
</li>
</a>
{/volist}
</ul>
</div>
</div>
</div>
</div>
<!-- 搜索弹框-->
<div class="searchmodalMian" id="scmodal">
<div class="searchmodalct">
<span class="close-btn">×</span>
<input type="text" name="keywords" id="serrchinput" autocomplete="off" />
<!-- 历史记录 -->
<div class="searchhistory">
<p class="h_title">{:lang('header_search.history')}</p>
<ul></ul>
</div>
<div class="popProduct">
<p class="h_title">{:lang('header_search.hot_product')}</p>
<div class="popmain">
{volist name="header_hot_products" id="vo"}
<div class="popitem">
<a href="{:url('product_detail', ['id' => $vo.id])}"><img src="{$vo.cover_image}" class="popimg" /></a>
<div class="productName">{$vo.name}</div>
</div>
{/volist}
</div>
</div>
</div>
</div>
</header>
<script>
$(document).ready(function() {
// 搜索历史记录处理
function history(keywords) {
var history = localStorage.getItem('header_search_keywords');
if (!history) {
history = [];
} else {
history = JSON.parse(history);
}
// 记录搜索关键词
if (keywords) {
if (history.includes(keywords)) {
history.splice(history.indexOf(keywords), 1);
}
history.unshift(keywords);
if (history.length > 3) {
history.pop();
}
localStorage.setItem('header_search_keywords', JSON.stringify(history));
return history;
}
// 回显搜索历史记录
history.forEach(function(item) {
$('.searchhistory ul').append('<li><a href="{:url(\'product/search\')}?keywords=' + item + '">' + item + '</a></li>');
});
return history;
}
// 封装一个函数用于处理鼠标悬停显示和隐藏内容
function handleHover($element, $content) {
$element.mouseenter(function() {
$content.stop(true, true).slideDown(400);
}).mouseleave(function() {
$content.stop(true, true).slideUp(400);
});
}
// 处理第一个导航项
handleHover($('.navItem').eq(0), $('.navItem').eq(0).find('.navItemConten'));
// 鼠标移入navItem_cyleft里面的li标签添加类移除其他li的类
$('.navItem_cyleft li').mouseenter(function() {
$(this).addClass('it_active').siblings().removeClass('it_active');
$('.navItem_cyright').hide();
$('.navItem_cyright').eq($(this).index()).show();
});
// 处理第5 - 8个导航项
for (let i = 4; i < 8; i++) {
handleHover($('.navItem').eq(i), $('.navItem').eq(i).find('.navItemConten1'));
}
// 点击搜索
$('#openModalBtn').click(function() {
$('#scmodal').toggle();
});
$('.close-btn').click(function() {
$('#scmodal').hide();
});
// 搜索历史记录回显
history();
// 执行搜索
$('#serrchinput').keydown(function(event) {
if (event.originalEvent.keyCode == 13) {
var keywords = $(this).val();
if (keywords == '') {
return false;
}
// 记录搜索关键词
history(keywords);
// 跳转到搜索页面
window.location.href = "{:url('product/search')}" + '?keywords=' + keywords;
}
});
// 点击选择国家
$('#countrycheck').click(function() {
$('#top-country').toggle();
});
$('.closecountrybt').click(function() {
$('#top-country').hide();
});
});
</script>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.3 KiB

After

Width:  |  Height:  |  Size: 6.6 KiB

View File

@@ -0,0 +1,153 @@
.orico_Page_OEMandODM {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_OEMandODM .OEMandODMpageMain {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .bdimg1 {
width: 100%;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw {
width: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotbt1 {
font-size: 2rem;
font-family: Montserrat-Bold, Montserrat;
padding-bottom: 4.0625rem;
padding-top: 5.5rem;
font-weight: 700;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 {
width: 75%;
display: flex;
flex-direction: row;
justify-content: space-between;
padding-bottom: 6.25rem;
align-items: baseline;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item {
width: 21rem;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbic1 {
width: 6.25rem;
height: 6.25rem;
margin-bottom: 1.25rem;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbtp1 {
font-size: 18px;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
padding-bottom: 18px;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbts1 {
text-align: center;
font-size: 16px;
font-family: Montserrat-Medium, Montserrat;
color: #9e9e9f;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 {
padding-bottom: 5.625rem;
background: #fff;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .iotbt1 {
font-size: 32px;
font-family: Montserrat-Bold, Montserrat;
padding-bottom: 65px;
padding-top: 88px;
font-weight: 700;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs {
width: 70%;
padding-bottom: 1.25rem;
margin: 0 auto;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs .fdimgs-div {
width: 20rem;
height: 15.9375rem;
text-align: center;
background: #fff;
border-radius: 8px;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs .fdimgs-div .fdimgs-div-span {
position: absolute;
bottom: 0px;
z-index: 9999;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(200, 200, 200, 0.1));
height: 45px;
width: 100%;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotbpage .iotb_part22 .fdimgs .fdimgs-div .fdtitle {
font-size: 18px;
font-weight: bold;
z-index: 9999;
position: absolute;
bottom: 0px;
left: 0;
right: 0;
color: #fff;
line-height: 45px;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 .iotbt1 {
font-size: 32px;
font-family: Montserrat-Bold, Montserrat;
padding-bottom: 65px;
padding-top: 88px;
font-weight: 700;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 .fdimgs {
width: 70%;
padding-bottom: 110px;
margin: 0 auto;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.orico_Page_OEMandODM .OEMandODMpageMain .iotb_part2 .fdimgs img {
border-style: none;
font-size: 0;
}

View File

@@ -0,0 +1,232 @@
.orico_Page_achievement {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_achievement .achievementMain {
display: flex;
flex-direction: column;
justify-content: center;
}
.orico_Page_achievement .achievementMain .acvImg {
width: 100%;
height: auto;
}
.orico_Page_achievement .achievementMain .achInfo {
width: 100%;
align-items: center;
justify-content: center;
display: flex;
flex-direction: column;
width: 100%;
background: #fff;
height: 28.75rem;
}
.orico_Page_achievement .achievementMain .achInfo .title {
height: 11.25rem;
line-height: 11.25rem;
font-size: 2rem;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
color: #000000;
text-align: center;
}
.orico_Page_achievement .achievementMain .achInfo .achNums {
display: flex;
flex-direction: row;
justify-content: space-between;
width: 80%;
margin: 0 auto;
max-width: 101.25rem;
}
.orico_Page_achievement .achievementMain .achInfo .achNums .achive_shuju {
width: 25%;
display: flex;
flex-direction: column;
align-items: center;
}
.orico_Page_achievement .achievementMain .achInfo .achNums .achive_shuju .title1 {
margin-top: 2.5rem;
font-size: 2rem;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
color: #000000;
}
.orico_Page_achievement .achievementMain .achInfo .achNums .achive_shuju .subtitle1 {
margin-top: 1rem;
font-size: 1.125rem;
font-family: Montserrat-Regular, Montserrat;
font-weight: 400;
color: #707070;
}
.orico_Page_achievement .achievementMain .achTimes {
width: 100%;
height: auto;
position: relative;
background: #f2f2f2;
font-family: Montserrat;
padding-bottom: 10%;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent {
width: 80%;
max-width: 101.25rem;
margin: 0 auto;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .title {
height: 11.25rem;
line-height: 11.25rem;
font-size: 2rem;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
color: #000000;
text-align: center;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist {
width: 100%;
display: flex;
max-width: 101.25rem;
flex-direction: row;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-time {
width: 15%;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-time .event_year {
width: 6.25rem;
text-align: center;
float: left;
margin-top: 0.625rem;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-time .event_year li {
height: 2.9rem;
line-height: 2.9rem;
border-left: 1px solid #d4d4d4;
font-size: 1.125rem;
color: #828282;
cursor: pointer;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-time .event_year li.current {
border-left: 4px solid #0066ff;
color: #004bfa;
font-weight: 600;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con {
width: 85%;
height: 41.5625rem;
background-color: white;
border-radius: 1rem;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list {
width: 98%;
height: 91%;
overflow: auto;
margin: 1.875rem 0.625rem;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list .event_list {
width: 98%;
background: url(../achievementimg/greyline.png) 50px 0 repeat-y;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list .event_list div {
overflow: hidden;
color: black;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list .event_list div h3 {
margin: 0 0 0 2.1875rem;
padding-left: 2.5rem;
background: url(../achievementimg/greyyuandian.png) 3px 3px no-repeat;
height: 2.375rem;
font-size: 1.25rem;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
color: #000000;
line-height: 1.875rem;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list .event_list div .backgroundimg {
background: url(../achievementimg/yaundian.png) 3px 3px no-repeat !important;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list .event_list div li p {
width: 90%;
margin-left: 1.5rem;
display: inline-block;
padding-left: 0.625rem;
line-height: 1.5625rem;
font-size: 1rem;
margin-bottom: 0.625rem;
font-family: Montserrat-Medium, Montserrat;
font-weight: 500;
color: #707070;
line-height: 1.25rem;
}
.orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list .event_list div li p span {
font-family: Montserrat-Medium, Montserrat;
width: 100%;
text-align: left;
padding: 0 0.9375rem 0.625rem 0.9375rem;
background: #fff;
margin: 0;
margin-left: 1.875rem;
display: block;
float: left;
}
.orico_Page_achievement .achievementMain .tech {
background: #fff;
width: 100%;
}
.orico_Page_achievement .achievementMain .tech .techcontent {
width: 80%;
max-width: 101.25rem;
margin: 0 auto;
display: flex;
flex-direction: column;
padding-bottom: 8.125rem;
}
.orico_Page_achievement .achievementMain .tech .techcontent .title {
height: 11.25rem;
line-height: 11.25rem;
font-size: 2rem;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
color: #000000;
text-align: center;
}
.orico_Page_achievement .achievementMain .tech .techcontent .techcon {
height: 21.875rem;
background-color: #f2f2f2;
display: flex;
border-radius: 1rem;
margin-top: 1.25rem;
}
.orico_Page_achievement .achievementMain .tech .techcontent .techcon div {
width: 50%;
}
.orico_Page_achievement .achievementMain .tech .techcontent .techcon .text img {
margin-top: 5rem;
margin-left: 4.0625rem;
}
.orico_Page_achievement .achievementMain .tech .techcontent .techcon .text .year {
margin-left: 4.0625rem;
margin-top: 2.5rem;
font-size: 1.75rem;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
color: #000000;
line-height: 1.625rem;
}
.orico_Page_achievement .achievementMain .tech .techcontent .techcon .text .context {
margin-left: 65px;
width: 80%;
font-size: 16px;
font-family: Montserrat-Medium, Montserrat;
font-weight: 500;
color: #707070;
line-height: 26px;
margin-top: 14px;
}
.orico_Page_achievement .achievementMain .tech .techcontent .techcon .text .context p {
font-family: inherit;
}
.orico_Page_achievement .achievementMain .tech .techcontent .techcon .tech-img img {
margin: 1.5625rem 0 1.5625rem 1.5625rem;
}

11
public/static/index/css/animate.min.css vendored Executable file

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,212 @@
.orico_Page_articleDetail {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_articleDetail .articleDetailMain {
width: 75%;
margin: 0 auto;
display: flex;
flex-direction: row;
align-items: center;
margin-top: 2.6rem;
}
.orico_Page_articleDetail .articleDetailMain .atmleft {
width: calc(100% - 1.5rem - 25rem);
min-height: 650px;
background: #ffffff;
border: 1px solid #e8e8e8;
float: left;
margin-right: 1.25rem;
}
.orico_Page_articleDetail .articleDetailMain .atmleft .blog_title {
margin: 2.5rem;
border-bottom: 1px solid #e8e8e8;
padding-bottom: 2.5rem;
}
.orico_Page_articleDetail .articleDetailMain .atmleft .blog_title h2 {
font-size: 1.5rem;
font-weight: bold;
line-height: 2.125rem;
color: #252525;
margin-bottom: 1.0625rem;
}
.orico_Page_articleDetail .articleDetailMain .atmleft .blog_title p {
color: #929292;
font-size: 0.875rem;
line-height: 1.5rem;
font-weight: 400;
}
.orico_Page_articleDetail .articleDetailMain .atmleft .blog_content {
margin: 2.5rem;
}
.orico_Page_articleDetail .articleDetailMain .atmleft .blog_content p {
font-size: 0.875rem;
font-weight: 400;
line-height: 1.75rem;
color: #252525;
margin-bottom: 0.625rem;
text-indent: 0 !important;
}
.orico_Page_articleDetail .articleDetailMain .atmleft .blog_content img {
max-width: 100%;
margin: 0 auto;
}
.orico_Page_articleDetail .articleDetailMain .atmright {
width: 25rem;
position: fixed;
top: 100px;
right: 12.5%;
z-index: 10;
}
.orico_Page_articleDetail .articleDetailMain .atmright .blog_share {
width: 100%;
height: auto;
background: #ffffff;
border: 1px solid #e8e8e8;
float: left;
position: relative;
}
.orico_Page_articleDetail .articleDetailMain .atmright .blog_share h3 {
font-size: 1rem;
line-height: 2.125rem;
color: #959595;
font-weight: bold;
padding: 1.25rem 1.875rem;
border-bottom: 1px solid #e8e8e8;
}
.orico_Page_articleDetail .articleDetailMain .atmright .blog_share .clearfix {
overflow: hidden;
}
.orico_Page_articleDetail .articleDetailMain .atmright .blog_share .share_list {
padding: 1.875rem;
display: flex;
}
.orico_Page_articleDetail .articleDetailMain .atmright .blog_share .share_list .atdit {
float: left;
margin-right: 3.125rem;
}
.orico_Page_articleDetail .articleDetailMain .atmright .blog_share .share_list .atdit img {
margin: 0 auto;
display: block;
}
.orico_Page_articleDetail .articleDetailMain .atmright .repply {
width: 100%;
height: auto;
background: #ffffff;
border: 1px solid #e8e8e8;
float: left;
margin-top: 1.25rem;
}
.orico_Page_articleDetail .articleDetailMain .atmright .repply h3 {
font-size: 1rem;
line-height: 2.125rem;
color: #959595;
font-weight: bold;
padding: 1.25rem 1.875rem;
border-bottom: 1px solid #e8e8e8;
}
.orico_Page_articleDetail .articleDetailMain .atmright .repply .itinp {
background: #f2f2f2;
border: none;
border-radius: 8px;
height: 48px;
box-shadow: none;
font-family: Montserrat-Regular, Montserrat;
}
.orico_Page_articleDetail .articleDetailMain .atmright .repply form {
width: auto;
height: auto;
padding: 1.25rem;
}
.orico_Page_articleDetail .articleDetailMain .atmright .repply form span {
font-size: 0.875rem;
font-weight: bold;
}
.orico_Page_articleDetail .articleDetailMain .atmright .repply form input {
width: 98%;
height: 2rem !important;
border: 1px solid #dbdbdb;
margin-top: 0.625rem;
margin-bottom: 0.625rem;
}
.orico_Page_articleDetail .articleDetailMain .atmright .repply form textarea {
text-indent: 10px;
width: 98%;
padding: 10px 0;
margin-top: 0.625rem;
margin-bottom: 0.625rem;
border: 1px solid #dbdbdb;
}
.orico_Page_articleDetail .articleDetailMain .atmright .comment_btn {
margin: 1.25rem 1.25rem;
width: auto;
height: 2.75rem;
line-height: 2.75rem;
background: #009fdf;
color: #ffffff;
text-align: center;
cursor: pointer;
}
.orico_Page_articleDetail .xq {
width: 75%;
margin: 0 auto;
background: #f1f1f1;
display: flex;
}
.orico_Page_articleDetail .xq .love1 {
margin-top: 5%;
}
.orico_Page_articleDetail .xq .love1 .tt {
height: 5rem;
}
.orico_Page_articleDetail .xq .love1 p {
font-size: 1.4em;
color: #101010;
font-weight: bold;
text-align: center;
}
.orico_Page_articleDetail .xq .love1 img {
width: 100%;
display: block;
}
.orico_Page_articleDetail .xq .love2 {
margin-top: 2rem;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.orico_Page_articleDetail .xq .love2 li {
width: 31%;
margin-right: 3.5%;
float: left;
}
.orico_Page_articleDetail .xq .love2 li .lvtit {
font-size: 0.75rem;
color: #444;
margin-top: 1.1875rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.orico_Page_articleDetail .xq .love2 li .lvimg {
width: 100%;
height: 280px;
position: relative;
overflow: hidden;
}
.orico_Page_articleDetail .xq .love2 li .lvimg img {
width: 100%;
height: 100%;
opacity: 1;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
}
.orico_Page_articleDetail .xq .love2 .lvimg img:hover {
transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
transform: scale3d(1.2, 1.2, 1);
}

112
public/static/index/css/brand.css Executable file
View File

@@ -0,0 +1,112 @@
.orico_Page_brand {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_brand .brandMain {
display: flex;
flex-direction: column;
}
.orico_Page_brand .brandMain .img-responsive {
height: auto;
max-width: 100%;
}
.orico_Page_brand .brandMain .our_brand_con {
display: flex;
flex-direction: column;
padding-top: 5rem;
background: #ffffff;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg {
width: 80%;
margin: 0 auto;
max-width: 101.25rem;
padding: 5rem 0;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext {
width: 100%;
display: flex;
flex-direction: row;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext .Table-Cell {
width: 50%;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext .Table-Cell hr {
z-index: 99;
width: 5%;
height: 4px;
background-color: blue;
position: unset;
margin-bottom: 40px;
margin-left: 10%;
margin-top: 5px;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext .Table-Cell .title {
margin-left: 10%;
font-size: 24px;
font-weight: 600;
color: #000000;
line-height: 20px;
font-family: Montserrat-Bold, Montserrat;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext .Table-Cell p {
font-family: Montserrat-Medium, Montserrat;
font-size: 14px;
color: #707070;
line-height: 22px;
margin-left: 10%;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext .Table-Cell .des {
width: 80%;
margin-top: 20px;
}
.orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext .right img {
margin: 0 auto;
margin-left: 10%;
}
.orico_Page_brand .brandMain .dis_bril_bg {
background: #f2f2f2;
padding: 4.2% 0;
overflow: hidden;
}
.orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con {
width: 80%;
max-width: 101.25rem;
background: #fff;
height: 28.125rem;
overflow: hidden;
display: flex;
border-radius: 1rem;
margin: 0 auto;
text-align: center;
}
.orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .iconimg {
margin: 0 auto;
margin-top: 3.125rem;
display: flex;
align-items: center;
justify-content: center;
}
.orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .title {
font-size: 1.125rem;
font-weight: 600;
margin-top: 2.5rem;
}
.orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .title p {
font-family: Montserrat-Bold, Montserrat;
}
.orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .subtitle {
width: 80%;
font-size: 0.875rem;
color: #707070;
font-family: Montserrat-Medium, Montserrat;
margin-top: 2.5rem;
margin-left: 10%;
}
.orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .subtitle p {
font-family: Montserrat-Medium;
line-height: 22px;
}

View File

@@ -0,0 +1,168 @@
.orico_Page_bussiness {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_bussiness .bussinessMain {
width: 100%;
background: #f2f2f2;
position: relative;
}
.orico_Page_bussiness .bussinessMain .bd_main {
max-width: 1366px;
background: #fff;
border-radius: 16px;
padding: 70px 2.4375rem;
margin: 40px auto;
}
.orico_Page_bussiness .bussinessMain .bd_main .sfbt1 {
font-size: 24px;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
text-align: center;
padding-bottom: 55px;
color: #000;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from {
display: flex;
flex: 1;
flex-direction: column;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-bottom: 21px;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem {
display: flex;
flex-direction: column;
flex: 1;
margin-right: 10px;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .itlable {
font-size: 14px;
font-family: Montserrat-Bold, Montserrat;
color: #000000;
font-weight: bold;
padding-bottom: 10px;
width: fit-content;
position: relative;
display: inline-block;
max-width: 100%;
margin-bottom: 5px;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .itlable .redtag {
position: absolute;
right: -10px;
top: 0px;
color: #ee2f53;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .itinp {
background: #f2f2f2;
border-radius: 8px;
height: 48px;
border: none;
box-shadow: none;
font-family: Montserrat-Regular, Montserrat;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .form-control {
display: block;
padding: 0 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .sfbchecks {
display: flex;
flex-direction: column;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .sfbchecks .sfbcheckboxlist {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .sfbchecks .sfbcheckboxlist .cit {
width: 100%;
font-size: 14px;
font-family: Montserrat-Regular, Montserrat;
color: #000;
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 12px;
font-weight: 400;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .sfbchecks .sfbcheckboxlist .cit .sfbcheckboxit {
margin: 0;
border: 1px solid #ccc;
width: 16px;
height: 16px;
border-radius: 2px;
margin-right: 10px;
}
.orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .ittextarea {
height: 200px;
padding: 15px;
background: #f2f2f2;
border: none;
border-radius: 8px;
font-family: Montserrat-Regular, Montserrat;
}
.orico_Page_bussiness .bussinessMain .bd_main .bttj {
font-size: 14px;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
width: 212px;
padding: 15px 15px;
background: #004bfa;
border-radius: 28px;
color: #fff;
text-align: center;
margin: 0 auto;
margin-top: 10px;
cursor: pointer;
}
.orico_Page_bussiness .bussinessMain .bd_main .error {
border: 1px solid #ff4155 !important;
}
.orico_Page_bussiness .csunbmit {
height: 35px;
margin-top: 10px;
margin-bottom: 5px;
}
.orico_Page_bussiness .submitBtn {
width: 75px;
height: 30px;
line-height: 26px;
background-color: #339b53;
text-align: center;
display: block;
color: #ffffff;
font-size: 12px;
border-radius: 6px;
float: left;
}
.orico_Page_bussiness .cli {
border-bottom: 1px dashed #ccc;
text-align: left;
font-size: 12px;
}
.orico_Page_bussiness .ccontent {
width: 98%;
padding: 10px;
background: #f6f9fb;
border: 1px solid #ccc;
margin-bottom: 10px;
}

View File

@@ -0,0 +1,177 @@
.orico_Page_category {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_category .categoryMain {
display: flex;
flex-direction: column;
justify-content: center;
}
.orico_Page_category .categoryMain .categorybgimg {
width: 100%;
height: auto;
}
.orico_Page_category .categoryMain .tabs {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
margin-top: 4%;
}
.orico_Page_category .categoryMain .tabs .tabitme {
padding: 10px 20px;
font-size: 1.5em;
font-weight: bold;
cursor: pointer;
}
.orico_Page_category .categoryMain .tabs .tabitme.on {
color: #009fdf;
}
.orico_Page_category .categoryMain .categorySearch {
width: 67%;
height: 3rem;
margin: 2rem auto;
position: relative;
}
.orico_Page_category .categoryMain .categorySearch .search_icon {
width: 1.25rem;
height: 1.25rem;
display: block;
position: absolute;
left: 1.875rem;
top: 0.9375rem;
background: url(../categoryImg/search.png);
z-index: 9;
}
.orico_Page_category .categoryMain .categorySearch .search {
width: 100%;
height: 3rem;
line-height: 2.875rem;
border: 1px solid #dbdbdb;
border-radius: 0.125rem;
text-indent: 3.75rem;
background: #fff;
color: #414446;
font-size: 0.875rem;
}
.orico_Page_category .categoryMain .tabConten {
width: 80%;
max-width: 101.25rem;
margin: 0 auto;
position: relative;
background: #fff;
}
.orico_Page_category .categoryMain .tabConten .tbmain {
position: relative;
margin: 2% 0;
width: 100%;
}
.orico_Page_category .categoryMain .tabConten .tbmain .Contenitem {
float: left;
width: 29.1%;
height: auto;
margin: 0 0 1.5rem 1.5rem;
background: #f5f5f5;
padding: 1rem;
position: relative;
min-height: 32rem;
overflow: hidden;
}
.orico_Page_category .categoryMain .tabConten .tbmain .Contenitem a {
color: #000;
text-decoration: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
}
.orico_Page_category .categoryMain .tabConten .tbmain .Contenitem a img {
width: 100%;
max-height: 18.75rem;
}
.orico_Page_category .categoryMain .tabConten .tbmain .Contenitem a h3 {
color: #252525;
font-size: 1.25rem;
font-weight: bold;
line-height: 1.875rem;
margin: 0.75rem 0;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
max-height: 4rem;
}
.orico_Page_category .categoryMain .tabConten .tbmain .Contenitem a p {
height: 4.5rem;
overflow: hidden;
color: #929292;
font-size: 0.875rem;
font-weight: 400;
line-height: 1.5rem;
margin-bottom: 0.75rem;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.orico_Page_category .categoryMain .tabConten .tbmain .Contenitem span {
color: #929292;
font-size: 0.875rem;
font-weight: 400;
line-height: 1.5rem;
margin-bottom: 0.75rem;
position: absolute;
bottom: 1rem;
}
.orico_Page_category .categoryMain .tabConten .Page {
zoom: 1;
text-align: center;
color: #555;
clear: both;
padding-bottom: 2rem;
}
.orico_Page_category .categoryMain .tabConten .Page span {
padding: 0px 0px;
display: inline-block;
}
.orico_Page_category .categoryMain .tabConten .Page .p_page {
display: flex;
align-items: center;
justify-content: center;
}
.orico_Page_category .categoryMain .tabConten .Page .p_page .a_prev,
.orico_Page_category .categoryMain .tabConten .Page .p_page .a_next {
display: inline-block;
width: 10px;
height: 21px;
}
.orico_Page_category .categoryMain .tabConten .Page .p_page .a_prev {
background: url(../categoryImg/pfl.png) no-repeat;
margin-right: 10px;
padding: 0 10px;
}
.orico_Page_category .categoryMain .tabConten .Page .p_page .a_next {
background: url(../categoryImg/prh.png) no-repeat;
margin-left: 10px;
padding: 0 10px;
}
.orico_Page_category .categoryMain .tabConten .Page .p_page .num a {
display: inline-block;
width: 34px;
height: 22px;
line-height: 22px;
text-align: center;
vertical-align: middle;
font-size: 16px;
color: #444;
}
.orico_Page_category .categoryMain .tabConten .Page .p_page .num a.a_cur,
.orico_Page_category .categoryMain .tabConten .Page .p_page .num a:hover {
background: #444;
color: #fff;
}

View File

@@ -0,0 +1,165 @@
.orico_Page_contact {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f1f1f1;
}
.orico_Page_contact .contactMain {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.orico_Page_contact .contactMain .contactImg {
height: auto;
width: 100%;
}
.orico_Page_contact .contactMain .contact_c {
width: 75%;
margin: 0 auto;
}
.orico_Page_contact .contactMain .contact_c .all_contact {
background-color: #fff;
border-radius: 1.5rem;
display: flex;
justify-content: flex-start;
width: 100%;
padding: 4rem;
margin-top: 3rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info {
width: 575px;
margin-right: 5.5rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .title {
color: #000;
display: block;
width: 100%;
font-family: "Montserrat-Bold";
font-size: 1.5rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all {
margin-top: 40px;
border-top: 1px solid #e3e3e3;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list {
display: flex;
padding-top: 2.3125rem;
padding-bottom: 2.3125rem;
border-bottom: 1px solid #e3e3e3;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .title {
font-size: 0.875rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .list_img {
width: 3rem;
height: 3rem;
margin-right: 1rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .list_img img {
width: inherit;
height: inherit;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .list_right {
width: 31.875rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .list_right .des {
font-size: 0.875rem;
color: #000;
line-height: 1.5rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .sub_list {
width: 15.1875rem;
margin-right: 1.5rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .sub_list .title {
font-size: 0.875rem;
font-family: "Montserrat-Bold";
}
.orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .sub_list .des {
font-size: 0.875rem;
color: #000;
line-height: 1.5rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question {
width: 35.9375rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .title {
font-size: 1.5rem;
color: #000;
display: block;
width: 100%;
font-family: "Montserrat-Bold";
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list {
margin-top: 1.5rem;
font-size: 1.5rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .title {
font-family: "Montserrat-Bold";
font-size: 0.875rem;
padding-bottom: 0.3125rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .title .f_red {
color: #ff0000;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .itinp {
background: #f2f2f2;
box-shadow: none;
border: none;
font-family: Montserrat-Regular, Montserrat;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .ittextarea {
height: 100px;
background: #f2f2f2;
border: none;
font-family: Montserrat-Regular, Montserrat;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .form_input input,
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .form_input textarea {
background: #f2f2f2;
border-radius: 8px;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .form_input input {
margin-top: 0.5rem;
padding: 1rem;
font-size: 0.875rem;
width: calc(100% - 32px);
line-height: 1rem;
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .form_input textarea {
margin-top: 0.5rem;
padding: 1rem;
font-size: 0.875rem;
width: calc(100% - 32px);
}
.orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .contact_button {
padding: 0.9375rem 2.5rem;
border-radius: 1.75rem;
font-size: 0.875rem;
background-color: #004bfa;
color: #fff;
font-family: "Montserrat-Bold";
display: inline-block;
cursor: pointer;
}
.orico_Page_contact .contactMain .contact_c .become_dis {
padding-top: 2rem;
padding-bottom: 1.625rem;
font-size: 1.125rem;
width: 100%;
text-align: center;
color: #004bfa;
background-color: #fff;
border-radius: 0.75rem;
margin-top: 1.5rem;
font-family: "Montserrat-SemiBold";
}
.orico_Page_contact .contactMain .contact_c .become_dis .text_blue {
color: #004bfa;
}
.orico_Page_contact .contactMain .contact_c .become_dis .text_blue a:visited {
text-decoration: none;
}

View File

@@ -0,0 +1,125 @@
.orico_Page_distributor {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_distributor .distributorMain {
max-width: 85.375rem;
max-height: 78.75rem;
background: #fff;
border-radius: 1rem;
padding: 4.375rem 2.4375rem;
margin: 2.5rem auto;
}
.orico_Page_distributor .distributorMain .redtag {
position: absolute;
right: -10px;
top: 0px;
color: #ee2f53;
}
.orico_Page_distributor .distributorMain .t1 {
font-size: 1.5rem;
color: #004bfa;
padding-bottom: 1rem;
text-align: center;
font-family: Montserrat-Bold, Montserrat;
font-weight: 700;
}
.orico_Page_distributor .distributorMain .s1 {
font-size: 1rem;
color: #707070;
padding-bottom: 0.3125rem;
font-weight: 500;
text-align: center;
}
.orico_Page_distributor .distributorMain .s2 {
padding-bottom: 55px;
}
.orico_Page_distributor .distributorMain .bd_ct {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.orico_Page_distributor .distributorMain .bd_ct .thimg {
width: 40.1875rem;
height: 41.125rem;
margin-right: 1.5rem;
}
.orico_Page_distributor .distributorMain .bd_ct .thimg .bdimg {
width: 100%;
height: 100%;
}
.orico_Page_distributor .distributorMain .bd_from {
display: flex;
flex: 1;
flex-direction: column;
}
.orico_Page_distributor .distributorMain .bd_from .theit {
display: flex;
flex-direction: row;
justify-content: space-between;
margin-bottom: 1.25rem;
}
.orico_Page_distributor .distributorMain .bd_from .theit .bditem {
display: flex;
flex-direction: column;
flex: 1;
margin-right: 0.625rem;
}
.orico_Page_distributor .distributorMain .bd_from .theit .bditem .itlable {
font-size: 0.875rem;
font-family: Montserrat-Bold, Montserrat;
color: #000000;
font-weight: bold;
padding-bottom: 0.625rem;
width: fit-content;
position: relative;
}
.orico_Page_distributor .distributorMain .bd_from .theit .bditem select {
border: 1px solid #f2f2f2;
}
.orico_Page_distributor .distributorMain .bd_from .theit .bditem1 {
width: 100%;
}
.orico_Page_distributor .distributorMain .bd_from .form-control {
display: block;
padding: 0 12px;
font-size: 14px;
line-height: 1.42857143;
color: #555;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}
.orico_Page_distributor .distributorMain .itinp {
background: #f2f2f2;
border: none;
border-radius: 0.5rem;
height: 3rem;
box-shadow: none;
font-family: Montserrat-Regular, Montserrat;
}
.orico_Page_distributor .distributorMain .ittextarea {
height: 6.25rem;
padding: 0.9375rem;
background: #f2f2f2;
border: none;
border-radius: 0.5rem;
font-family: Montserrat-Regular, Montserrat;
}
.orico_Page_distributor .distributorMain .bttj {
font-size: 0.875rem;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
width: 10rem;
padding: 1.2rem 3.75rem;
background: #004bfa;
border-radius: 1.75rem;
color: #fff;
text-align: center;
margin: 0 auto;
margin-top: 2.5rem;
cursor: pointer;
}

View File

@@ -0,0 +1,285 @@
.orico_Page_download {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_download .downloadMain {
display: flex;
flex-direction: column;
justify-content: center;
}
.orico_Page_download .downloadMain .topimg {
width: 100%;
position: relative;
}
.orico_Page_download .downloadMain .topimg img {
width: 100%;
}
.orico_Page_download .downloadMain .topimg .banner_title {
font-size: 3.5rem;
position: absolute;
left: 0;
width: 100%;
text-align: center;
font-weight: bold;
color: #fff;
top: 50%;
height: 56px;
line-height: 56px;
margin-top: -28px;
font-family: "Montserrat-Bold";
}
.orico_Page_download .downloadMain .contact_c {
width: 85.375rem;
margin: auto;
}
.orico_Page_download .downloadMain .contact_c .search_all {
background-color: #fff;
border-radius: 1.5rem;
margin: auto;
display: flex;
font-family: "Montserrat-Medium";
color: #9e9e9f;
z-index: 9;
position: relative;
width: 100%;
padding: 4rem;
font-size: 1rem;
margin-top: -96px;
}
.orico_Page_download .downloadMain .contact_c .search_all input {
padding: 1.4375rem 2rem;
width: 100%;
background: none;
background-color: #f2f2f2;
border-radius: 2rem;
outline: none;
border: none;
}
.orico_Page_download .downloadMain .contact_c .search_all .searchbtn {
position: absolute;
cursor: pointer;
top: 50%;
margin-top: -0.75rem;
right: 6rem;
}
.orico_Page_download .downloadMain .contact_c .search_all .searchbtn img {
width: 100%;
}
.orico_Page_download .downloadMain .contact_c .tab {
margin-top: 4rem;
display: flex;
justify-content: space-between;
}
.orico_Page_download .downloadMain .contact_c .tab .tabit {
width: 27.5rem;
font-size: 1.125rem;
padding-top: 1.5625rem;
padding-bottom: 1.5625rem;
font-family: "Montserrat-Bold";
text-align: center;
border-radius: 0.75rem;
cursor: pointer;
position: relative;
background-color: #fff;
color: #000;
}
.orico_Page_download .downloadMain .contact_c .tab .on {
background-color: #004bfa;
color: #fff;
}
.orico_Page_download .downloadMain .contact_c .tab .on::after {
content: "";
position: absolute;
bottom: 0;
transform: rotate(45deg);
background-color: #004bfa;
left: 50%;
z-index: 0;
width: 12px;
height: 12px;
margin-bottom: -6px;
margin-left: -8px;
}
.orico_Page_download .downloadMain .contact_c .softlist {
margin-top: 2rem;
display: flex;
flex-direction: column;
}
.orico_Page_download .downloadMain .contact_c .softlist .softit {
padding: 80px 64px;
margin-bottom: 24px;
background-color: #fff;
border-radius: 24px;
display: flex;
justify-content: flex-start;
}
.orico_Page_download .downloadMain .contact_c .softlist .softit .left_img {
width: 320px;
height: 320px;
margin-right: 64px;
}
.orico_Page_download .downloadMain .contact_c .softlist .softit .left_img img {
width: 320px;
height: 320px;
border-radius: 12px;
overflow: hidden;
}
.orico_Page_download .downloadMain .contact_c .softlist .softit .title {
font-size: 1.125rem;
font-family: "Montserrat-Bold";
color: #000;
}
.orico_Page_download .downloadMain .contact_c .softlist .softit .sub_title {
font-size: 0.875rem;
margin-top: 0.875rem;
font-family: "Montserrat-Regular";
color: #9e9e9f;
}
.orico_Page_download .downloadMain .contact_c .softlist .softit .des {
line-height: 20px;
margin-top: 8px;
font-size: 16px;
font-family: "Montserrat-Medium";
color: #000;
}
.orico_Page_download .downloadMain .contact_c .softlist .softit .l_button {
border-radius: 28px;
padding: 15px 40px;
margin-top: 74px;
display: inline-block;
font-family: "Montserrat-Bold";
color: #004bfa;
background-color: rgba(0, 75, 250, 0.05);
cursor: pointer;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page {
zoom: 1;
text-align: center;
color: #555;
clear: both;
padding-bottom: 2rem;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page span {
padding: 0px 0px;
display: inline-block;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page {
display: flex;
align-items: center;
justify-content: center;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page .a_prev,
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page .a_next {
display: inline-block;
width: 10px;
height: 21px;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page .a_prev {
background: url(../downloadImg/pfl.png) no-repeat;
margin-right: 10px;
padding: 0 10px;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page .a_next {
background: url(../downloadImg/prh.png) no-repeat;
margin-left: 10px;
padding: 0 10px;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page .num a {
display: inline-block;
width: 34px;
height: 22px;
line-height: 22px;
text-align: center;
vertical-align: middle;
font-size: 16px;
color: #444;
}
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page .num a.a_cur,
.orico_Page_download .downloadMain .contact_c .softlist .Page .p_page .num a:hover {
background: #444;
color: #fff;
}
.orico_Page_download .downloadMain .contact_c .vidotabs {
margin-top: 32px;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .hd {
width: 100%;
background-color: #fff;
border-radius: 12px;
overflow: hidden;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .hd ul {
display: flex;
justify-content: flex-start;
padding-left: 40px;
padding-right: 40px;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .hd ul li {
margin-right: 80px;
padding-top: 20px;
padding-bottom: 20px;
font-size: 16px;
position: relative;
cursor: pointer;
font-family: "Montserrat-Bold";
color: #000;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .hd ul .von {
border-bottom: 2px solid #004bfa;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten {
margin-top: 24px;
height: auto;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten ul {
margin: 0;
padding: 0;
display: flex;
justify-content: flex-start;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul {
display: flex;
justify-content: space-between;
flex-direction: row;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul dd {
margin-right: 24px;
width: 671px;
margin-bottom: 34px;
background-color: #fff;
border-radius: 24px;
overflow: hidden;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul dd video {
width: 100%;
display: block;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul dd .htit {
padding-left: 56px;
padding-right: 56px;
height: 114px;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul dd .htit .htit1 {
font-family: "Montserrat-Regular";
color: #000;
font-size: 16px;
margin-top: 40px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul dd .htit .htit2 {
font-family: "Montserrat-Regular";
color: #9e9e9f;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
font-size: 14px;
margin-top: 16px;
line-height: 20px;
}

220
public/static/index/css/fonts.css Executable file
View File

@@ -0,0 +1,220 @@
@font-face {
font-family: 'icomoon';
src: url('fonts/icomoon/icomoon.eot?ujw7hy');
src: url('fonts/icomoon/icomoon.eot?ujw7hy#iefix') format('embedded-opentype'), url('fonts/icomoon/icomoon.ttf?ujw7hy') format('truetype'),
url('fonts/icomoon/icomoon.woff?ujw7hy') format('woff'), url('fonts/icomoon/icomoon.svg?ujw7hy#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
[class^='icon-'],
[class*=' icon-'] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-Collection:before {
content: '\e900';
}
.icon-culture-P:before {
content: '\e901';
}
.icon-facebook:before {
content: '\e902';
}
.icon-in:before {
content: '\e903';
}
.icon-twitter:before {
content: '\e904';
}
.icon-youtobe:before {
content: '\e905';
}
.icon-country:before {
content: '\e90a';
}
.icon-menu:before {
content: '\e906';
}
.icon-arrow:before {
content: '\e907';
}
.icon-r-arrow:before {
content: '\e907';
}
.icon-close:before {
content: '\e909';
}
.icon-search:before {
content: '\e908';
}
.icon-B-arrow:before {
content: '\e90b';
}
.icon-qq1:before {
content: '\e90c';
}
.icon-wx1:before {
content: '\e90d';
}
.icon-ys1:before {
content: '\e90e';
}
.icon-kf1:before {
content: '\e90f';
}
.icon-top1:before {
content: '\e910';
}
.icon-QQ:before {
content: '\e911';
color: rgba(0, 0, 0, 0.3);
margin-right: 10px;
}
.icon-xl:before {
content: '\e919';
}
.icon-QQ1:before {
content: '\e91c';
}
.icon-PYQ:before {
content: '\e91d';
}
.icon-Under-line:before {
content: '\e91e';
}
.icon-On-line:before {
content: '\e91f';
}
.icon-contect:before {
content: '\e920';
}
.icon-support:before {
content: '\e921';
}
.icon-media:before {
content: '\e922';
}
.icon-join:before {
content: '\e923';
}
@font-face {
font-family: 'icomoon01';
src: url('fonts-20190124/icomoon.eot?ll2528');
src: url('fonts-20190124/icomoon.eot?ll2528#iefix') format('embedded-opentype'),
url('fonts-20190124/icomoon.ttf?ll2528') format('truetype'), url('fonts-20190124/icomoon.woff?ll2528') format('woff'),
url('fonts-20190124/icomoon.svg?ll2528#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
[class^='icons-'],
[class*=' icons-'] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon01' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icons-weixin:before {
content: '\e903';
color: #fff;
}
.icons-Forum:before {
content: '\e900';
color: #fff;
}
.icons-sina:before {
content: '\e901';
color: #fff;
}
.icons-toutiao:before {
content: '\e902';
color: #fff;
}
.icons-douyin:before {
content: '\e904';
color: #fff;
}
@font-face {
font-family: 'icomoon02';
src: url('fonts/other/icomoon.eot?ujw7hy');
src: url('fonts/other/icomoon.eot?ujw7hy#iefix') format('embedded-opentype'), url('fonts/other/icomoon.ttf?ujw7hy') format('truetype'),
url('fonts/other/icomoon.woff?ujw7hy') format('woff'), url('fonts/other/icomoon.svg?ujw7hy#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
[class^='icona-'],
[class*=' icona-'] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon02' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icona-zhihu:before {
content: '\e904';
color: #fff;
}
@font-face {
font-family: 'icomoon05';
src: url('fonts-20220322/icomoon.eot?cdcz43');
src: url('fonts-20220322/icomoon.eot?cdcz43#iefix') format('embedded-opentype'),
url('fonts-20220322/icomoon.ttf?cdcz43') format('truetype'), url('fonts-20220322/icomoon.woff?cdcz43') format('woff'),
url('fonts-20220322/icomoon.svg?cdcz43#icomoon') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^='iconb-'],
[class*='iconb-'] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icomoon05' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.iconb-caret-down:before {
content: '\e900';
}
.iconb-caret-up:before {
content: '\e901';
}

89
public/static/index/css/fq.css Executable file
View File

@@ -0,0 +1,89 @@
.orico_Page_fq {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_fq .img-responsive img {
height: auto;
width: 100%;
}
.orico_Page_fq .fqMain {
max-width: 101.25rem;
min-width: 80%;
padding: 2.3% 0;
margin: 0 auto;
}
.orico_Page_fq .fqMain .Table-Row {
display: flex;
flex-direction: row;
justify-content: space-between;
flex-wrap: wrap;
}
.orico_Page_fq .fqMain .Table-Row .Table-Cell {
float: left;
width: 49%;
margin-right: 1%;
}
.orico_Page_fq .fqMain .Table-Row .Table-Cell .faq-all-text {
padding: 5% 0;
}
.orico_Page_fq .fqMain .Table-Row .Table-Cell .faq-all-text .faq-title {
font-size: 1.125em;
color: #101010;
margin-bottom: 2%;
}
.orico_Page_fq .fqMain .Table-Row .Table-Cell .faq-all-text .faq-des {
font-size: 0.875em;
color: #737373;
line-height: 1.875em;
}
.orico_Page_fq .fqMain .Page {
zoom: 1;
text-align: center;
color: #555;
clear: both;
padding-bottom: 2rem;
}
.orico_Page_fq .fqMain .Page span {
padding: 0px 0px;
display: inline-block;
}
.orico_Page_fq .fqMain .Page .p_page {
display: flex;
align-items: center;
justify-content: center;
}
.orico_Page_fq .fqMain .Page .p_page .a_prev,
.orico_Page_fq .fqMain .Page .p_page .a_next {
display: inline-block;
width: 10px;
height: 21px;
}
.orico_Page_fq .fqMain .Page .p_page .a_prev {
background: url(../fqimg/pfl.png) no-repeat;
margin-right: 10px;
padding: 0 10px;
}
.orico_Page_fq .fqMain .Page .p_page .a_next {
background: url(../fqimg/prh.png) no-repeat;
margin-left: 10px;
padding: 0 10px;
}
.orico_Page_fq .fqMain .Page .p_page .num a {
display: inline-block;
width: 34px;
height: 22px;
line-height: 22px;
text-align: center;
vertical-align: middle;
font-size: 16px;
color: #444;
}
.orico_Page_fq .fqMain .Page .p_page .num a.a_cur,
.orico_Page_fq .fqMain .Page .p_page .num a:hover {
background: #444;
color: #fff;
}

835
public/static/index/css/index.css Executable file
View File

@@ -0,0 +1,835 @@
.orico_Page_index {
width: 100%;
position: relative;
height: auto;
padding-bottom: 3.75rem;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_index .pageMain {
width: 100%;
position: relative;
}
.orico_Page_index .pageMain .bannerswiper {
width: 100%;
height: auto;
position: relative;
}
.orico_Page_index .pageMain .bannerswiper .swiper-slide img {
width: 100%;
height: 100%;
}
.orico_Page_index .pageMain .bannerswiper .swiper-button-next {
right: 9%;
top: 53%;
}
.orico_Page_index .pageMain .bannerswiper .swiper-button-prev {
left: 9%;
top: 53%;
}
.orico_Page_index .pageMain .bannerswiper .swiper-horizontal > .swiper-pagination-bullets,
.orico_Page_index .pageMain .bannerswiper .swiper-pagination-bullets.swiper-pagination-horizontal {
bottom: 5%;
}
.orico_Page_index .pageMain .bannerswiper .swiper-button-next,
.orico_Page_index .pageMain .bannerswiper .swiper-button-prev {
color: #fff;
}
.orico_Page_index .pageMain .bannerswiper .swiper-pagination-bullet-active {
width: 1.5rem !important;
border-radius: 10px;
color: #ffffff !important;
background-color: #ffffff !important;
}
.orico_Page_index .pageMain .catMain {
width: 100%;
display: flex;
flex-direction: row;
justify-content: center;
height: 14.375rem;
background: #fff;
}
.orico_Page_index .pageMain .catMain .catit {
min-width: 15%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.orico_Page_index .pageMain .catMain .catit .catIcoImg {
height: 4.6875rem;
width: 4.6875rem;
}
.orico_Page_index .pageMain .catMain .catit .catName {
padding-top: 1rem;
font-size: 1rem;
font-weight: bold;
}
.orico_Page_index .pageMain .featuredtopicsMain {
width: 100%;
position: relative;
margin-top: 24px;
overflow: hidden;
padding-top: 3vw;
display: flex;
justify-content: center;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent {
width: 85%;
display: flex;
flex-direction: column;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme {
width: 100%;
max-height: 30rem;
display: flex;
flex-direction: row;
background: #fff;
justify-content: space-between;
border-radius: 1.625rem;
margin-bottom: 1.5rem;
overflow: hidden;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_left {
width: 53%;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
align-items: center;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_left p {
font-size: 2.625rem;
line-height: 2.8125rem;
font-weight: 600;
height: 5.9375rem;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_left .subtitle {
font-size: 1.125rem;
font-weight: 600;
display: flex;
flex-direction: row;
align-items: center;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_left .subtitle .tpicture {
width: 1.375rem;
height: 1.375rem;
background: url("/static/index/images/more2.png") no-repeat;
background-position: -26px 0px;
margin-left: 1.625rem;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_left .subtitle:hover {
color: #004bfa;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_left .subtitle:hover .tpicture {
background-position: 0 0;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_right {
width: 47%;
overflow: hidden;
position: relative;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_right img {
width: 100%;
transition: transform 0.3s ease-in-out;
border-start-end-radius: 1.625rem;
border-end-end-radius: 1.625rem;
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme .ftItme_right img:hover {
transform: scale(1.09);
}
.orico_Page_index .pageMain .featuredtopicsMain .ftcontent .ftItme:nth-child(even) .ftItme_right img {
border-start-end-radius: 0;
border-end-end-radius: 0;
border-start-start-radius: 1.625rem;
border-end-start-radius: 1.625rem;
}
.orico_Page_index .pageMain .featuredProducts {
position: relative;
}
.orico_Page_index .pageMain .featuredProducts .biaoti {
font-size: 2rem;
font-weight: 600;
line-height: 6rem;
margin-top: 42px;
margin-bottom: 14px;
width: 85%;
margin: 0 auto;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper {
width: 116%;
margin-left: 6%;
position: relative;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiper-wrapper .picture {
display: block;
width: 21.875rem;
height: 29.375rem;
background: #ffffff;
border-radius: 1.625rem;
text-align: center;
font-size: 1.125rem;
display: flex;
flex-direction: column;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiper-wrapper .picture .primg {
width: 13.5rem;
height: 12.875rem;
display: block;
position: absolute;
left: 50%;
top: 30%;
margin-left: -6.75rem;
margin-top: -6.4375rem;
background-repeat: no-repeat;
transition: transform 0.3s ease-in-out;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiper-wrapper .picture .primg img {
width: 13.5rem;
height: 12.875rem;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiper-wrapper .picture .primg img:hover {
transform: scale(1.1);
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiper-wrapper .picture .fpptitle {
font-size: 1.25rem;
text-align: center;
line-height: 1.5rem;
font-weight: 700;
margin-top: 18rem;
padding: 0 1.875rem;
max-height: 3.0625rem;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiper-wrapper .picture .subtitle {
text-align: center;
line-height: 1.125rem;
font-size: medium;
width: 80%;
margin: auto;
margin-top: 1rem;
margin-bottom: 1.25rem;
max-height: 33px;
overflow: hidden;
font-weight: 600;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiper-wrapper .picture .more {
font-size: 0.8rem;
position: absolute;
bottom: 10%;
left: 50%;
color: #004bfa;
margin-left: -40px;
font-weight: 600;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd {
display: flex;
width: 85%;
position: relative;
height: 6.25rem;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swiper-container1 {
width: 85%;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swiper-container1 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
background-color: #555 !important;
margin-top: 0px;
height: 2px !important;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swiper-container1 .slideshow-pag {
width: 86%;
right: 3%;
top: 50%;
height: 1px;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swi1 {
width: 15%;
margin: 0;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swi1 .slideshow-btn {
height: 2.5rem;
width: 2.5rem;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swi1 .swiper-button-next,
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swi1 .swiper-rtl .swiper-button-prev {
position: static !important;
margin-left: 95px;
margin-top: 24px;
}
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swi1 .swiper-button-prev,
.orico_Page_index .pageMain .featuredProducts .fpSwiper .swiperasd .swi1 .swiper-rtl .swiper-button-next {
position: static !important;
margin-left: 40px;
margin-top: -40px;
}
.orico_Page_index .pageMain .hotProduct {
position: relative;
margin: 0 auto;
}
.orico_Page_index .pageMain .hotProduct .hotvideo {
width: 100%;
height: 50rem;
overflow: hidden;
transform-origin: center center;
transform: scale(1);
transition: transform 0.3s ease-in-out;
background-size: 100% 100%;
background-position: center center;
animation: breath 4s linear infinite;
display: none;
}
.orico_Page_index .pageMain .hotProduct .hotImg {
position: relative;
width: 100%;
height: 100%;
}
.orico_Page_index .pageMain .sceneIntroduction {
width: 100%;
background: #fff;
position: relative;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
padding-top: 1%;
overflow: hidden;
}
.orico_Page_index .pageMain .sceneIntroduction .sceneitem {
overflow: hidden;
width: 49.5%;
display: block;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
height: 34rem;
margin-bottom: 1%;
}
.orico_Page_index .pageMain .sceneIntroduction .sceneitem .sceneInfo {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.orico_Page_index .pageMain .sceneIntroduction .sceneitem .sceneInfo .scenetitle {
font-size: 1.875rem;
text-align: center;
font-weight: bold;
max-height: 5.5rem;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
padding-top: 10%;
z-index: 10;
}
.orico_Page_index .pageMain .sceneIntroduction .sceneitem .sceneInfo .subtitle {
font-size: 1rem;
text-align: center;
line-height: 1.4em;
margin-top: 0.3125rem;
max-height: 1.5rem;
z-index: 999;
overflow: hidden;
display: -webkit-box;
margin-bottom: 0.3125rem;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
z-index: 10;
}
.orico_Page_index .pageMain .sceneIntroduction .sceneitem .sceneInfo .sceneMore {
font-size: 1rem;
color: #004bfa;
text-align: center;
z-index: 10;
}
.orico_Page_index .pageMain .sceneIntroduction .sceneitem .sceneimg {
height: 100%;
width: 100%;
position: absolute;
z-index: -1;
background-size: 100% 100%;
z-index: 9;
}
.orico_Page_index .pageMain .sceneIntroduction .sceneitem .sceneimg:hover {
transform: scale(1.09);
/* background-size: auto 120%; */
}
.orico_Page_index .pageMain .oricoTechnology {
display: flex;
flex-direction: column;
position: relative;
padding-top: 6rem;
padding-bottom: 1.25rem;
justify-content: center;
align-items: center;
text-align: center;
padding-bottom: 120px;
background: #fff;
}
.orico_Page_index .pageMain .oricoTechnology .ottitle {
font-weight: 700;
font-size: 3.5rem;
}
.orico_Page_index .pageMain .oricoTechnology .otsbtitle {
font-weight: 400;
font-size: 1.375rem;
padding-top: 1.25rem;
padding-bottom: 5rem;
width: 30%;
margin: 0 auto;
}
.orico_Page_index .pageMain .oricoTechnology .beforeafter {
width: 85%;
margin: 0 auto;
height: 53.75rem;
position: relative;
border-radius: 1.75rem;
}
.orico_Page_index .pageMain .oricoTechnology #after {
position: absolute;
top: 0px;
left: 0px;
background-image: url("/static/index/images/indeximg1.jpg");
width: 100%;
height: 53.75rem;
background-repeat: no-repeat;
background-size: cover;
border-radius: 1.75rem;
}
.orico_Page_index .pageMain .oricoTechnology #before {
position: absolute;
top: 0px;
left: 0px;
border-right: 0.25rem solid rgba(255, 255, 255, 0.5019607843);
background-image: url("/static/index/images/indeximg2.jpg");
width: 50%;
height: 53.75rem;
background-repeat: no-repeat;
background-size: cover;
border-start-start-radius: 1.75rem;
border-end-start-radius: 1.75rem;
}
.orico_Page_index .pageMain .oricoTechnology .drag-circle {
left: 50%;
transform: translateY(-50%);
position: absolute;
top: 50%;
width: 48px;
height: 48px;
margin: -24px 0 0 -24px;
content: "";
display: flex;
align-items: center;
justify-content: center;
background: #fff url("/static/index/images/ba-arrow.png") center center/22px 22px no-repeat;
border: 1px solid #fff;
border-radius: 50%;
transition: all 0.3s ease;
transform: scale(1);
z-index: 5;
}
.orico_Page_index .pageMain .brandStory {
padding: 0 7%;
position: relative;
margin: 0 auto;
background: #fff;
}
.orico_Page_index .pageMain .brandStory .brandStoryswiper {
padding-bottom: 1.25rem;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper {
position: relative;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper .bsitem {
display: flex;
width: 100%;
height: 43.75rem;
background: #ffffff;
border-radius: 26px 26px 26px 26px;
text-align: center;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper .bsitem .itmImg {
width: 50%;
text-align: left;
border-radius: 1.625rem;
height: 42.625rem;
transition: transform 0.3s ease-in-out;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper .bsitem .itmImg .bsImg {
margin-left: 1%;
border-radius: 26px 26px 26px 26px;
width: 98%;
height: 41.625rem;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper .bsitem .bsinf {
width: 50%;
display: flex;
flex-direction: column;
margin-left: 10%;
justify-content: center;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper .bsitem .bsinf .bstitle {
font-size: 3rem;
text-align: left;
line-height: 4rem;
font-weight: bolder;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper .bsitem .bsinf .bssubtitle {
font-size: 1.25rem;
text-align: left;
line-height: 1.575rem;
width: 80%;
margin-bottom: 5%;
margin-top: 1.25rem;
}
.orico_Page_index .pageMain .brandStory .swiper-wrapper .bsitem .bsinf .bsmore {
font-size: 1rem;
text-align: left;
width: 80%;
font-family: Montserrat !important;
color: #004bfa;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd {
position: relative;
height: 6.25rem;
display: flex;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer {
width: 85%;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer hr {
z-index: -1;
width: 85%;
position: absolute;
top: 2.6875rem;
left: 1rem;
height: 0;
color: inherit;
border-top-width: 1px;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer .bs_pagination {
bottom: 3rem;
width: 86%;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer .bs_pagination .swiper-pagination-bullet {
margin-right: 28%;
width: 1.25rem;
height: 1.25rem;
border-radius: 50%;
background-color: #fff;
cursor: pointer;
opacity: 1;
border: 1px solid #cccccc;
float: left;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer .bs_pagination .swiper-pagination-bullet-active {
background-color: #000;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer span {
font-weight: bold;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer .time1 {
position: absolute;
top: 3.4375rem;
left: 0.2%;
height: 2px;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer .time2 {
position: absolute;
top: 3.4375rem;
left: 25.3%;
height: 2px;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer .time3 {
position: absolute;
top: 3.4375rem;
left: 51%;
height: 2px;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_swcontainer .swiper-container {
width: 15%;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_bts {
width: 15%;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_bts .slideshow-btn {
z-index: 9999;
width: 2.5rem;
height: 2.5rem;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_bts .swiper-button-next {
position: static;
margin-left: 5.9375rem;
margin-top: 1.5rem;
}
.orico_Page_index .pageMain .brandStory .bs_swiperasd .bs_bts .swiper-button-prev {
position: static;
margin-left: 2.5rem;
margin-top: -2.5rem;
}
.orico_Page_index .pageMain .oricoDataStatistics {
background-color: #004bf9;
width: 100%;
}
.orico_Page_index .pageMain .oricoDataStatistics .odsmain {
max-width: 120rem;
min-width: 75rem;
justify-content: center;
align-items: center;
flex-direction: row;
display: flex;
margin: 0 auto;
}
.orico_Page_index .pageMain .oricoDataStatistics .odsmain .odsItem {
color: #fff;
padding: 5.625rem 0;
text-align: center;
}
.orico_Page_index .pageMain .oricoDataStatistics .odsmain .odsItem h1 {
font-size: 3.125rem;
animation: number-scroll 1s ease-in-out forwards;
}
.orico_Page_index .pageMain .oricoDataStatistics .odsmain .odsItem h3 {
font-size: 1.25rem;
padding-top: 0.9375rem;
}
.orico_Page_index .pageMain .oricoDataStatistics .odsmain .odsItem:nth-child(2) {
margin: 0 18%;
}
.orico_Page_index .pageMain .oricoPub {
max-width: 84%;
background-color: #fff;
position: relative;
margin: 0 auto;
}
.orico_Page_index .pageMain .oricoPub .pubswiper {
padding-top: 3.5em;
overflow: hidden;
}
.orico_Page_index .pageMain .oricoPub .pubswiper .pubSwitem {
position: relative;
display: flex;
width: 31%;
height: 100%;
background: #ffffff;
border-radius: 26px;
text-align: center;
position: relative;
overflow: hidden;
max-height: 43.75rem;
}
.orico_Page_index .pageMain .oricoPub .pubswiper .pubSwitem .pubimgdiv {
background-repeat: no-repeat;
transition: transform 0.3s ease-in-out;
background-size: 100% 100%;
max-height: 300px;
}
.orico_Page_index .pageMain .oricoPub .pubswiper .pubSwitem .pubimgdiv img {
width: 100%;
height: 100%;
display: block;
border-radius: 1.625rem;
object-fit: cover;
vertical-align: middle;
}
.orico_Page_index .pageMain .oricoPub .pubswiper .pubSwitem .pubinfo {
position: absolute;
left: 5%;
bottom: 5%;
color: white;
width: 90%;
font-weight: 600;
}
.orico_Page_index .pageMain .oricoPub .pubswiper .pubSwitem .pubinfo span {
width: 100%;
height: 3.75rem;
font-size: 1.5rem;
display: -webkit-box;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
color: #fff;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-wrap: auto;
}
.orico_Page_index .pageMain .oricoPub .pubswiperasd {
position: relative;
width: 55%;
margin-left: 22.5%;
height: 6rem;
display: flex;
}
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container {
margin: 0;
right: 0;
width: auto;
position: absolute;
}
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container .slideshow-btn {
width: 2.5rem;
height: 2.5rem;
}
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container .swiper-button-next,
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container .swiper-container-rtl .swiper-button-prev {
background-image: none;
}
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container .swiper-button-next,
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container .swiper-rtl .swiper-button-prev {
margin-left: 4.875rem;
margin-top: 1.5625rem;
position: static;
}
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container .swiper-button-prev,
.orico_Page_index .pageMain .oricoPub .pubswiperasd .swiper-container .swiper-rtl .swiper-button-next {
position: static;
margin-left: 1.75rem;
margin-top: -2.5rem;
}
.orico_Page_index .pageMain .oricoFQA {
width: 85%;
margin: 0 auto;
margin-top: 4.5rem;
display: flex;
flex-direction: row;
background-color: white;
border-radius: 1.625rem;
align-items: baseline;
box-shadow: 5px 5px 30px 5px #d6d6de;
}
.orico_Page_index .pageMain .oricoFQA .fqaleft {
width: 40%;
display: flex;
flex-direction: column;
}
.orico_Page_index .pageMain .oricoFQA .fqaleft h1.title {
font-size: 3.5rem;
text-align: left;
font-weight: bold;
width: 75%;
margin-left: 15%;
margin-top: 10%;
overflow: hidden;
}
.orico_Page_index .pageMain .oricoFQA .fqaleft .dec {
font-size: 1.5rem;
text-align: left;
width: 75%;
margin-left: 15%;
font-weight: 400;
margin-top: 1%;
padding: 1% 0;
line-height: 1.7rem;
}
.orico_Page_index .pageMain .oricoFQA .fqaleft .sudec {
font-size: 1rem;
text-align: left;
width: 75%;
margin-left: 15%;
margin-top: 2%;
margin-bottom: 10%;
line-height: 1.5rem;
}
.orico_Page_index .pageMain .oricoFQA .fqaright {
width: 60%;
display: flex;
margin-bottom: 7%;
}
.orico_Page_index .pageMain .oricoFQA .fqaright ul.accordion {
margin-top: 10%;
margin-bottom: auto;
margin-left: 3%;
width: 90%;
border: 1px solid #d6d6d6;
border-radius: 0.625rem;
display: flex;
flex-direction: column;
padding: 3% 0;
}
.orico_Page_index .pageMain .oricoFQA .fqaright ul.accordion li.fqali {
margin-left: 5%;
margin-top: 1%;
width: 90%;
margin-bottom: 0.625rem;
border-bottom: 1px solid #d6d6d6;
}
.orico_Page_index .pageMain .oricoFQA .fqaright ul.accordion li.fqali .fqa-question {
font-size: 1rem;
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px;
cursor: pointer;
overflow: hidden;
}
.orico_Page_index .pageMain .oricoFQA .fqaright ul.accordion li.fqali .fqa-question .xiala {
height: 1.875rem;
text-align: center;
}
.orico_Page_index .pageMain .oricoFQA .fqaright ul.accordion li.fqali .fqa-answer {
font-size: 1rem;
font-weight: 400;
padding: 0.625rem;
display: none;
}
.orico_Page_index .pageMain .oricoFQA .fqaright ul.accordion li.fqali .fqa-answer p {
line-height: 1.75rem;
}
.orico_Page_index .pageMain .oricoFQA .fqaright ul.accordion li.fqali:last-child {
border-bottom: none;
}
.orico_Page_index .pageMain .oricofixd-info {
height: 88px;
background-color: #333;
width: 100%;
position: fixed;
bottom: 0;
z-index: 9999;
color: white;
display: flex;
flex-direction: row;
align-items: center;
}
.orico_Page_index .pageMain .oricofixd-info .ofiinfo {
width: 80%;
text-wrap: wrap;
margin-left: 7%;
}
.orico_Page_index .pageMain .oricofixd-info .ofiinfo p {
font-weight: 400;
}
.orico_Page_index .pageMain .oricofixd-info .ofibt {
width: 10%;
}
.orico_Page_index .pageMain .oricofixd-info .ofibt button {
width: 9.375rem;
height: 3.125rem;
border: 1px solid grey;
border-radius: 1.5625rem;
color: white;
background-color: #333;
cursor: pointer;
}
.orico_Page_index .pageMain .oricofixd-info .oficlose {
width: 10%;
margin-right: 7%;
}
.orico_Page_index .pageMain .oricofixd-info .oficlose .close-btn {
font-size: 1.875rem;
margin-right: 3.125rem;
color: white;
cursor: pointer;
float: right;
width: 1.25rem;
}

View File

@@ -0,0 +1,123 @@
.orico_Page_introduction {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_introduction .introductionMain {
display: flex;
flex-direction: column;
justify-content: center;
}
.orico_Page_introduction .introductionMain .iotbpage {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
}
.orico_Page_introduction .introductionMain .iotbpage .iotb_bgw {
width: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
align-items: center;
}
.orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotbt1 {
font-size: 32px;
font-family: Montserrat-Bold, Montserrat;
padding-bottom: 65px;
padding-top: 88px;
font-weight: 700;
}
.orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotb_part1 {
width: 75%;
display: flex;
flex-direction: row;
justify-content: space-between;
padding-bottom: 100px;
align-items: baseline;
}
.orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item {
width: 336px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbic1 {
width: 100px;
height: 100px;
margin-bottom: 20px;
}
.orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbtp1 {
font-size: 18px;
font-family: Montserrat-Bold, Montserrat;
font-weight: bold;
padding-bottom: 18px;
}
.orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbts1 {
text-align: center;
font-size: 16px;
font-family: Montserrat-Medium, Montserrat;
color: #9e9e9f;
}
.orico_Page_introduction .introductionMain .iotb_part2 {
padding-bottom: 90px;
background: #fff;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.orico_Page_introduction .introductionMain .iotb_part2 .iotbt1 {
font-size: 32px;
font-family: Montserrat-Bold, Montserrat;
padding-bottom: 65px;
padding-top: 88px;
font-weight: 700;
}
.orico_Page_introduction .introductionMain .iotb_part2 .fdimgs {
width: 70%;
padding-bottom: 110px;
margin: 0 auto;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding-bottom: 20px;
}
.orico_Page_introduction .introductionMain .iotb_part2 .fdimgs .fdimgs-div {
width: 320px;
height: 255px;
background: #fff;
border-radius: 8px;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
text-align: center;
}
.orico_Page_introduction .introductionMain .iotb_part2 .fdimgs .fdimgs-div .fdimgs-div-span {
position: absolute;
bottom: 0px;
z-index: 9999;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(200, 200, 200, 0.1));
height: 45px;
width: 100%;
}
.orico_Page_introduction .introductionMain .iotb_part2 .fdimgs .fdimgs-div span {
font-size: 18px;
font-weight: bold;
z-index: 9999;
position: absolute;
bottom: 0px;
left: 0;
right: 0;
color: #fff;
line-height: 45px;
}

View File

@@ -0,0 +1,106 @@
@charset "UTF-8";
.orico_Page_newproducts {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f9f9f9;
}
.orico_Page_newproducts p,
.orico_Page_newproducts a,
.orico_Page_newproducts div,
.orico_Page_newproducts span {
font-family: "Microsoft YaHei", "Arial", sans-serif;
}
.orico_Page_newproducts .opdBanner {
width: 100%;
height: auto;
position: relative;
}
.orico_Page_newproducts .opdBanner .opdbannerImg {
width: 100%;
height: auto;
display: none;
object-fit: cover;
transition: opacity 1s ease-in-out;
}
.orico_Page_newproducts .opdbannerImg:first-child {
display: block;
}
.orico_Page_newproducts .oricoNewPrMain {
width: 85%;
padding: 50px 0 10px;
margin: 0 auto;
display: flex;
flex-direction: column;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-title {
font-size: 1.5em;
color: #101010;
margin-bottom: 1.25rem;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list {
display: flex;
flex-wrap: wrap; /* 自动换行 */
justify-content: flex-start; /* 水平方向均匀分布 */
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem {
width: 18%;
float: left;
background: #fff;
padding-bottom: 1em;
margin-top: 2.1%;
position: relative;
margin-right: 2.1%;
padding-top: 30px;
padding-bottom: 70px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem .oNpicoNEW {
width: 4.5rem;
height: 1.875rem;
background: #df2c39;
font-size: 0.75rem;
color: #fff;
text-align: center;
line-height: 1.875rem;
position: absolute;
top: 0px;
left: 50%;
transform: translate(-50%, 0%);
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem .prdimg {
display: inline-block;
width: 100%;
max-width: 220px;
margin: 25px auto;
display: none;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem .prdimg-show {
display: block;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem .prdName {
color: #444;
font-size: 0.875rem;
padding-bottom: 0.625rem;
width: 100%;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem .prddec {
font-size: 0.875rem;
color: #737373;
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem:hover {
box-shadow: 0px 5px 35px rgba(227, 227, 227, 0.75);
transform: translate3d(0, -2px, 0);
}
.orico_Page_newproducts .oricoNewPrMain .ori-pd-list .oripditem:nth-child(5n) {
margin-right: 0px;
}

View File

@@ -0,0 +1,127 @@
.orico_footer {
background: #000;
font-size: 1rem;
}
.orico_footer .fotter {
margin: 0 auto;
overflow: hidden;
padding-bottom: 5.5rem;
padding-top: 2.25rem;
position: relative;
}
.orico_footer .fotter .footerico {
position: absolute;
height: 3.125rem;
left: 8%;
top: 5%;
}
.orico_footer .fotter .footerMain {
min-width: 1024px;
max-width: 75rem;
margin: 0 auto;
display: flex;
flex-direction: column;
}
.orico_footer .fotter .footerMain .foottxttop {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.orico_footer .fotter .footerMain .foottxttop .foootCt {
gap: 1.5rem;
display: grid;
}
.orico_footer .fotter .footerMain .foottxttop .foootCt .ftitle {
font-weight: 700;
color: #fff;
font-size: 1.25rem;
}
.orico_footer .fotter .footerMain .foottxttop .foootCt ul {
display: grid;
gap: 0.75rem;
}
.orico_footer .fotter .footerMain .foottxttop .foootCt ul .fline {
color: #fff;
opacity: 0.7;
transition: opacity 0.2s ease-in-out;
overflow-wrap: anywhere;
}
.orico_footer .fotter .footerMain .foottxtbottom {
padding-left: 10%;
padding-left: 14%;
display: grid;
padding-top: 8%;
}
.orico_footer .fotter .footerMain .foottxtbottom .ftopicos {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 1%;
gap: 2rem;
}
.orico_footer .fotter .footerMain .foottxtbottom .ftopicos ul {
gap: 0.75rem 1.5rem;
flex-wrap: wrap;
display: flex;
}
.orico_footer .fotter .footerMain .foottxtbottom .ftopicos ul img {
height: 30px;
width: 30px;
}
.orico_footer .fotter .footerMain .foottxtbottom .ftcopyright {
color: #b3b3b3;
font-size: 0.875rem;
}
.orico_footer .fotter .footerMain .foottxtbottom .ftcopyright a {
color: #b3b3b3;
}
.orico_footer .fotter .footerMain .foottxtbottom .batext {
color: #fff;
font-size: 14px;
margin-top: 5px;
}
.oricoCont {
width: 100%;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
margin: 3.5rem auto;
}
.oricoCont .ctitem {
width: 45%;
display: flex;
flex-direction: column;
align-items: center;
}
.oricoCont .ctitem .ctimg {
max-width: 6.25rem;
width: 3.75rem;
height: 3.75rem;
margin-top: 2%;
display: block;
margin-left: auto;
margin-right: auto;
}
.oricoCont .ctitem .cttitle {
font-size: 1.25rem;
text-align: center;
font-weight: 600;
line-height: 2.5rem;
}
.oricoCont .ctitem .ctdec {
font-size: 0.875rem;
text-align: center;
line-height: 1rem;
margin: auto;
}
@media screen and (max-width: 1777px) {
.footerico {
top: 65% !important;
bottom: 24%;
left: 50% !important;
}
}

View File

@@ -0,0 +1,350 @@
@charset "UTF-8";
.header-PC {
width: 100%;
}
.header-PC #header {
margin: 0 auto;
height: 3.75rem;
width: 100%;
position: fixed;
top: 0;
display: flex;
flex-direction: row;
align-items: center;
z-index: 999;
background: white;
color: black;
}
.header-PC #header .nav1 {
position: relative;
width: 20%;
}
.header-PC #header .nav1 img {
width: 45%;
margin-left: 40%;
}
.header-PC #header .nav2 {
position: relative;
width: 60%;
}
.header-PC #header .nav2 .navItem {
font-size: 1rem;
position: relative;
display: grid;
grid-template-columns: auto auto;
align-items: center;
justify-content: center;
width: 12.5%;
height: 60px;
text-align: center;
float: left;
text-decoration: none;
transition: all 0.3s ease;
-webkit-transition: all 0.5s ease;
}
.header-PC #header .nav2 .navItem a {
padding-right: 5px;
text-decoration: none;
word-break: keep-all;
white-space: norwap;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
text-wrap: nowrap;
}
.header-PC #header .nav2 .navItem .downimg {
height: 0.75rem;
}
.header-PC #header .nav2 .navItem .navItemConten {
width: 100%;
z-index: 999;
background-color: #f2f2f2;
max-height: 41.25rem;
box-shadow: 3px 5px 60px -20px #88909a;
position: fixed;
border: 1px solid lightgray;
top: 3.75rem;
transition: max-height 0.5s ease-out, opacity 0.5s ease-out;
left: 0;
display: none;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyleft {
float: left;
text-align: center;
width: 20%;
max-height: 41.25rem;
font-size: 1rem;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyleft li {
cursor: pointer;
zoom: 1;
clear: both;
border: 1px solid transparent;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyleft li a {
line-height: 2.75rem;
color: #656a6d;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyleft li a:hover {
color: #004bfa;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyleft li.it_active {
border-color: #dddddd;
background-color: #ffffff;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright {
max-height: 41.25rem;
min-height: 28.75rem;
overflow-y: auto;
border-left: 1px solid #dddddd;
font-weight: normal;
background-color: #fff;
margin: 0 auto;
box-shadow: -3px 0 0px #f3f3f3;
text-align: left;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dt {
font-size: 0.875rem;
line-height: 1rem;
margin-inline-start: 1.25rem;
font-weight: 600;
border-bottom: 1px solid rgba(225, 225, 225, 0.5);
padding-bottom: 0.8125rem;
padding-top: 1rem;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dt img {
height: 1rem;
max-width: 100%;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dt a {
color: #333;
text-decoration: none;
word-break: keep-all;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
text-wrap: nowrap;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dd {
font-size: 0.875rem;
line-height: 2.5rem;
padding-top: 0vw;
font-weight: 100;
display: inline-block;
margin-right: 3%;
margin-inline-start: 2.5rem;
}
.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dd a:hover {
color: #004bf9;
font-weight: 600;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-transition: all 0.2s linear;
}
.header-PC #header .nav2 .navItem .navItemConten.active {
max-height: 41.25rem; /* 根据实际内容调整合适高度 */
opacity: 1;
}
.header-PC #header .nav2 .navItem .navItemConten1 {
background-color: #fff;
color: black;
position: absolute;
top: 60px;
left: 20px;
width: auto;
height: auto;
z-index: 9999;
border-radius: 5px;
box-shadow: 0 0 1px 0 #88909a;
display: none;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 0.5rem 0;
}
.header-PC #header .nav2 .navItem .navItemConten1 li {
color: #fff;
float: left;
text-align: center;
line-height: 1.5rem;
padding: 0.5rem 2rem;
display: list-item;
}
.header-PC #header .nav2 .navItem .navItemConten1 li a {
cursor: pointer;
}
.header-PC #header .nav2 .navItem .navItemConten1 li a:hover {
color: #004bfa;
}
.header-PC #header .nav3 {
position: relative;
width: 20%;
background-color: transparent;
display: flex;
align-items: center;
cursor: pointer;
}
.header-PC #header .nav3 .searchimg {
margin-left: 10%;
}
.header-PC #header .nav3 .storetopbt {
background: #004cfa;
color: #fff;
padding: 0 0.9375rem;
border-radius: 1.25rem;
height: 2.375rem;
line-height: 2.5rem;
margin-left: 15%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
font-size: 1rem;
}
.header-PC #header .nav3 .storetopbt .storeImgico {
width: 1.25rem;
margin-right: 0.5rem;
}
.header-PC #header .nav3 .choesCountry {
position: relative;
margin-left: 15%;
}
.header-PC #header .nav3 .choesCountry .topCountry {
display: none;
width: 21.25rem;
background-color: white;
position: fixed;
right: 5%;
top: 80px;
border-radius: 15px;
box-shadow: 2px 2px 10px 1px #88909a;
}
.header-PC #header .nav3 .choesCountry .topCountry li {
width: 100%;
height: 3.125rem;
line-height: 3.125rem;
text-align: center;
display: flex;
}
.header-PC #header .nav3 .choesCountry .topCountry li .countryName {
width: 70%;
text-align: left;
margin-left: 10px;
font-size: 1rem;
}
.header-PC #header .nav3 .choesCountry .topCountry li .cico {
width: 18%;
margin-left: 0;
}
.header-PC #header .nav3 .choesCountry .topCountry li .cico .countryimg {
margin-left: 0;
margin-left: 1.25rem;
margin-top: 0.9375rem;
vertical-align: top;
}
.header-PC #header .nav3 .choesCountry .topCountry li.closec {
display: flex;
flex-direction: row;
justify-content: end;
height: 1.875rem;
}
.header-PC #header .nav3 .choesCountry .topCountry .closecountrybt {
color: #aaa;
margin-top: -5px;
cursor: pointer;
height: 20px;
width: 20px;
margin-right: 10px;
}
.header-PC .searchmodalMian {
position: fixed;
z-index: 999;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
z-index: 998;
display: none;
}
.header-PC .searchmodalMian .searchmodalct {
background-color: #fff;
padding: 1.25rem;
border-radius: 1.25rem;
box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2);
border: 1px solid rgba(0, 0, 0, 0.2);
position: fixed;
right: 2%;
width: 45%;
top: 5rem;
height: 80%;
overflow-y: auto;
z-index: 998;
}
.header-PC .searchmodalMian .searchmodalct .close-btn {
color: #aaa;
float: right;
font-size: 1.5rem;
cursor: pointer;
}
.header-PC .searchmodalMian .searchmodalct #serrchinput {
margin-left: 10%;
margin-top: 5%;
width: 80%;
height: 2.75rem;
border: 1px solid grey;
border-radius: 22px;
background-position: 95% 50%;
padding-left: 5%;
}
.header-PC .searchmodalMian .searchmodalct .searchhistory,
.header-PC .searchmodalMian .searchmodalct .popProduct {
margin-top: 5%;
margin-left: 10%;
width: 80%;
display: flex;
position: relative;
}
.header-PC .searchmodalMian .searchmodalct .searchhistory .h_title,
.header-PC .searchmodalMian .searchmodalct .popProduct .h_title {
position: absolute;
left: 0;
top: 1%;
font-size: 16px;
color: #989898;
}
.header-PC .searchmodalMian .searchmodalct .searchhistory ul,
.header-PC .searchmodalMian .searchmodalct .popProduct ul {
margin-top: 10%;
margin-left: 1%;
}
.header-PC .searchmodalMian .searchmodalct .searchhistory .popmain,
.header-PC .searchmodalMian .searchmodalct .popProduct .popmain {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.header-PC .searchmodalMian .searchmodalct .searchhistory .popmain .popitem,
.header-PC .searchmodalMian .searchmodalct .popProduct .popmain .popitem {
text-align: center;
margin-top: 10%;
margin-left: 1%;
display: flex;
flex-direction: column;
justify-content: center;
width: 30%;
}
.header-PC .searchmodalMian .searchmodalct .searchhistory .popmain .popitem .popimg,
.header-PC .searchmodalMian .searchmodalct .popProduct .popmain .popitem .popimg {
width: 7.1875rem;
height: 7.1875rem;
margin: 0 auto;
}
.header-PC .searchmodalMian .searchmodalct .searchhistory .popmain .popitem .productName,
.header-PC .searchmodalMian .searchmodalct .popProduct .popmain .popitem .productName {
font-weight: 600;
display: -webkit-box;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
font-size: 0.8rem;
}

View File

@@ -0,0 +1,159 @@
.orico_Page_productxc {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f2f2f2;
}
.orico_Page_productxc .productxcMain {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.orico_Page_productxc .productxcMain p {
font-family: inherit;
}
.orico_Page_productxc .productxcMain .culture_top {
background: #f2f2f2;
display: flex;
flex-direction: column;
}
.orico_Page_productxc .productxcMain .culture_top img {
height: auto;
max-width: 100%;
}
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con {
max-width: 101.25rem;
width: 80%;
background: #f2f2f2;
overflow: hidden;
display: flex;
margin: 0 auto;
}
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div {
width: 29%;
height: 597px;
background: #fff;
overflow: hidden;
text-align: center;
margin-left: 6%;
margin-top: 5rem;
margin-bottom: 5rem;
border-radius: 1rem;
}
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .iconimg {
display: flex;
justify-content: center;
margin-top: 3.125rem;
}
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .iconimg img {
height: auto;
max-width: 100%;
}
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .title {
font-size: 1.125rem;
font-weight: 600;
font-family: Montserrat-Bold, Montserrat;
margin-top: 2rem;
width: 90%;
margin-left: 5%;
}
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .subtitle {
width: 80%;
font-size: 0.875rem;
color: #707070;
font-family: Montserrat-Medium, Montserrat;
margin-top: 1.375rem;
margin-left: 10%;
}
.orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div:first-child {
margin-left: 0;
}
.orico_Page_productxc .productxcMain .culture_vision {
background-color: #fff;
overflow: hidden;
width: 100%;
}
.orico_Page_productxc .productxcMain .culture_vision .subtitle {
font-size: 1.25rem;
color: #101010;
line-height: 2em;
margin-bottom: 2%;
font-weight: 600;
font-family: Montserrat-Bold, Montserrat;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container {
width: 80%;
margin: 0 auto;
max-width: 101.25rem;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .title {
font-size: 3em;
font-weight: 600;
color: #101010;
text-align: center;
padding-top: 2.3%;
padding-bottom: 2%;
line-height: 2em;
font-family: "LATO-MEDIUM";
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table {
margin-bottom: 4%;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row {
display: table-row;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .left {
width: 46.7%;
text-align: center;
vertical-align: middle;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .left img {
border-radius: 1rem;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .right {
width: 46.7%;
text-align: center;
vertical-align: middle;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .right p {
margin-left: 5%;
text-align: left;
display: inline-block;
width: 90%;
font-size: 1.25rem;
color: #101010;
line-height: 2em;
margin-bottom: 2%;
font-family: Montserrat-Bold, Montserrat;
margin-right: 10%;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .right .des {
font-size: 16px;
color: #737373;
line-height: 1.6rem;
font-family: Montserrat-Medium, Montserrat;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .Table-Cell {
display: table-cell;
margin: 0;
padding: 0;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .center {
width: 6.6%;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .des {
font-size: 1rem;
color: #737373;
line-height: 1.6rem;
font-family: Montserrat-Medium, Montserrat;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .des,
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .subtitle {
text-align: left;
}
.orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 img {
border-radius: 1rem;
}

View File

@@ -0,0 +1,88 @@
@charset "UTF-8";
.orico_Page_products {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f9f9f9;
}
.orico_Page_products p, .orico_Page_products a, .orico_Page_products div, .orico_Page_products span {
font-family: "Microsoft YaHei", "Arial", sans-serif;
}
.orico_Page_products .pageMain {
width: 85%;
padding: 50px 0 10px;
margin: 0 auto;
display: flex;
flex-direction: column;
margin-top: 2%;
}
.orico_Page_products .pageMain .ori-pd-title {
font-size: 1.5em;
color: #101010;
margin-bottom: 1.25rem;
}
.orico_Page_products .pageMain .ori-pd-list {
display: flex;
flex-wrap: wrap; /* 自动换行 */
justify-content: flex-start; /* 水平方向均匀分布 */
}
.orico_Page_products .pageMain .ori-pd-list .oripditem {
width: 24%;
float: left;
background: #fff;
padding-bottom: 1em;
margin-top: 15px;
position: relative;
margin-right: 1%;
padding-top: 30px;
padding-bottom: 70px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem .prdimg {
display: inline-block;
width: 100%;
max-width: 220px;
margin: 25px auto;
display: none;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem .prdimg-show {
display: block;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem .prdName {
color: #101010;
font-size: 1.125rem;
padding-bottom: 0.625rem;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem .prddec {
font-size: 1.125rem;
color: #737373;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors {
width: 92%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
margin-top: 0.3125rem;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors .prdolorit {
width: 1.3rem;
height: 1.3rem;
border-radius: 0.65rem;
cursor: pointer;
margin: 0 0.3125rem;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem .prd-colors .prdolorit img {
width: 100%;
height: 100%;
border-radius: 0.65rem;
}
.orico_Page_products .pageMain .ori-pd-list .oripditem:hover {
box-shadow: 0px 5px 35px rgba(227, 227, 227, 0.75);
transform: translate3d(0, -2px, 0);
}

View File

@@ -0,0 +1,393 @@
@charset "UTF-8";
.orico_Page_prdetail {
width: 100%;
position: relative;
height: 100vh;
overflow-y: auto;
overflow-x: hidden;
background: #f1f1f1;
/* 模态框背景 */
/* 模态框内容 */
}
.orico_Page_prdetail p,
.orico_Page_prdetail a,
.orico_Page_prdetail div,
.orico_Page_prdetail span {
font-family: "Microsoft YaHei", "Arial", sans-serif;
}
.orico_Page_prdetail .oriprdetail {
display: flex;
flex-direction: column;
padding: 2.5rem 0 1.375rem 0;
position: relative;
margin-top: 3%;
}
.orico_Page_prdetail .oriprdetail .product_address {
width: 70%;
margin: 0 auto;
display: flex;
flex-direction: row;
align-items: center;
font-size: 0.75rem;
margin-bottom: 1.3%;
}
.orico_Page_prdetail .oriprdetail .product_address .pathname {
font-size: 0.75rem;
color: #737373;
}
.orico_Page_prdetail .oriprdetail .product_address .pathname:first {
color: #333;
}
.orico_Page_prdetail .oriprdetail .product_address .pathname:hover {
color: #004bfa;
}
.orico_Page_prdetail .oriprdetail .product_address .arrow {
position: relative;
width: 0.375rem;
height: 0.375rem;
border-right: 1px solid #737373;
border-bottom: 1px solid #737373;
transform: rotate(315deg);
margin: 0 0.625rem;
}
.orico_Page_prdetail .oriprdetail .product_address .arrow:last-child {
display: none;
}
.orico_Page_prdetail .oriprdetail .cp {
width: 70%;
margin: 0 auto;
margin-bottom: 1.875rem;
overflow: hidden;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl {
width: 48%;
margin-right: 3em;
float: left;
position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview {
position: relative;
width: 100%;
overflow: hidden;
height: 31.875rem;
display: flex;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .smallImg {
width: 80px;
overflow: hidden;
float: left;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .smallImg #imageMenu {
width: 100%;
overflow: hidden;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .smallImg #imageMenu li {
width: 5rem;
height: 5.4375rem;
overflow: hidden;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .smallImg #imageMenu li img {
width: 98%;
cursor: pointer;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg {
position: relative;
margin: 0 auto;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg #midimg {
width: 100%;
max-width: 510px;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .scrollbutton {
width: 3.3125rem;
height: 4.5rem;
overflow: hidden;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgUp,
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgUp.disabled {
background: url(../productDetailimg/fl.png) no-repeat;
position: absolute;
z-index: 1;
top: 50%;
transform: translate(0%, -50%);
cursor: pointer;
left: -2%;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgUp:hover,
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgUp.disabled:hover {
background: url(../productDetailimg/fl1.png) no-repeat;
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgDown,
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgDown.disabled {
background: url(../productDetailimg/rh.png) no-repeat;
position: absolute;
z-index: 1;
right: -2%;
top: 50%;
transform: translate(0%, -50%);
}
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgDown:hover,
.orico_Page_prdetail .oriprdetail .cp .cpfl .preview .bigImg .smallImgDown.disabled:hover {
background: url(../productDetailimg/rh1.png) no-repeat;
}
.orico_Page_prdetail .oriprdetail .cp .cprh {
width: 45%;
float: left;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon {
display: flex;
flex-direction: column;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .ctit1 {
font-size: 1.25em;
color: #333;
line-height: 1.875em;
border-bottom: 1px solid #ddd;
padding-bottom: 0.5rem;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .proTfg {
margin-top: 0.5rem;
padding: 1rem 0;
font-size: 0.75rem;
border-bottom: 1px solid #ddd;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .proTfg .swt-Table {
display: table;
width: 100%;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .proTfg .swt-Table .Table-Row {
display: table-row;
width: 100%;
clear: both;
overflow: hidden;
font-size: 0.875em;
color: #737373;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .proTfg .swt-Table .Table-Row .Table-Cell {
display: table-cell;
margin: 0;
padding: 4px 0;
line-height: 1.4em;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .proTfg .swt-Table .Table-Row .ms2 {
width: 5%;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .proTfg .swt-Table .Table-Row .ms3 {
width: 30%;
color: #333;
font-size: 14px;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .proTfg .swt-Table .Table-Row .ms4 {
width: 65%;
font-size: 14px;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .prcolors {
position: relative;
overflow: hidden;
display: flex;
flex-direction: row;
align-items: center;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .prcolors .dt {
margin-right: 0px;
line-height: 40px;
font-weight: 600;
font-size: 1rem;
color: #666;
font-size: 0.875rem;
margin-right: 1.875rem;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .prcolors .dowebok {
width: auto;
float: left;
overflow: hidden;
display: flex;
flex-direction: row;
align-items: center;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .prcolors .dowebok .itemcolor {
width: 20px;
height: 20px;
float: left;
margin-right: 9px;
cursor: pointer;
margin-bottom: 2px;
border: 1px solid #d4d4d4;
border-radius: 10px;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .prcolors .dowebok .itemcolor img {
width: 20px;
height: 20px;
border-radius: 10px;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .cpcon .prcolors .dowebok .itemcolor.on {
width: 20px;
height: 20px;
border-radius: 12px;
border: 2px solid #737373;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .buy {
padding: 1rem 0;
margin: 1rem 0;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .buy .thebt {
font-size: 0.875rem;
padding: 0.5rem 30px;
text-align: center;
margin-right: 1.125rem;
border-radius: 32px;
cursor: pointer;
margin-bottom: 1.125rem;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .buy .bttype1 {
border: 0.0625rem solid #0044e2;
background: #0044e2;
color: #fff;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .buy .bttype2 {
border: 0.0625rem solid #0044e2;
color: #0044e2;
background: #fff;
}
.orico_Page_prdetail .oriprdetail .cp .cprh .buy .bttype3 {
border: 0.0625rem solid #009fdf;
background: #009fdf;
color: #fff;
}
.orico_Page_prdetail .oriprdetail .oriprInfo {
width: 100%;
background: #fff;
padding: 20px 0 21px 0;
position: relative;
display: flex;
flex-direction: column;
}
.orico_Page_prdetail .oriprdetail .oriprInfo img {
max-width: 100%;
}
.orico_Page_prdetail .oriprdetail .oriprInfo .titleprinfo {
text-align: center;
display: inline-block;
margin: 0 auto;
font-size: 1rem;
font-weight: bold;
}
.orico_Page_prdetail .oriprdetail .oriprInfo .products_des {
width: 75%;
margin-bottom: 50px;
}
.orico_Page_prdetail .oriprdetail .oriprInfo .products_des img {
text-align: center;
display: block;
}
.orico_Page_prdetail .XJmodal {
display: none;
position: fixed;
z-index: 2;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: hidden;
background-color: rgba(0, 0, 0, 0.8);
}
.orico_Page_prdetail .XJmodal-content {
background-color: #fefefe;
margin: 5% auto;
padding: 40px;
padding-top: 10px;
border: 1px solid #888;
width: 80%;
max-width: 600px;
z-index: 111;
/* 关闭按钮 */
}
.orico_Page_prdetail .XJmodal-content h2 {
width: 100%;
text-align: center;
display: inline-block;
padding-bottom: 40px;
}
.orico_Page_prdetail .XJmodal-content .close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.orico_Page_prdetail .XJmodal-content .close:hover,
.orico_Page_prdetail .XJmodal-content .close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
.orico_Page_prdetail .XJmodal-content .tkitem {
display: flex;
flex-direction: row;
margin-bottom: 20px;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group {
width: 50%;
display: flex;
flex-direction: column;
font-size: 14px;
margin-right: 20px;
margin-bottom: 15px;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group .detail-w {
width: 40%;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group .detail-w01 {
width: 90%;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group input[type=text],
.orico_Page_prdetail .XJmodal-content .tkitem .form-group input[type=email],
.orico_Page_prdetail .XJmodal-content .tkitem .form-group select,
.orico_Page_prdetail .XJmodal-content .tkitem .form-group textarea {
border: 1px solid #ccc;
border-radius: 4px;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group textarea {
min-height: 100px;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group label {
display: block;
margin-bottom: 5px;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group input {
height: 2.75rem;
line-height: 2.75rem;
padding: 0 0.625rem;
margin-top: 0.625rem;
border: 1px solid #dbdbdb;
display: inline-block;
}
.orico_Page_prdetail .XJmodal-content .tkitem .form-group select {
height: 2.75rem;
line-height: 2.75rem;
padding: 0 0.625rem;
margin-top: 0.625rem;
border: 1px solid #dbdbdb;
display: inline-block;
}
.orico_Page_prdetail .XJmodal-content .tkitem > .form-group:nth-child(2n) {
margin-right: 0;
}
.orico_Page_prdetail .XJmodal-content .submit-btn {
background-color: #004CFA;
color: white;
padding: 10px 100px;
border: none;
border-radius: 4px;
cursor: pointer;
margin: 0 auto;
display: block;
}
.orico_Page_prdetail .XJmodal-content .submit-btn:hover {
background-color: #004CFA;
}

View File

@@ -0,0 +1,153 @@
@font-face {
font-family: "Montserrat";
src: url("../fonts/Montserrat-Regular.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Montserrat-Bold";
src: url("../fonts/Montserrat-Bold.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Montserrat-Medium";
src: url("../fonts/Montserrat-Medium.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
::-webkit-scrollbar {
width: 0.625rem;
background: #d2eafb;
}
::-webkit-scrollbar-track {
border-radius: 0.5rem;
background: #eeeeee;
}
* {
margin: 0;
padding: 0;
font-family: 'Montserrat';
}
*:hover {
transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
}
body {
font-size: 1.2em;
font-weight: 400;
color: #333;
}
select,
input,
textarea,
button {
outline: none;
font-size: 0.875rem;
border-radius: 0;
-webkit-border-radius: 0;
color: #414446;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
}
a {
color: #000;
cursor: pointer;
text-decoration: none;
transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
text-decoration: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
img {
display: block;
}
ul li {
padding: 2px 0;
list-style-type: none;
}
ol,
ul,
a {
list-style: none;
}
/* 修改垂直滚动条 */
::-webkit-scrollbar {
width: 6px;
/* 修改宽度 */
}
/* 修改滚动条轨道背景色 */
::-webkit-scrollbar-track {
background-color: transparent;
}
/* 修改滚动条滑块颜色 */
::-webkit-scrollbar-thumb {
background-color: #ccc;
}
/* 修改滚动条滑块悬停时的颜色 */
::-webkit-scrollbar-thumb:hover {
background-color: #D8DFE8;
}
/* 修改滚动条滑块移动时的颜色 */
::-webkit-scrollbar-thumb:active {
background-color: #D8DFE8;
}
/* 修改滚动条滑块的圆角 */
::-webkit-scrollbar-thumb {
border-radius: 5px;
}
/* 整体滚动条 */
* {
scrollbar-width: thin;
/* 滚动条宽度 */
scrollbar-color: #D8DBE6 transparent;
/* 滚动条颜色(滑块颜色 轨道颜色) */
}
/* 滚动条轨道 */
*::-moz-scrollbar-track {
background-color: #f0f0f0;
}
/* 滚动条滑块 */
*::-moz-scrollbar-thumb {
background-color: #D8DBE6;
border-radius: 5px;
/* 滑块的圆角 */
}
/* 滚动条的上下箭头 */
*::-moz-scrollbar-button {
display: none;
/* 隐藏上下箭头 */
}
/* 滚动条的上下箭头:向上箭头 */
*::-moz-scrollbar-button:vertical:decrement {
display: none;
}
/* 滚动条的上下箭头:向下箭头 */
*::-moz-scrollbar-button:vertical:increment {
display: none;
}

BIN
public/static/index/fonts/Montserrat-Bold.ttf (Stored with Git LFS) Executable file

Binary file not shown.

BIN
public/static/index/fonts/Montserrat-Medium.ttf (Stored with Git LFS) Executable file

Binary file not shown.

BIN
public/static/index/fonts/Montserrat-Regular.ttf (Stored with Git LFS) Executable file

Binary file not shown.

BIN
public/static/index/fonts/Montserrat-SemiBold.ttf (Stored with Git LFS) Executable file

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 401 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 843 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 678 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 591 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 879 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 523 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 928 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

1
public/static/index/js/before-after.min.js vendored Executable file
View File

@@ -0,0 +1 @@
!function(a){function b(b,c,d){b.on("mousedown.ba-events touchstart.ba-events",function(e){b.addClass("ba-draggable"),c.addClass("ba-resizable");var f=e.pageX?e.pageX:e.originalEvent.touches[0].pageX,g=b.outerWidth(),h=b.offset().left+g-f,i=d.offset().left,j=d.outerWidth();minLeft=i+10,maxLeft=i+j-g-10,b.parents().on("mousemove.ba-events touchmove.ba-events",function(b){var c=b.pageX?b.pageX:b.originalEvent.touches[0].pageX;leftValue=c+h-g,leftValue<minLeft?leftValue=minLeft:leftValue>maxLeft&&(leftValue=maxLeft),widthValue=100*(leftValue+g/2-i)/j+"%",a(".ba-draggable").css("left",widthValue),a(".ba-resizable").css("width",widthValue)}).on("mouseup.ba-events touchend.ba-events touchcancel.ba-events",function(){b.removeClass("ba-draggable"),c.removeClass("ba-resizable"),a(this).off(".ba-events")}),e.preventDefault()})}a.fn.beforeAfter=function(){var c=this,d=c.width()+"px";c.find(".resize img").css("width",d),b(c.find(".handle"),c.find(".resize"),c),a(window).resize(function(){var a=c.width()+"px";c.find(".resize img").css("width",a)})}}(jQuery);

View File

@@ -0,0 +1,51 @@
//加载公共头部和尾部
async function loadHTML(url, targetId) {
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const html = await response.text();
document.getElementById(targetId).innerHTML = html;
} catch (error) {
console.error('Error loading HTML:', error);
}
}
// 加载头部
loadHTML('head.html', 'header');
// 加载尾部
loadHTML('footer.html', 'footer');
$(document).ready(function() {
// 封装一个函数用于处理鼠标悬停显示和隐藏内容
function handleHover($element, $content) {
$element.mouseenter(function() {
$content.stop(true, true).slideDown(400);
}).mouseleave(function() {
$content.stop(true, true).slideUp(400);
});
}
// 处理第一个导航项
handleHover($('.navItem').eq(0), $('.navItem').eq(0).find('.navItemConten'));
// 鼠标移入navItem_cyleft里面的li标签添加类移除其他li的类
$('.navItem_cyleft li').mouseenter(function() {
$(this).addClass('it_active').siblings().removeClass('it_active');
});
// 处理第5 - 8个导航项
for (let i = 4; i < 8; i++) {
handleHover($('.navItem').eq(i), $('.navItem').eq(i).find('.navItemConten1'));
}
// 点击搜索
$('#openModalBtn').click(function() {
$('#scmodal').toggle();
});
$('.close-btn').click(function() {
$('#scmodal').hide();
});
// 点击选择国家
$('#countrycheck').click(function() {
$('#top-country').toggle();
});
$('.closecountrybt').click(function() {
$('#top-country').hide();
});
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 312 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 731 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 859 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 230 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 401 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 111 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 133 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 163 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 879 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 523 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1008 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Some files were not shown because too many files have changed in this diff Show More