diff --git a/.gitignore b/.gitignore index e3b99a3c..8c9279ce 100644 --- a/.gitignore +++ b/.gitignore @@ -9,8 +9,8 @@ Thumbs.db .env.prod .htaccess .user.ini -404.html -index.html +/404.html +/index.html public/dist* public/opendoc diff --git a/app/admin/controller/v1/System.php b/app/admin/controller/v1/System.php index 585b3f90..fea1f3b7 100644 --- a/app/admin/controller/v1/System.php +++ b/app/admin/controller/v1/System.php @@ -354,6 +354,18 @@ class System 'url' => (string)url('/index/topic/power_prodline/index') ], ] + ], + [ + 'id' => 9, + 'name' => '笔记本（AI PC）专题', + 'url' => '', + 'children' => [ + [ + 'id' => 91, + 'name' => '首页', + 'url' => (string)url('/index/topic/laptop/index') + ], + ] ] ]; } diff --git a/app/admin/model/v1/ProductCategoryModel.php b/app/admin/model/v1/ProductCategoryModel.php index eb4dabaf..b642190a 100644 --- a/app/admin/model/v1/ProductCategoryModel.php +++ b/app/admin/model/v1/ProductCategoryModel.php @@ -32,7 +32,8 @@ class ProductCategoryModel extends ProductCategoryBaseModel // 所属产品目录分类id查询 public function scopeTcoId($query, $value) { - $query->where('related_tco_category', '=', $value); + // $query->where('related_tco_category', '=', $value); + $query->whereRaw('FIND_IN_SET(:ref_id, related_tco_category)', ['ref_id' => $value]); } /** diff --git a/app/admin/validate/v1/ProductCategoryValidate.php b/app/admin/validate/v1/ProductCategoryValidate.php index d1bf3df3..80f55ba5 100644 --- a/app/admin/validate/v1/ProductCategoryValidate.php +++ b/app/admin/validate/v1/ProductCategoryValidate.php @@ -23,7 +23,7 @@ class ProductCategoryValidate extends Validate 'name' => 'require|max:64', 'icon' => 'max:125', 'desc' => 'max:255', - 'related_tco_category' => 'integer', + 'related_tco_category' => 'string|checkRelatedTcoCategory', 'sort' => 'integer', 'level' => 'integer', 'is_show' => 'in:0,1', @@ -39,25 +39,26 @@ class ProductCategoryValidate extends Validate * @var array */ protected $message = [ - 'id.require' => 'ID不能为空', - 'id.integer' => 'ID必须为整数', - 'language_id.require' => '语言ID不能为空', - 'language_id.integer' => '语言ID必须为整数', - 'unique_id.require' => '唯一标识不能为空', - 'pid.different' => '父级ID不能为自身', - 'pid.checkPidNotBeChildren' => '父级ID不能为自身的子分类', - 'pid.integer' => '父级ID必须为整数', - 'name.require' => '名称不能为空', - 'name.max' => '名称最多不能超过64个字符', - 'icon.max' => '图标最多不能超过125个字符', - 'desc.max' => '描述最多不能超过255个字符', - 'related_tco_category.integer' => '关联TCO分类格式错误', - 'sort.integer' => '排序格式错误', - 'level.integer' => '级别格式错误', - 'is_show.in' => '是否显示格式错误', - 'seo_title.max' => 'SEO标题最多不能超过255个字符', - 'seo_keywords.max' => 'SEO关键字最多不能超过255个字符', - 'seo_desc.max' => 'SEO描述最多不能超过255个字符', + 'id.require' => 'ID不能为空', + 'id.integer' => 'ID必须为整数', + 'language_id.require' => '语言ID不能为空', + 'language_id.integer' => '语言ID必须为整数', + 'unique_id.require' => '唯一标识不能为空', + 'pid.different' => '父级ID不能为自身', + 'pid.checkPidNotBeChildren' => '父级ID不能为自身的子分类', + 'pid.integer' => '父级ID必须为整数', + 'name.require' => '名称不能为空', + 'name.max' => '名称最多不能超过64个字符', + 'icon.max' => '图标最多不能超过125个字符', + 'desc.max' => '描述最多不能超过255个字符', + 'related_tco_category.string' => '关联TCO分类格式错误', + 'related_tco_category.checkRelatedTcoCategory' => '该TCO分类已绑定', + 'sort.integer' => '排序格式错误', + 'level.integer' => '级别格式错误', + 'is_show.in' => '是否显示格式错误', + 'seo_title.max' => 'SEO标题最多不能超过255个字符', + 'seo_keywords.max' => 'SEO关键字最多不能超过255个字符', + 'seo_desc.max' => 'SEO描述最多不能超过255个字符', ]; // 验证pid @@ -84,4 +85,32 @@ class ProductCategoryValidate extends Validate { return $this->remove('id', 'require|integer')->remove('pid', 'different|checkPidNotBeChildren'); } + + // 验证related_tco_category + protected function checkRelatedTcoCategory($value, $rule, $data = []) + { + if (empty($value)) { + return true; + } + + $val = ProductCategoryModel::where(function($query) use($value) { + $arr = explode(",", $value); + foreach ($arr as $v) { + $query->whereFindInSet('related_tco_category', $v, 'OR'); + } + })->column('id'); + if (!empty($val)) { + $size = count($val); + // 如果存在超过一个，直接验证失败 + if ($size > 1) { + return false; + } + // 如果存在一个，并存在的id不为自身，验证失败（考虑更新场景查到自身情况） + if ($size == 1 && $val[0] != $data['id']) { + return false; + } + } + + return true; + } } diff --git a/app/admin/validate/v1/SysBannerItemValidate.php b/app/admin/validate/v1/SysBannerItemValidate.php index b38cba73..9afbe3fb 100644 --- a/app/admin/validate/v1/SysBannerItemValidate.php +++ b/app/admin/validate/v1/SysBannerItemValidate.php @@ -18,7 +18,7 @@ class SysBannerItemValidate extends Validate 'banner_id' => 'require|integer|gt:0', 'title' => 'require|max:256', 'title_txt_color' => 'max:7', - 'desc' => 'max:1024', + 'desc' => 'max:2048', 'desc_txt_color' => 'max:7', 'type' => 'in:image,video', 'image' => 'max:255', @@ -45,7 +45,7 @@ class SysBannerItemValidate extends Validate 'title.require' => '名称不能为空', 'title.max' => '名称最多不能超过256个字符', 'title_txt_color.max' => '名称字体颜色最多不能超过7个字符', - 'desc.max' => '描述最多不能超过1024个字符', + 'desc.max' => '描述最多不能超过2048个字符', 'desc_txt_color.max' => '描述字体颜色最多不能超过7个字符', 'type.in' => '显示类型必须是image或video', 'image.max' => '图片地址最多不能超过255个字符', diff --git a/app/index/controller/Common.php b/app/index/controller/Common.php index 0b7f4914..880f8072 100644 --- a/app/index/controller/Common.php +++ b/app/index/controller/Common.php @@ -107,6 +107,13 @@ abstract class Common extends BaseController 'status' => 1 ]) ->where('status', '=', 1) + ->where(function($query) { + // 临时代码，移动端暂时不显示 "AI PC" + if (request()->from == 'mobile') { + $table_name = SysNavigationItemModel::getTable(); + $query->whereNotIn($table_name . ".id", [77, 78]); + } + }) ->order(['sort' => 'asc', 'id' => 'asc']) ->select(); if ($nav->isEmpty()) { @@ -210,7 +217,7 @@ abstract class Common extends BaseController ]; } unset($current); - + return $data; } } diff --git a/app/index/controller/TopicLaptop.php b/app/index/controller/TopicLaptop.php new file mode 100644 index 00000000..1cba3335 --- /dev/null +++ b/app/index/controller/TopicLaptop.php @@ -0,0 +1,105 @@ + function ($query) { + $query->withoutField(['sort', 'created_at', 'updated_at', 'deleted_at']) + ->order(['sort' => 'asc', 'id' => 'desc']) + ->enabled(true); + } + ]) + ->atPlatform(request()->from) + ->uniqueLabel([ + 'BANNER_693a268c8aa5f', // 专题 - 笔记本首页 - 焦点图 + 'BANNER_693a26b1ad252', // 专题 - 笔记本首页 - 性能介绍 + 'BANNER_693a27b767c8c', // 专题 - 笔记本首页 - CPU介绍 + 'BANNER_693a28740b8a7', // 专题 - 笔记本首页 - 显卡介绍 + 'BANNER_693a28aa8412d', // 专题 - 笔记本首页 - 运行内存介绍 + 'BANNER_693a29009fa72', // 专题 - 笔记本首页 - 硬盘介绍 + 'BANNER_693a29263c609', // 专题 - 笔记本首页 - 散热系统介绍 + 'BANNER_693a2959958bc', // 专题 - 笔记本首页 - 行业App运行介绍 + 'BANNER_693a298342b38', // 专题 - 笔记本首页 - 柔光屏介绍 + 'BANNER_693a2ad31fbe8', // 专题 - 笔记本首页 - 色域介绍 + 'BANNER_693a2b0327ac3', // 专题 - 笔记本首页 - 防眩光介绍 + 'BANNER_693a2cc70c762', // 专题 - 笔记本首页 - 外形质感介绍 + 'BANNER_693a2d3113d14', // 专题 - 笔记本首页 - 网卡介绍 + 'BANNER_693a2d53ac247', // 专题 - 笔记本首页 - 电池续航介绍 + 'BANNER_693a2d7f5fa21', // 专题 - 笔记本首页 - 接口介绍 + 'BANNER_693a2f2114eb3', // 专题 - 笔记本首页 - 使用场景焦点图 + 'BANNER_693a2f92baaa3', // 专题 - 笔记本首页 - 摄像头/麦克风/安全介绍 + 'BANNER_693a2fad26f55', // 专题 - 笔记本首页 - 系统预装介绍 + 'BANNER_693a2ff4629bd', // 专题 - 笔记本首页 - 产品检测介绍 + 'BANNER_693a30e9e4572', // 专题 - 笔记本首页 - 网页脚注 + ]) + ->language($this->lang_id) + ->enabled(true) + ->order(['sort' => 'asc', 'id' => 'desc']) + ->select(); + + $data = []; + if (!$banners->isEmpty()) { + $banners_map = []; + foreach ($banners as $banner) { + $banners_map[$banner->unique_label] = $banner; + } + + // 焦点图轮播图 + $data['top_focus_images'] = data_get($banners_map, 'BANNER_693a268c8aa5f')?->items->toArray(); + // 性能介绍 + $data['perf'] = data_get($banners_map, 'BANNER_693a26b1ad252')?->items->toArray(); + // CPU介绍 + $data['cpu'] = data_get($banners_map, 'BANNER_693a27b767c8c')?->items->toArray(); + // 显卡介绍 + $data['gpu'] = data_get($banners_map, 'BANNER_693a28740b8a7')?->items->toArray(); + // 运行内存介绍 + $data['ram'] = data_get($banners_map, 'BANNER_693a28aa8412d')?->items->first()?->toArray(); + // 硬盘介绍 + $data['hard_drive'] = data_get($banners_map, 'BANNER_693a29009fa72')?->items->toArray(); + // 散热系统介绍 + $data['cooling_system'] = data_get($banners_map, 'BANNER_693a29263c609')?->items->toArray(); + // 行业App运行介绍 + $data['apps'] = data_get($banners_map, 'BANNER_693a2959958bc')?->items->first()?->toArray(); + // 柔光屏介绍 + $data['screen_soft_light'] = data_get($banners_map, 'BANNER_693a298342b38')?->items->toArray(); + // 色域介绍 + $data['screen_color_gamut'] = data_get($banners_map, 'BANNER_693a2ad31fbe8')?->items->toArray(); + // 防眩光介绍 + $data['screen_anti_glare'] = data_get($banners_map, 'BANNER_693a2b0327ac3')?->items->toArray(); + // 外形质感介绍 + $data['exterior_texture'] = data_get($banners_map, 'BANNER_693a2cc70c762')?->items->toArray(); + // 网卡介绍 + $data['network_card'] = data_get($banners_map, 'BANNER_693a2d3113d14')?->items->toArray(); + // 电池续航介绍 + $data['battery_life'] = data_get($banners_map, 'BANNER_693a2d53ac247')?->items->toArray(); + // 接口介绍 + $data['interface'] = data_get($banners_map, 'BANNER_693a2d7f5fa21')?->items->toArray(); + // 使用场景焦点图 + $data['scene_focus_images'] = data_get($banners_map, 'BANNER_693a2f2114eb3')?->items->toArray(); + // 摄像头/麦克风/安全介绍 + $data['camare_microphone_security'] = data_get($banners_map, 'BANNER_693a2f92baaa3')?->items->toArray(); + // 系统预装介绍 + $data['unified_preinstall'] = data_get($banners_map, 'BANNER_693a2fad26f55')?->items->first()?->toArray(); + // 产品检测介绍 + $data['product_testing'] = data_get($banners_map, 'BANNER_693a2ff4629bd')?->items->toArray(); + // 网页脚注 + $data['webpage_footnotes'] = data_get($banners_map, 'BANNER_693a30e9e4572')?->items->first()?->toArray(); + } + View::assign('data', $data); + + return View::fetch('index'); + } +} diff --git a/app/index/lang/en-us/pc.php b/app/index/lang/en-us/pc.php index 51368639..4aa02b3f 100644 --- a/app/index/lang/en-us/pc.php +++ b/app/index/lang/en-us/pc.php @@ -224,4 +224,21 @@ return [ '联系我们' => 'Contact US', '目录' => 'Content' ], -]; \ No newline at end of file + + // 笔记本专题 - 首页 + 'topiclaptop/index' => [ + 'CineBench R23 多核跑分' => 'Outperforms Ryzen 5 & Intel i5', + '*此跑分为ORICO实验室测定所得，请以实际使用为准' => '*Data measured by ORICO Lab. Actual performance may vary.', + '3DMARK Time Spy显卡得分' => 'Handles Office & Gaming with Ease', + '肯辛通锁孔' => 'Kensington
Lock Slot', + '千兆网口' => 'Gigabit
Ethernet', + 'USB-A
(5Gbps)' => 'USB-A
(5Gbps)', + '3.5mm
耳麦合一' => '3.5mm
Combo Audio', + 'TF口3.0' => 'TF 3.0
Card Slot', + '全功能
USB-C' => 'All-in-One
USB-C', + "接口大满贯" => "Full-Featured Ports", + "酷睿i5-12450H" => "Core i5-12450H", + "锐龙9 6900HX" => "Ryzen9 6900HX", + "标配多种接口，会议室连接电脑、U盘传输文件、TF卡读取等，全都轻松搞定" => "Versatile Ports for Easy Connectivity. Effortlessly link to pro", + ], +]; diff --git a/app/index/route/route.php b/app/index/route/route.php index 52389cb9..68203058 100644 --- a/app/index/route/route.php +++ b/app/index/route/route.php @@ -107,10 +107,16 @@ Route::group('topic', function () { }); // 专题 - 电力品线 - Route::group("power_prodline", function() { + Route::group('power_prodline', function() { // 专题 - 电力品线首页 Route::get('index', 'TopicPowerProdline/index'); }); + + // 专题 - 笔记本电脑 + Route::group('laptop', function() { + // 专题 - 笔记本电脑首页 + Route::get('index', 'TopicLaptop/index'); + }); }); // 数据迁移 diff --git a/app/index/view/mobile/topic_laptop/index.html b/app/index/view/mobile/topic_laptop/index.html new file mode 100644 index 00000000..6de16ef2 --- /dev/null +++ b/app/index/view/mobile/topic_laptop/index.html @@ -0,0 +1,13 @@ +{extend name="public/base" /} +{block name="style"} + +{/block} +{block name="header"} + +{/block} +{block name="main"} + +{/block} +{block name="script"} + +{/block} \ No newline at end of file diff --git a/app/index/view/pc/public/header.html b/app/index/view/pc/public/header.html index 934ff36f..b29fb394 100644 --- a/app/index/view/pc/public/header.html +++ b/app/index/view/pc/public/header.html @@ -284,4 +284,4 @@ $('#top-country').hide(); }); }); - \ No newline at end of file + diff --git a/app/index/view/pc/topic_laptop/index.html b/app/index/view/pc/topic_laptop/index.html new file mode 100644 index 00000000..a8844f0f --- /dev/null +++ b/app/index/view/pc/topic_laptop/index.html @@ -0,0 +1,1504 @@ +{extend name="public/base" /} +{block name="style"} + + + + + + + + + + + + + + + + + + + + + + + + + + + + +{/block} +{block name="main"} +{notempty name="data.top_focus_images"} +
+
+ {volist name="data.top_focus_images" id="tfi"} +
+
+
{$tfi.title}
+
{$tfi.desc||raw|htmlspecialchars_decode}
+
+ + {eq name=":cookie('think_lang')" value="en-us"} + + {else/} + + {/eq} + +
+
+ {$tfi.title} +
+ {/volist} +
+
+{/notempty} +{notempty name="data.perf"} +
+
+
+ {notempty name="data.perf.0"}{$data.perf.0.title}{/notempty} +
+
+
{notempty name="data.perf.1"}{$data.perf.1.title}{/notempty}
+
{notempty name="data.perf.2"}{$data.perf.2.title}{/notempty}
+
+
+
+ {notempty name="data.perf.3"}{$data.perf.3.title}{/notempty} +
+
+
+ {notempty name="data.perf.4"}{$data.perf.4.title}{/notempty} +
+ +
+ {notempty name="data.perf.5"}{$data.perf.5.title}{/notempty} +
+
+
+
+ {notempty name="data.perf.6"}{$data.perf.6.title}{/notempty} +
+
+ {notempty name="data.perf.7"}{$data.perf.7.title}{/notempty} + {notempty name="data.perf.8"}{$data.perf.8.title}{/notempty} +
+
+ {notempty name="data.perf.9"}{$data.perf.9.title}{/notempty} +
+
+
+{/notempty} +{notempty name="data.cpu"} +{assign name="cpu_first_section" value=":array_shift($data.cpu)" /} +
+
+
{$cpu_first_section.title|default=''}
+

{$cpu_first_section.short_title|default=''}

+
+
+ {volist name="data.cpu" id="co"} + {$co.title} + {/volist} +
+
+
+ {$cpu_first_section.desc|default=''|raw} +
+{/notempty} +
+
{:lang_i18n('CineBench R23 多核跑分')}
+
+
+
+
+
+
+
+
+ Ryzen7 7735HS: + 13766 +
+
+
+
+
+
+
+
+
+ Ryzen5 7640HS: + 12950 +
+
+
+
+
+
+
+
+
+ {:lang_i18n('锐龙9 6900HX')}: + 13183 +
+
+
+
+
+
+
+
+
+ {:lang_i18n('酷睿i5-12450H')}: + 10200 +
+
+
+
+
+
+
+
+
+ Ryzen5 6600H: + 10297 +
+
+
+
{:lang_i18n('*此跑分为ORICO实验室测定所得，请以实际使用为准')}
+
+{notempty name="data.gpu"} +{assign name="gpu_first_section" value=":array_shift($data.gpu)"/} +
+
+
{$gpu_first_section.title|default=''|raw}
+ {eq name=":cookie('think_lang')" value="en-us"} +
{$gpu_first_section.short_title|default=''|raw}
+
+ +
+ {else/} +
{$gpu_first_section.short_title|default=''|raw}
+
+ +
+ {/eq} +
+
+ {volist name="data.gpu" id="go"} + + {/volist} +
+
+{/notempty} +
+
{:lang_i18n('3DMARK Time Spy显卡得分')}
+
+
+
+
+
+
+
+
+ Ryzen7 7735HS: + 1700 +
+
+
+
+
+
+
+
+
+ NVIDIA GTX 750: + 1000 +
+
+
+
+
+
+
+
+
+ i7-13620H: + 1000 +
+
+
+
+
+
+
+
+
+ Ryzen5 6600H: + 950 +
+
+
+
{:lang_i18n('*此跑分为ORICO实验室测定所得，请以实际使用为准')}
+
+{notempty name="data.ram"} +
+
+
+
{$data.ram.title|raw}
+
+ {eq name=":cookie('think_lang')" value="en-us"} +
{$data.ram.short_title|raw}
+ {else/} +
{$data.ram.short_title|raw}
+ {/eq} +
+
+
+ {$data.ram.desc|raw} +
+
+
+{/notempty} +{notempty name="data.hard_drive"} +
+ {assign name="hard_drive_first" value=":array_shift($data.hard_drive)"/} +
+ {eq name=":cookie('think_lang')" value="en-us"} +
{$hard_drive_first.title|default=''|raw}
+ {else/} +
{$hard_drive_first.title|default=''|raw}
+ {/eq} +
+ {volist name="data.hard_drive" id="ho"} + + {/volist} +
+
+
+{/notempty} +
+ {notempty name="data.cooling_system"} + {notempty name="$data.cooling_system.0"} +
+
{$data.cooling_system.0.title|raw}
+

{$data.cooling_system.0.short_title|raw}

+
+ {/notempty} +
+ {notempty name="data.cooling_system.0"} + + +
{$data.cooling_system.0.desc|raw}
+ {/notempty} +
+
+ {notempty name="data.cooling_system.1"}{/notempty} + {notempty name="data.cooling_system.2"}{/notempty} +
+
+ {notempty name="data.cooling_system.3"}{/notempty} +
+
+
+
+{/notempty} +{notempty name="data.apps"} +
+
{$data.apps.title|default=''}
+
+
+ +
+
+
{$data.apps.desc|default=''|raw}
+
+{/notempty} +{notempty name="data.screen_soft_light"} +{assign name="soft_light_first" value=":array_shift($data.screen_soft_light)"/} +
+
+ {notempty name="soft_light_first"} +
{$soft_light_first.title|raw}
+
{$soft_light_first.short_title|raw}
+ {/notempty} + {eq name=":cookie('think_lang')" value="en-us"} +
+ {volist name="data.screen_soft_light" id="so"} + + {/volist} +
+ {else/} +
+ {volist name="data.screen_soft_light" id="so"} + + {/volist} +
+ {/eq} +
+
+{/notempty} +{notempty name="data.screen_color_gamut"} +{assign name="color_gamut_first" value=":array_shift($data.screen_color_gamut)"/} +
+ {notempty name="color_gamut_first"} +
+
{$color_gamut_first.title|raw}
+
{$color_gamut_first.short_title|raw}
+
+ {/notempty} +
+ {volist name="data.screen_color_gamut" id="so"} + + {/volist} +
+
+{/notempty} +{notempty name="data.screen_anti_glare"} +
+ {assign name="anti_glare_first" value=":array_shift($data.screen_anti_glare)"/} + {notempty name="anti_glare_first"} +
+
{$anti_glare_first.title|raw}
+
{$anti_glare_first.short_title|raw}
+
+ {/notempty} +
+ {assign name="anti_glare_left" value=":array_shift($data.screen_anti_glare)"/} + +
+ {assign name="anti_glare_right" value=":array_shift($data.screen_anti_glare)"/} + +
+ +
+
+{/notempty} +{notempty name="data.exterior_texture"} +
+
+ {assign name="exterior_texture_first" value=":array_shift($data.exterior_texture)"/} +
{$exterior_texture_first.title|default=''|raw}
+
{$exterior_texture_first.short_title|default=''|raw}
+
+
+ {volist name="data.exterior_texture" id="eo"} + + {$eo.title} + + {/volist} +
+
+
+
+{/notempty} +{notempty name="data.network_card"} +{assign name="netword_card_first" value=":array_shift($data.network_card)"/} +
+
+
{$netword_card_first.title|default=''|raw}
+
{$netword_card_first.short_title|default=''|raw}
+
+
+ {volist name="data.network_card" id="no"} + + {/volist} +
+
+{/notempty} +{notempty name="data.battery_life"} +{assign name="battery_life_first" value=":array_shift($data.battery_life)"/} +
+
+
{$battery_life_first.title|default=''|raw}
+
{$battery_life_first.short_title|default=''|raw}
+
+
+ {volist name="data.battery_life" id="bo"} + + {/volist} +
+
{$battery_life_first.desc|default=''|raw}
+
+{/notempty} +
+
+
{:lang_i18n("接口大满贯")}
+

{:lang_i18n("标配多种接口，会议室连接电脑、U盘传输文件、TF卡读取等，全都轻松搞定")}

+
+
+ 接口图 +
+
{:lang_i18n('肯辛通锁孔')}
+
{:lang_i18n('千兆网口')}
+
{:lang_i18n('USB-A
(5Gbps)')}
+
{:lang_i18n('USB-A
(480Mbps)')}
+
{:lang_i18n('3.5mm
耳麦合一')}
+
{:lang_i18n('TF口3.0')}
+
{:lang_i18n('USB-A
(5Gbps)')}
+
{:lang_i18n('USB-C
(5Gbps)')}
+
{:lang_i18n('HDMI')}
+
{:lang_i18n('全功能
USB-C')}
+
+{notempty name="data.scene_focus_images"} +
+
+
+ 左箭头 +
+
+
+ {volist name="data.scene_focus_images" id="so"} + {$so.title} + {/volist} +
+
+
+ 右箭头 +
+
+
+ {volist name="data.scene_focus_images" id="so"} +
+ {eq name=":cookie('think_lang')" value="en-us"} +
{$so.title}
+
{$so.short_title}
+ {else/} +
{$so.title}
+
{$so.short_title}
+ {/eq} +
+ {/volist} +
+
+{/notempty} +{notempty name="data.camare_microphone_security"} +{assign name="camare_microphone" value=":array_shift($data.camare_microphone_security)"/} +{assign name="security" value=":array_shift($data.camare_microphone_security)"/} +
+
{$camare_microphone.title|default=''}
+
{$security.title|default=''}
+
+ {notempty name="camare_microphone"} +
+
+ {$camare_microphone.title} +
+
+ {/notempty} + {notempty name="security"} +
+ +
+ {/notempty} +
+
+
+ {notempty name="camare_microphone"}
{$camare_microphone.short_title|default=''}
{/notempty} + {notempty name="security"}
{$security.short_title|default=''}
{/notempty} +
+
+
+ {notempty name="camare_microphone"} +
{$camare_microphone.desc|default=''|raw}
+ {/notempty} + {notempty name="security"} +
{$security.desc|default=''|raw}
+ {/notempty} +
+{/notempty} +{notempty name="data.unified_preinstall"} +
+{/notempty} +{notempty name="data.product_testing"} +
+
+ {volist name="data.product_testing" id="po"} + {$po.title} + {/volist} +
+
+{/notempty} +{notempty name="data.webpage_footnotes"} +
+ {eq name=":cookie('think_lang')" value="en-us"} +
{$data.webpage_footnotes.desc|raw|htmlspecialchars_decode}
+ {else/} +
{$data.webpage_footnotes.desc|raw|htmlspecialchars_decode}
+ {/eq} +
+{/notempty} +{/block} +{block name="script"} + + +{/block} diff --git a/database/seeds/SysConfigInit.php b/database/seeds/SysConfigInit.php index e8fbb1f5..de188893 100644 --- a/database/seeds/SysConfigInit.php +++ b/database/seeds/SysConfigInit.php @@ -73,8 +73,8 @@ class SysConfigInit extends Seeder ["id" => 56, "group_id" => 12, "title" => "Instagram URL新窗口打开", "name" => "article_share_to_instagram.is_blank", "value" => "1", "extra" => "1:是\n0:否", "type" => "radio", "sort" => 6, "remark" => "", "created_at" => "2025-04-23 17:49:12", "updated_at" => "2025-06-12 09:55:21", "deleted_at" => null], ["id" => 57, "group_id" => 12, "title" => "Twitter URL新窗口打开", "name" => "article_share_to_twitter.is_blank", "value" => "1", "extra" => "1:是\n0:否", "type" => "radio", "sort" => 9, "remark" => "", "created_at" => "2025-04-23 17:49:12", "updated_at" => "2025-06-12 09:55:21", "deleted_at" => null], ["id" => 58, "group_id" => 12, "title" => "Reddit URL新窗口打开", "name" => "article_share_to_reddit.is_blank", "value" => "1", "extra" => "1:是\n0:否", "type" => "radio", "sort" => 12, "remark" => "", "created_at" => "2025-04-23 17:49:12", "updated_at" => "2025-06-12 09:55:21", "deleted_at" => null], - ["id" => 59, "group_id" => 1, "title" => "产品询盘可选国家", "name" => "optional_country_for_product_inquiry", "value" => "Afghanistan\nAlbania\nAlgeria\nAmerican Samoa\nAndorra\nAngola\nAnguilla\nAntigua and Barbuda\nArgentina\nArmenia\nAruba\nAustralia\nAustria\nAzerbaijan\nAzores\nBahamas\nBahrain\nBangladesh\nBarbados\nBelarus\nBelgium\nBelize\nBenin\nBermuda\nBhutan\nBolivia\nBosnia and Herzegovina\nBotswana\nBrazil\nBrunei\nBulgaria\nBurkina Faso\nBurundi\nCambodia\nCameroon\nCanada\nCanarias\nCape Verde\nCayman\nCentral African Republic\nChad\nChile\nChina\nColombia\nComoros\nCongo (Congo-Kinshasa)\nCongo\nCook Islands\nCosta Rica\nCote D'Ivoire\nCroatia\nCuba\nCyprus\nCzech\nDenmark\nDjibouti\nDominica\nDominican\nEcuador\nEgypt\nEl Salvador\nEquatorial Guinea\nEritrea\nEstonia\nEthiopia\nFiji\nFinland\nFrance\nFrench Guiana\nFrench Polynesia\nGabon\nGambia\nGeorgia\nGermany\nGhana\nGreece\nGreenland\nGrenada\nGuadeloupe\nGuam\nGuatemala\nGuinea\nGuinea-Bissau\nGuyana\nHaiti\nHonduras\nHungary\nIceland\nIndia\nIndonesia\nIran\nIraq\nIreland\nIsrael\nItaly\nJamaica\nJapan\nJordan\nKazakhstan\nKenya\nKiribati\nKorea (North)\nKorea (South)\nKuwait\nKyrgyzstan\nLaos\nLatvia\nLebanon\nLesotho\nLiberia\nLibya\nLiechtenstein\nLithuania\nLuxembourg\nMacedonia\nMadagascar\nMadeira\nMalawi\nMalaysia\nMaldives\nMali\nMalta\nMarshall Islands\nMartinique\nMauritania\nMauritius\nMexico\nMicronesia\nMoldova\nMonaco\nMongolia\nMetropolis\nMorocco\nMozambique\nMyanmar\nNamibia\nNauru\nNepal\nNetherlands Antilles\nNetherlands\nNew Caledonia\nNew Zealand\nNicaragua\nNiger\nNiue\nNorthern Mariana\nNorway\nOman\nPakistan\nPalau\nPalestine\nPanama\nPapua New Guinea\nParaguay\nPeru\nPhilippines\nPitcairn Islands\nPoland\nPortugal\nPuerto Rico\nQatar\nReunion\nRomania\nRussian Federation\nRwanda\nSaint Helena\nSaint Kitts-Nevis\nSaint Lucia\nSaint Vincent and the Grenadines\nSamoa\nSan Marino\nSao Tome and Principe\nSaudi Arabia\nSenegal\nSerbia\nSeychelles\nSierra Leone\nSingapore\nSlovakia\nSlovenia\nSolomon Islands\nSomalia\nSouth Africa\nSpain\nSri Lanka\nSudan\nSuriname\nSwaziland\nSweden\nSwitzerland\nSyria\nTajikistan\nTanzania\nThailand\nThe British Virgin Islands\nThe United States Virgin Islands\nTimor-Leste\nTogo\nTokelau\nTonga\nTrinidad and Tobago\nTunisia\nTurkey\nTurkmenistan\nTurks and Caicos Islands\nTuvalu\nUganda\nUkraine\nUnited Arab Emirates\nUnited Kingdom\nUnited States\nUruguay\nUzbekistan\nVanuatu\nVatican City\nVenezuela\nVietnam\nWallis and Futuna\nWestern Sahara\nYemen\nZambia\nZimbabwe", "extra" => "", "type" => "textarea", "sort" => 7, "remark" => "", "created_at" => "2025-04-27 11:10:22", "updated_at" => "2025-06-11 17:09:13", "deleted_at" => null], - ["id" => 60, "group_id" => 4, "title" => "产品询盘可选国家", "name" => "optional_country_for_product_inquiry", "value" => "Afghanistan\nAlbania\nAlgeria\nAmerican Samoa\nAndorra\nAngola\nAnguilla\nAntigua and Barbuda\nArgentina\nArmenia\nAruba\nAustralia\nAustria\nAzerbaijan\nAzores\nBahamas\nBahrain\nBangladesh\nBarbados\nBelarus\nBelgium\nBelize\nBenin\nBermuda\nBhutan\nBolivia\nBosnia and Herzegovina\nBotswana\nBrazil\nBrunei\nBulgaria\nBurkina Faso\nBurundi\nCambodia\nCameroon\nCanada\nCanarias\nCape Verde\nCayman\nCentral African Republic\nChad\nChile\nChina\nColombia\nComoros\nCongo (Congo-Kinshasa)\nCongo\nCook Islands\nCosta Rica\nCote D'Ivoire\nCroatia\nCuba\nCyprus\nCzech\nDenmark\nDjibouti\nDominica\nDominican\nEcuador\nEgypt\nEl Salvador\nEquatorial Guinea\nEritrea\nEstonia\nEthiopia\nFiji\nFinland\nFrance\nFrench Guiana\nFrench Polynesia\nGabon\nGambia\nGeorgia\nGermany\nGhana\nGreece\nGreenland\nGrenada\nGuadeloupe\nGuam\nGuatemala\nGuinea\nGuinea-Bissau\nGuyana\nHaiti\nHonduras\nHungary\nIceland\nIndia\nIndonesia\nIran\nIraq\nIreland\nIsrael\nItaly\nJamaica\nJapan\nJordan\nKazakhstan\nKenya\nKiribati\nKorea (North)\nKorea (South)\nKuwait\nKyrgyzstan\nLaos\nLatvia\nLebanon\nLesotho\nLiberia\nLibya\nLiechtenstein\nLithuania\nLuxembourg\nMacedonia\nMadagascar\nMadeira\nMalawi\nMalaysia\nMaldives\nMali\nMalta\nMarshall Islands\nMartinique\nMauritania\nMauritius\nMexico\nMicronesia\nMoldova\nMonaco\nMongolia\nMetropolis\nMorocco\nMozambique\nMyanmar\nNamibia\nNauru\nNepal\nNetherlands Antilles\nNetherlands\nNew Caledonia\nNew Zealand\nNicaragua\nNiger\nNiue\nNorthern Mariana\nNorway\nOman\nPakistan\nPalau\nPalestine\nPanama\nPapua New Guinea\nParaguay\nPeru\nPhilippines\nPitcairn Islands\nPoland\nPortugal\nPuerto Rico\nQatar\nReunion\nRomania\nRussian Federation\nRwanda\nSaint Helena\nSaint Kitts-Nevis\nSaint Lucia\nSaint Vincent and the Grenadines\nSamoa\nSan Marino\nSao Tome and Principe\nSaudi Arabia\nSenegal\nSerbia\nSeychelles\nSierra Leone\nSingapore\nSlovakia\nSlovenia\nSolomon Islands\nSomalia\nSouth Africa\nSpain\nSri Lanka\nSudan\nSuriname\nSwaziland\nSweden\nSwitzerland\nSyria\nTajikistan\nTanzania\nThailand\nThe British Virgin Islands\nThe United States Virgin Islands\nTimor-Leste\nTogo\nTokelau\nTonga\nTrinidad and Tobago\nTunisia\nTurkey\nTurkmenistan\nTurks and Caicos Islands\nTuvalu\nUganda\nUkraine\nUnited Arab Emirates\nUnited Kingdom\nUnited States\nUruguay\nUzbekistan\nVanuatu\nVatican City\nVenezuela\nVietnam\nWallis and Futuna\nWestern Sahara\nYemen\nZambia\nZimbabwe", "extra" => null, "type" => "textarea", "sort" => 7, "remark" => null, "created_at" => "2025-04-27 11:23:25", "updated_at" => "2025-06-12 09:55:21", "deleted_at" => null], + ["id" => 59, "group_id" => 1, "title" => "产品询盘可选国家", "name" => "optional_country_for_product_inquiry", "value" => "Afghanistan\nAlbania\nAlgeria\nAmerican Samoa\nAndorra\nAngola\nAnguilla\nAntigua and Barbuda\nArgentina\nArmenia\nAruba\nAustralia\nAustria\nAzerbaijan\nAzores\nBahamas\nBahrain\nBangladesh\nBarbados\nBelarus\nBelgium\nBelize\nBenin\nBermuda\nBhutan\nBolivia\nBosnia and Herzegovina\nBotswana\nBrazil\nBrunei\nBulgaria\nBurkina Faso\nBurundi\nCambodia\nCameroon\nCanada\nCanarias\nCape Verde\nCayman\nCentral African Republic\nChad\nChile\nChina\nColombia\nComoros\nCongo (Congo-Kinshasa)\nCongo\nCook Islands\nCosta Rica\nCote D'Ivoire\nCroatia\nCuba\nCyprus\nCzech\nDenmark\nDjibouti\nDominica\nDominican\nEcuador\nEgypt\nEl Salvador\nEquatorial Guinea\nEritrea\nEstonia\nEthiopia\nFiji\nFinland\nFrance\nFrench Guiana\nFrench Polynesia\nGabon\nGambia\nGeorgia\nGermany\nGhana\nGreece\nGreenland\nGrenada\nGuadeloupe\nGuam\nGuatemala\nGuinea\nGuinea-Bissau\nGuyana\nHaiti\nHonduras\nHungary\nIceland\nIndia\nIndonesia\nIran\nIraq\nIreland\nIsrael\nItaly\nJamaica\nJapan\nJordan\nKazakhstan\nKenya\nKiribati\nKorea (North)\nKorea (South)\nKuwait\nKyrgyzstan\nLaos\nLatvia\nLebanon\nLesotho\nLiberia\nLibya\nLiechtenstein\nLithuania\nLuxembourg\nMacedonia\nMadagascar\nMadeira\nMalawi\nMalaysia\nMaldives\nMali\nMalta\nMarshall Islands\nMartinique\nMauritania\nMauritius\nMexico\nMicronesia\nMoldova\nMonaco\nMongolia\nHarmonyOS\nMorocco\nMozambique\nMyanmar\nNamibia\nNauru\nNepal\nNetherlands Antilles\nNetherlands\nNew Caledonia\nNew Zealand\nNicaragua\nNiger\nNiue\nNorthern Mariana\nNorway\nOman\nPakistan\nPalau\nPalestine\nPanama\nPapua New Guinea\nParaguay\nPeru\nPhilippines\nPitcairn Islands\nPoland\nPortugal\nPuerto Rico\nQatar\nReunion\nRomania\nRussian Federation\nRwanda\nSaint Helena\nSaint Kitts-Nevis\nSaint Lucia\nSaint Vincent and the Grenadines\nSamoa\nSan Marino\nSao Tome and Principe\nSaudi Arabia\nSenegal\nSerbia\nSeychelles\nSierra Leone\nSingapore\nSlovakia\nSlovenia\nSolomon Islands\nSomalia\nSouth Africa\nSpain\nSri Lanka\nSudan\nSuriname\nSwaziland\nSweden\nSwitzerland\nSyria\nTajikistan\nTanzania\nThailand\nThe British Virgin Islands\nThe United States Virgin Islands\nTimor-Leste\nTogo\nTokelau\nTonga\nTrinidad and Tobago\nTunisia\nTurkey\nTurkmenistan\nTurks and Caicos Islands\nTuvalu\nUganda\nUkraine\nUnited Arab Emirates\nUnited Kingdom\nUnited States\nUruguay\nUzbekistan\nVanuatu\nVatican City\nVenezuela\nVietnam\nWallis and Futuna\nWestern Sahara\nYemen\nZambia\nZimbabwe", "extra" => "", "type" => "textarea", "sort" => 7, "remark" => "", "created_at" => "2025-04-27 11:10:22", "updated_at" => "2025-06-11 17:09:13", "deleted_at" => null], + ["id" => 60, "group_id" => 4, "title" => "产品询盘可选国家", "name" => "optional_country_for_product_inquiry", "value" => "Afghanistan\nAlbania\nAlgeria\nAmerican Samoa\nAndorra\nAngola\nAnguilla\nAntigua and Barbuda\nArgentina\nArmenia\nAruba\nAustralia\nAustria\nAzerbaijan\nAzores\nBahamas\nBahrain\nBangladesh\nBarbados\nBelarus\nBelgium\nBelize\nBenin\nBermuda\nBhutan\nBolivia\nBosnia and Herzegovina\nBotswana\nBrazil\nBrunei\nBulgaria\nBurkina Faso\nBurundi\nCambodia\nCameroon\nCanada\nCanarias\nCape Verde\nCayman\nCentral African Republic\nChad\nChile\nChina\nColombia\nComoros\nCongo (Congo-Kinshasa)\nCongo\nCook Islands\nCosta Rica\nCote D'Ivoire\nCroatia\nCuba\nCyprus\nCzech\nDenmark\nDjibouti\nDominica\nDominican\nEcuador\nEgypt\nEl Salvador\nEquatorial Guinea\nEritrea\nEstonia\nEthiopia\nFiji\nFinland\nFrance\nFrench Guiana\nFrench Polynesia\nGabon\nGambia\nGeorgia\nGermany\nGhana\nGreece\nGreenland\nGrenada\nGuadeloupe\nGuam\nGuatemala\nGuinea\nGuinea-Bissau\nGuyana\nHaiti\nHonduras\nHungary\nIceland\nIndia\nIndonesia\nIran\nIraq\nIreland\nIsrael\nItaly\nJamaica\nJapan\nJordan\nKazakhstan\nKenya\nKiribati\nKorea (North)\nKorea (South)\nKuwait\nKyrgyzstan\nLaos\nLatvia\nLebanon\nLesotho\nLiberia\nLibya\nLiechtenstein\nLithuania\nLuxembourg\nMacedonia\nMadagascar\nMadeira\nMalawi\nMalaysia\nMaldives\nMali\nMalta\nMarshall Islands\nMartinique\nMauritania\nMauritius\nMexico\nMicronesia\nMoldova\nMonaco\nMongolia\nHarmonyOS\nMorocco\nMozambique\nMyanmar\nNamibia\nNauru\nNepal\nNetherlands Antilles\nNetherlands\nNew Caledonia\nNew Zealand\nNicaragua\nNiger\nNiue\nNorthern Mariana\nNorway\nOman\nPakistan\nPalau\nPalestine\nPanama\nPapua New Guinea\nParaguay\nPeru\nPhilippines\nPitcairn Islands\nPoland\nPortugal\nPuerto Rico\nQatar\nReunion\nRomania\nRussian Federation\nRwanda\nSaint Helena\nSaint Kitts-Nevis\nSaint Lucia\nSaint Vincent and the Grenadines\nSamoa\nSan Marino\nSao Tome and Principe\nSaudi Arabia\nSenegal\nSerbia\nSeychelles\nSierra Leone\nSingapore\nSlovakia\nSlovenia\nSolomon Islands\nSomalia\nSouth Africa\nSpain\nSri Lanka\nSudan\nSuriname\nSwaziland\nSweden\nSwitzerland\nSyria\nTajikistan\nTanzania\nThailand\nThe British Virgin Islands\nThe United States Virgin Islands\nTimor-Leste\nTogo\nTokelau\nTonga\nTrinidad and Tobago\nTunisia\nTurkey\nTurkmenistan\nTurks and Caicos Islands\nTuvalu\nUganda\nUkraine\nUnited Arab Emirates\nUnited Kingdom\nUnited States\nUruguay\nUzbekistan\nVanuatu\nVatican City\nVenezuela\nVietnam\nWallis and Futuna\nWestern Sahara\nYemen\nZambia\nZimbabwe", "extra" => null, "type" => "textarea", "sort" => 7, "remark" => null, "created_at" => "2025-04-27 11:23:25", "updated_at" => "2025-06-12 09:55:21", "deleted_at" => null], ["id" => 61, "group_id" => 1, "title" => "导航位置店铺URL", "name" => "navigation_store_url", "value" => "https://oricotechs.com/", "extra" => null, "type" => "text", "sort" => 6, "remark" => null, "created_at" => "2025-05-13 17:45:46", "updated_at" => "2025-06-11 17:09:13", "deleted_at" => null], ["id" => 62, "group_id" => 4, "title" => "导航位置店铺URL", "name" => "navigation_store_url", "value" => "https://oricotechs.com/", "extra" => null, "type" => "text", "sort" => 6, "remark" => null, "created_at" => "2025-05-13 17:45:46", "updated_at" => "2025-06-12 09:55:21", "deleted_at" => null], ["id" => 63, "group_id" => 7, "title" => "邮箱", "name" => "website_email", "value" => "supports@orico.com.cn", "extra" => null, "type" => "text", "sort" => 1, "remark" => null, "created_at" => "2025-05-23 17:06:53", "updated_at" => "2025-06-11 17:09:13", "deleted_at" => null], diff --git a/public/static/index/mobile/css/public.css b/public/static/index/mobile/css/public.css index 23e43f7f..d5040f4d 100755 --- a/public/static/index/mobile/css/public.css +++ b/public/static/index/mobile/css/public.css @@ -1,28 +1,45 @@ + @font-face { font-family: "HarmonyOS"; - src: url("../fonts/HarmonyOS-Regular.otf") format("opentype"); + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Regular.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "HarmonyOS-Regular"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Regular.ttf") format("opentype"); font-weight: normal; font-style: normal; } - @font-face { font-family: "HarmonyOS-Bold"; - src: url("../fonts/HarmonyOS-Bold.otf") format("opentype"); + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Bold.ttf") format("opentype"); font-weight: normal; font-style: normal; } - @font-face { font-family: "HarmonyOS-Medium"; - src: url("../fonts/HarmonyOS-Medium.otf") format("opentype"); + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Medium.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +/* HarmonyOS-SemiBold1 */ +@font-face { + font-family: "HarmonyOS-SemiBold"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Bold.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "HarmonyOS-Light"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Light.ttf") format("opentype"); font-weight: normal; font-style: normal; } - * { margin: 0; padding: 0; - /* font-family: 'HarmonyOS'; */ + font-family: 'HarmonyOS'; -ms-overflow-style: none; /* IE 和 Edge */ scrollbar-width: none; diff --git a/public/static/index/pc/css/aboutus_culture.css b/public/static/index/pc/css/aboutus_culture.css index cd340af8..850765f5 100755 --- a/public/static/index/pc/css/aboutus_culture.css +++ b/public/static/index/pc/css/aboutus_culture.css @@ -66,7 +66,7 @@ .orico_Page_productxc .productxcMain .culture_top .culture_bril_con .culture_bril_div .title { font-size: 1.125rem; font-weight: 600; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; margin-top: 2rem; width: 90%; margin-left: 5%; @@ -75,7 +75,7 @@ width: 80%; font-size: 0.875rem; color: #707070; - font-family: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; margin-top: 1.375rem; margin-left: 10%; } @@ -93,7 +93,7 @@ line-height: 2em; margin-bottom: 2%; font-weight: 600; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; } .orico_Page_productxc .productxcMain .culture_vision .swt-Container { width: 80%; @@ -138,14 +138,14 @@ color: #101010; line-height: 2em; margin-bottom: 2%; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; 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: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; } .orico_Page_productxc .productxcMain .culture_vision .swt-Container .swt-Table .Table-Row .Table-Cell { display: table-cell; @@ -159,7 +159,7 @@ font-size: 1rem; color: #737373; line-height: 1.6rem; - font-family: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; } .orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .des, .orico_Page_productxc .productxcMain .culture_vision .swt-Container .culture_vision_02 .subtitle { diff --git a/public/static/index/pc/css/aboutus_introduction.css b/public/static/index/pc/css/aboutus_introduction.css index 9df9a3e1..247e2af8 100755 --- a/public/static/index/pc/css/aboutus_introduction.css +++ b/public/static/index/pc/css/aboutus_introduction.css @@ -30,7 +30,7 @@ } .orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotbt1 { font-size: 32px; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; padding-bottom: 65px; padding-top: 88px; font-weight: 700; @@ -57,14 +57,14 @@ } .orico_Page_introduction .introductionMain .iotbpage .iotb_bgw .iotb_part1 .iotb_p1_item .iotbtp1 { font-size: 18px; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; 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: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; color: #9e9e9f; } .orico_Page_introduction .introductionMain .iotb_part2 { @@ -78,7 +78,7 @@ } .orico_Page_introduction .introductionMain .iotb_part2 .iotbt1 { font-size: 32px; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; padding-bottom: 65px; padding-top: 88px; font-weight: 700; diff --git a/public/static/index/pc/css/aboutus_mileage.css b/public/static/index/pc/css/aboutus_mileage.css index 2444f54c..c494d5e8 100755 --- a/public/static/index/pc/css/aboutus_mileage.css +++ b/public/static/index/pc/css/aboutus_mileage.css @@ -30,7 +30,7 @@ height: 11.25rem; line-height: 11.25rem; font-size: 2rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; color: #000000; text-align: center; @@ -52,7 +52,7 @@ .orico_Page_achievement .achievementMain .achInfo .achNums .achive_shuju .title1 { margin-top: 2.5rem; font-size: 2rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; color: #000000; } @@ -62,7 +62,7 @@ .orico_Page_achievement .achievementMain .achInfo .achNums .achive_shuju .subtitle1 { margin-top: 1rem; font-size: 1.125rem; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; font-weight: 400; color: #707070; } @@ -71,7 +71,7 @@ height: auto; position: relative; background: #f2f2f2; - font-family: Metropolis; + font-family: HarmonyOS; padding-bottom: 10%; } .orico_Page_achievement .achievementMain .achTimes .timecontent { @@ -83,7 +83,7 @@ height: 11.25rem; line-height: 11.25rem; font-size: 2rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; color: #000000; text-align: center; @@ -142,7 +142,7 @@ background: url(/static/index/pc/images/greyyuandian.png) 3px 3px no-repeat; height: 2.375rem; font-size: 1.25rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; color: #000000; line-height: 1.875rem; @@ -153,7 +153,7 @@ .orico_Page_achievement .achievementMain .achTimes .timecontent .timelist .timeline-con .con_event_list .event_list div li { display: inline-block; width: 94%; - font-family: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; line-height: 1.5625rem; font-size: 1rem; font-weight: 500; @@ -181,7 +181,7 @@ height: 11.25rem; line-height: 11.25rem; font-size: 2rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; color: #000000; text-align: center; @@ -211,7 +211,7 @@ margin-left: 4.0625rem; margin-top: 2.5rem; font-size: 1.75rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; color: #000000; line-height: 1.625rem; @@ -220,7 +220,7 @@ margin-left: 65px; width: 80%; font-size: 16px; - font-family: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; font-weight: 500; color: #707070; line-height: 26px; diff --git a/public/static/index/pc/css/aboutus_story.css b/public/static/index/pc/css/aboutus_story.css index f6dcccce..9f9760fc 100755 --- a/public/static/index/pc/css/aboutus_story.css +++ b/public/static/index/pc/css/aboutus_story.css @@ -52,10 +52,10 @@ font-weight: 600; color: #000000; line-height: 20px; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; } .orico_Page_brand .brandMain .our_brand_con .our_brand_bg .vtext .Table-Cell p { - font-family: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; font-size: 14px; color: #707070; line-height: 22px; @@ -100,17 +100,17 @@ margin-top: 2.5rem; } .orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .title p { - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; } .orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .subtitle { width: 80%; font-size: 0.875rem; color: #707070; - font-family: Metropolis-Medium, Metropolis; + font-family: HarmonyOS-Medium, HarmonyOS; margin-top: 2.5rem; margin-left: 10%; } .orico_Page_brand .brandMain .dis_bril_bg .dis_bril_con .subtitle p { - font-family: Metropolis-Medium; + font-family: HarmonyOS-Medium; line-height: 22px; } diff --git a/public/static/index/pc/css/article_detail.css b/public/static/index/pc/css/article_detail.css index 24b14127..d381c58e 100755 --- a/public/static/index/pc/css/article_detail.css +++ b/public/static/index/pc/css/article_detail.css @@ -153,7 +153,7 @@ border-radius: 8px; height: 48px; box-shadow: none; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; } .orico_Page_articleDetail .articleDetailMain .atmright .repply form { width: auto; diff --git a/public/static/index/pc/css/attachment_index.css b/public/static/index/pc/css/attachment_index.css index 915dca78..ecbb4e08 100755 --- a/public/static/index/pc/css/attachment_index.css +++ b/public/static/index/pc/css/attachment_index.css @@ -32,7 +32,7 @@ height: 56px; line-height: 56px; margin-top: -28px; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; } .orico_Page_download .downloadMain .contact_c { width: 82%; @@ -43,7 +43,7 @@ border-radius: 1.5rem; margin: auto; display: flex; - font-family: "Metropolis-Medium"; + font-family: "HarmonyOS-Medium"; color: #9e9e9f; z-index: 9; position: relative; @@ -86,7 +86,7 @@ font-size: 1.125rem; padding-top: 1.5625rem; padding-bottom: 1.5625rem; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; text-align: center; border-radius: 0.75rem; cursor: pointer; @@ -137,20 +137,20 @@ } .orico_Page_download .downloadMain .contact_c .softlist .softit .title { font-size: 1.125rem; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; color: #000; } .orico_Page_download .downloadMain .contact_c .softlist .softit .sub_title { font-size: 0.875rem; margin-top: 0.875rem; - font-family: "Metropolis-Regular"; + font-family: "HarmonyOS-Regular"; color: #9e9e9f; } .orico_Page_download .downloadMain .contact_c .softlist .softit .des { line-height: 20px; margin-top: 8px; font-size: 16px; - font-family: "Metropolis-Medium"; + font-family: "HarmonyOS-Medium"; color: #000; } .orico_Page_download .downloadMain .contact_c .softlist .softit .l_button { @@ -158,7 +158,7 @@ padding: 15px 40px; margin-top: 74px; display: inline-block; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; color: #004bfa; background-color: rgba(0, 75, 250, 0.05); cursor: pointer; @@ -212,7 +212,7 @@ font-size: 16px; position: relative; cursor: pointer; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; color: #000; } .orico_Page_download .downloadMain .contact_c .vidotabs .hd ul li a{ @@ -257,7 +257,7 @@ height: 114px; } .orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul dd .htit .htit1 { - font-family: "Metropolis-Regular"; + font-family: "HarmonyOS-Regular"; color: #000; font-size: 16px; margin-top: 40px; @@ -266,7 +266,7 @@ white-space: nowrap; } .orico_Page_download .downloadMain .contact_c .vidotabs .bdconten .video_hotul dd .htit .htit2 { - font-family: "Metropolis-Regular"; + font-family: "HarmonyOS-Regular"; color: #9e9e9f; display: -webkit-box; -webkit-box-orient: vertical; diff --git a/public/static/index/pc/css/contactus_bulkbuy.css b/public/static/index/pc/css/contactus_bulkbuy.css index c1c3f39d..32ed14e8 100755 --- a/public/static/index/pc/css/contactus_bulkbuy.css +++ b/public/static/index/pc/css/contactus_bulkbuy.css @@ -21,7 +21,7 @@ } .orico_Page_bussiness .bussinessMain .bd_main .sfbt1 { font-size: 24px; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; text-align: center; padding-bottom: 55px; @@ -52,7 +52,7 @@ } .orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .itlable { font-size: 14px; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; color: #000000; font-weight: bold; padding-bottom: 10px; @@ -74,7 +74,7 @@ height: 48px; border: none; box-shadow: none; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; } .orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .form-control { display: block; @@ -97,7 +97,7 @@ .orico_Page_bussiness .bussinessMain .bd_main .bd_ct .bd_from .theit .bditem .sfbchecks .sfbcheckboxlist .cit { width: 100%; font-size: 14px; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; color: #000; display: flex; flex-direction: row; @@ -119,11 +119,11 @@ background: #f2f2f2; border: none; border-radius: 8px; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; } .orico_Page_bussiness .bussinessMain .bd_main .bttj { font-size: 14px; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; width: 212px; padding: 15px 15px; diff --git a/public/static/index/pc/css/contactus_distributor.css b/public/static/index/pc/css/contactus_distributor.css index 1411002e..90838661 100755 --- a/public/static/index/pc/css/contactus_distributor.css +++ b/public/static/index/pc/css/contactus_distributor.css @@ -25,7 +25,7 @@ color: #004bfa; padding-bottom: 1rem; text-align: center; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: 700; } .orico_Page_distributor .distributorMain .s1 { @@ -72,7 +72,7 @@ } .orico_Page_distributor .distributorMain .bd_from .theit .bditem .itlable { font-size: 0.875rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; color: #000000; font-weight: bold; padding-bottom: 0.625rem; @@ -99,7 +99,7 @@ border-radius: 0.5rem; height: 3rem; box-shadow: none; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; } .orico_Page_distributor .distributorMain .ittextarea { height: 6.25rem; @@ -108,11 +108,11 @@ border: none; border-radius: 0.5rem; resize: none; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; } .orico_Page_distributor .distributorMain .bttj { font-size: 0.875rem; - font-family: Metropolis-Bold, Metropolis; + font-family: HarmonyOS-Bold, HarmonyOS; font-weight: bold; width: 10rem; padding: 1.2rem 3.75rem; diff --git a/public/static/index/pc/css/contactus_message.css b/public/static/index/pc/css/contactus_message.css index 42bb69f0..9fbef3aa 100755 --- a/public/static/index/pc/css/contactus_message.css +++ b/public/static/index/pc/css/contactus_message.css @@ -38,7 +38,7 @@ color: #000; display: block; width: 100%; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; font-size: 1.5rem; } .orico_Page_contact .contactMain .contact_c .all_contact .info .info_all { @@ -77,7 +77,7 @@ } .orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .sub_list .title { font-size: 0.875rem; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; } .orico_Page_contact .contactMain .contact_c .all_contact .info .info_all .list .sub_list .des { font-size: 0.875rem; @@ -92,14 +92,14 @@ color: #000; display: block; width: 100%; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-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: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; font-size: 0.875rem; padding-bottom: 0.3125rem; } @@ -110,13 +110,13 @@ background: #f2f2f2; box-shadow: none; border: none; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; } .orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .ittextarea { height: 100px; background: #f2f2f2; border: none; - font-family: Metropolis-Regular, Metropolis; + font-family: HarmonyOS-Regular, HarmonyOS; resize: none; } .orico_Page_contact .contactMain .contact_c .all_contact .question .question_form .list .form_input input, @@ -143,7 +143,7 @@ font-size: 0.875rem; background-color: #004bfa; color: #fff; - font-family: "Metropolis-Bold"; + font-family: "HarmonyOS-Bold"; display: inline-block; cursor: pointer; } @@ -157,7 +157,7 @@ background-color: #fff; border-radius: 0.75rem; margin-top: 1.5rem; - font-family: "Metropolis-SemiBold"; + font-family: "HarmonyOS-SemiBold"; } .orico_Page_contact .contactMain .contact_c .become_dis .text_blue { color: #004bfa; diff --git a/public/static/index/pc/css/index.css b/public/static/index/pc/css/index.css index b7ab9a5e..e8aeeb76 100755 --- a/public/static/index/pc/css/index.css +++ b/public/static/index/pc/css/index.css @@ -572,7 +572,7 @@ font-size: 1rem; text-align: left; width: 80%; - font-family: Metropolis !important; + font-family: HarmonyOS !important; color: #004bfa; } diff --git a/public/static/index/pc/css/public.css b/public/static/index/pc/css/public.css index b23dfaf3..1e69ccfc 100755 --- a/public/static/index/pc/css/public.css +++ b/public/static/index/pc/css/public.css @@ -1,24 +1,60 @@ -@font-face { - font-family: "Metropolis"; - src: url("../fonts/Metropolis-Regular.otf") format("opentype"); +/* @font-face { + font-family: "HarmonyOS"; + src: url("../fonts/HarmonyOS-Regular.otf") format("opentype"); font-weight: normal; font-style: normal; } @font-face { - font-family: "Metropolis-Bold"; - src: url("../fonts/Metropolis-Bold.otf") format("opentype"); + font-family: "HarmonyOS-Bold"; + src: url("../fonts/HarmonyOS-Bold.otf") format("opentype"); font-weight: normal; font-style: normal; } @font-face { - font-family: "Metropolis-Medium"; - src: url("../fonts/Metropolis-Medium.otf") format("opentype"); + font-family: "HarmonyOS-Medium"; + src: url("../fonts/HarmonyOS-Medium.otf") format("opentype"); font-weight: normal; font-style: normal; +} */ +@font-face { + font-family: "HarmonyOS"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Regular.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "HarmonyOS-Regular"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Regular.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "HarmonyOS-Bold"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Bold.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "HarmonyOS-Medium"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Medium.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +/* HarmonyOS-SemiBold1 */ +@font-face { + font-family: "HarmonyOS-SemiBold"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Bold.ttf") format("opentype"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "HarmonyOS-Light"; + src: url("//ow.static.f2b211.com/static/fonts/HarmonyOS_Sans_SC_Light.ttf") format("opentype"); + font-weight: normal; + font-style: normal; } - ::-webkit-scrollbar { width: 0.625rem; background: #d2eafb; @@ -32,7 +68,7 @@ * { margin: 0; padding: 0; - font-family: 'Metropolis'; + font-family: 'HarmonyOS'; } *:hover { diff --git a/public/static/index/pc/css/topic_laptop/45w.css b/public/static/index/pc/css/topic_laptop/45w.css new file mode 100644 index 00000000..df83c6dc --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/45w.css @@ -0,0 +1,20 @@ +.dl { + width: 100%; + padding-top: 0.71rem; +} +.dl-t { + color: #fff; + font-size: 0.63rem; + width: 100%; + text-align: center; +} +.dl-p { + color: #cbcfd8; + font-size: clamp(16px, 1vw, 0.22rem); + width: 100%; + text-align: center; + padding-top: 0.43rem; + /* padding-bottom: 0.37rem; */ + line-height: 1.8; + font-family: "HarmonyOS-Light"; +} diff --git a/public/static/index/pc/css/topic_laptop/amd.css b/public/static/index/pc/css/topic_laptop/amd.css new file mode 100644 index 00000000..8baabe27 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/amd.css @@ -0,0 +1,131 @@ +.amd-box { + width: auto; + background: #000; + /* overflow: hidden; */ + max-width: 14.4rem; + /* min-width: 1280px; */ + margin: 0 auto; + /* margin-top:-3.5rem; */ + +} + +.amd-img-box { + max-width: 14.4rem; + /* 移除height:100%，避免继承高度导致比例失效 */ +} + +/* 动画基础样式（保留，仅微调） */ +.amd-img-1, +.amd-img-2, +.amd-img-3, +.amd-img-4, +.amd-img-5, +.amd-img-6 { + max-width: 14.4rem; +} + +.amd-img-2, +.amd-img-3, +.amd-img-4, +.amd-img-5, +.amd-img-6 { + margin-top:0.2rem; +} +.fade-in { + opacity: 1 !important; + transform: translateY(0) !important; + visibility: visible !important; +} + +/* 原有图片样式（重点修改） */ +.amd-img-1-1 { + width: 14.4rem; + display: block; +} +.amd-img-2 { + display: flex; + gap: 0.2rem; +} + +/* 710:210比例的容器（核心修改） */ +.amd-img-2-1, +.amd-img-2-2 { + flex: 1; + width: 50%; +} + +.amd-img-2-1 img, +.amd-img-2-2 img { + width: 7.11rem; + display: block; +} + +.amd-img-3 { + display: flex; + height: auto; + gap: 0.2rem; +} + + +.amd-img-3-left,.amd-img-3-right { + flex: 1; + height: auto; + width: 50%; +} +.amd-img-3-right { + display: flex; + flex-direction: column; + justify-content: space-between +} +.amd-img-3-left img { + display: block; + width: 7.11rem; +} + + +/* 3-2-right：710:210比例 */ +.amd-img-3-1-right,.amd-img-3-2-right { + width: 100%; +} + + +.amd-img-3-1-right img, +.amd-img-3-2-right img { + width: 7.11rem; + height: 100%; + display: block; +} + +/* 统一处理其他图片容器的比例 */ +.amd-img-4 { + width: 14.4rem; +} + +.amd-img-4 img { + width: 100%; + height: 100%; + display: block; +} + +.amd-img-5 { + /* max-width: 1440px; */ + width: 100%; + display: flex; + gap: 0.2rem; +} + +.amd-img-5 img { + flex: 1; + width: 7.11rem; + display: block; +} + +.amd-img-6 { + width: 14.4rem; +} + +.amd-img-6 img { + width: 100%; + height: 100%; + display: block; +} diff --git a/public/static/index/pc/css/topic_laptop/amd1.css b/public/static/index/pc/css/topic_laptop/amd1.css new file mode 100644 index 00000000..2c4e124d --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/amd1.css @@ -0,0 +1,150 @@ +.amd-box { + width: 100%; + background: #000; + overflow: hidden; + max-width: 1440px; + min-width: 1280px; + margin: 0 auto; + margin-top:-2rem; + +} + +.amd-img-box { + width: 100%; + /* 移除height:100%，避免继承高度导致比例失效 */ +} + +/* 动画基础样式（保留，仅微调） */ +.amd-img-1, +.amd-img-2, +.amd-img-3, +.amd-img-4, +.amd-img-5, +.amd-img-6 { + width: 100%; +} + +.amd-img-2, +.amd-img-3, +.amd-img-4, +.amd-img-5, +.amd-img-6 { + margin-top:0.15rem; +} +.fade-in { + opacity: 1 !important; + transform: translateY(0) !important; + visibility: visible !important; +} + +/* 原有图片样式（重点修改） */ +.amd-img-1-1 { + max-width: 14.4rem; + width: 100%; + /* 移除height:100%，改用auto保持比例 */ + height: auto; + + /* aspect-ratio: 1440/429; */ + display: block; +} + +.amd-img-2 { + display: flex; + gap: 0.2rem; +} + +/* 710:210比例的容器（核心修改） */ +.amd-img-2-1, +.amd-img-2-2 { + flex: 1; + width: 50%; + /* 固定宽高比：710/210 ≈ 3.38，反向则210/710≈29.58% */ + /* aspect-ratio: 711/261; */ + overflow: hidden; /* 裁剪超出部分（可选） */ +} + +.amd-img-2-1 img, +.amd-img-2-2 img { + width: 100%; + height: 100%; + display: block; + aspect-ratio: 711/261; +} + +.amd-img-3 { + display: flex; + height: auto; + gap: 0.2rem; +} + + +.amd-img-3-left,.amd-img-3-right { + flex: 1; + height: auto; + width: 50%; +} +.amd-img-3-right { + display: flex; + flex-direction: column; + justify-content: space-between +} +.amd-img-3-left img { + display: block; + aspect-ratio: 711/541; +} + + +/* 3-2-right：710:210比例 */ +.amd-img-3-1-right,.amd-img-3-2-right { + width: 100%; +} + + +.amd-img-3-1-right img, +.amd-img-3-2-right img { + width: 100%; + height: 100%; + display: block; + aspect-ratio: 711/261; +} + +/* 统一处理其他图片容器的比例 */ +.amd-img-4 { + max-width: 1440px; + aspect-ratio: 1440/178; /* 按原始1440:178比例固定 */ +} + +.amd-img-4 img { + width: 100%; + height: 100%; + /* object-fit: cover; */ + display: block; +} + +.amd-img-5 { + max-width: 1440px; + display: flex; + gap: 0.2rem; + aspect-ratio: 1440/260; /* 1440:260比例 */ +} + +.amd-img-5 img { + flex: 1; + width: 50%; + height: 100%; + /* object-fit: cover; */ + display: block; +} + +.amd-img-6 { + max-width: 1440px; + aspect-ratio: 1440/260; /* 1440:260比例 */ + overflow: hidden; +} + +.amd-img-6 img { + width: 100%; + height: 100%; + /* object-fit: cover; */ + display: block; +} diff --git a/public/static/index/pc/css/topic_laptop/bly.css b/public/static/index/pc/css/topic_laptop/bly.css new file mode 100644 index 00000000..d4631ca2 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/bly.css @@ -0,0 +1,49 @@ +.bly { + /* max-width: 1440px; + min-width: 1280px; */ + max-width: 14.4rem; + margin: 0 auto; + aspect-ratio: 1437/679; + /* max-height: 6.97rem; */ + padding-top:4.41rem; +} + +.bly .ba-slider .handle:after { + 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('https://dev.ow.f2b211.com/static/index/pc/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; + box-shadow: none; +} + +.bly .ba-slider .handle.ba-draggable:after { + transform: scale(0.8); +} +.bly-t { + font-size: 0.63rem; + color: #fff; + text-align: center; + width: 100%; +} +.bly-p { + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + text-align: center; + width: 100%; + padding-top: 0.43rem; + padding-bottom: 1rem; + font-family: "HarmonyOS-Light"; +} diff --git a/public/static/index/pc/css/topic_laptop/bottom.css b/public/static/index/pc/css/topic_laptop/bottom.css new file mode 100644 index 00000000..19c7bf96 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/bottom.css @@ -0,0 +1,64 @@ +.bottom-img-box { + width: 100%; + /* min-width: 1280px; */ + padding: 3rem 0; +} +.bottom-img { + /* width: 14.416rem; */ + max-width: 14.4rem; + width: 14.4rem; + /* min-width:12.8rem; */ + display: flex; + flex-wrap: wrap; + justify-content: space-between; + margin: 0 auto; +} +.bottom-img img { + width: 33%; + /* flex:1; */ + height: auto; + +} +.bottom-img img:nth-child(4) { + padding-top: 8px; +} +.bottom-img img:nth-child(5) { + padding-top: 8px; +} +.bottom-img img:nth-child(6) { + padding-top: 8px; +} +.bottom-text { + width: 100%; + margin-bottom: 4.3rem; +} +.bottom-p { + max-width: 14.4rem; + /* min-width: 1280px; */ + margin:0 auto; + font-size:clamp(16px, 1vw, 0.22rem); + color:#cbcfd8; + white-space: normal; +} +.bottom-p p { + text-indent:clamp(-16px, -1vw, -0.22rem); + line-height: 1.8; + margin-bottom: 0.1rem; + font-family: "HarmonyOS-Light"; + letter-spacing:1px; +} +.bottom-p1 { + max-width: 14.4rem; + /* min-width: 1280px; */ + margin:0 auto; + font-size:clamp(16px, 1vw, 0.22rem); + color:#cbcfd8; + white-space: normal; +} +.bottom-p1 p{ + text-indent:clamp(-16px, -1vw, -0.22rem); + /* line-height: 1.8; */ + /* margin-bottom: 0.1rem; */ + font-family: "HarmonyOS-Light"; + /* letter-spacing:1px; */ +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/footer.css b/public/static/index/pc/css/topic_laptop/footer.css new file mode 100644 index 00000000..ae495159 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/footer.css @@ -0,0 +1,162 @@ +.orico_footer { + background: #000; + font-size: 16px; /* 1rem*16=16px */ + } + .orico_footer .fotter { + margin: 0 auto; + overflow: hidden; + padding-bottom: 88px; /* 5.5rem*16=88px */ + padding-top: 36px; /* 2.25rem*16=36px */ + position: relative; + } + .orico_footer .fotter .footerico { + position: absolute; + height: 50px; /* 3.125rem*16=50px */ + left: 8%; + top: 5%; + } + .orico_footer .fotter .footerMain { + min-width: 1024px; + max-width: 1200px; /* 75rem*16=1200px */ + 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; */ + display: flex; + flex-direction: column; + margin-bottom: 20px; /* 原px保留 */ + } + .orico_footer .fotter .footerMain .foottxttop .foootCt .ftitle { + font-weight: 700; + color: #fff; + font-size: 20px; /* 1.25rem*16=20px */ + margin-bottom: 30px; /* 原px保留 */ + } + .orico_footer .fotter .footerMain .foottxttop .foootCt ul { + /* display: grid; + gap: 0.75rem; */ + display: flex; + flex-direction: column; + } + .orico_footer .fotter .footerMain .foottxttop .foootCt ul li { + margin-bottom: 15px; /* 原px保留 */ + } + .orico_footer .fotter .footerMain .foottxttop .foootCt ul .fline { + color: #fff; + opacity: 0.7; + transition: opacity 0.2s ease-in-out; + overflow-wrap: anywhere; + font-size: 16px; /* 兜底确保16px */ + } + .orico_footer .fotter .footerMain .foottxtbottom { + padding-left: 14%; + display: grid; + padding-top: 4%; + } + .orico_footer .fotter .footerMain .foottxtbottom .ftopicos { + display: flex; + justify-content: space-between; + align-items: center; + padding-bottom: 1%; + gap: 32px; /* 2rem*16=32px */ + } + .orico_footer .fotter .footerMain .foottxtbottom .ftopicos ul { + /* gap: 0.75rem 1.5rem; */ + flex-wrap: wrap; + display: flex; + } + .orico_footer .fotter .footerMain .foottxtbottom .ftopicos ul a { + margin-right: 32px; /* 2rem*16=32px */ + } + .orico_footer .fotter .footerMain .foottxtbottom .ftopicos ul img { + height: 30px; /* 原px保留 */ + width: 30px; /* 原px保留 */ + } + .orico_footer .fotter .footerMain .foottxtbottom .ftcopyright { + color: #b3b3b3; + font-size: 16px; /* 原0.875rem=14px → 提升至16px */ + } + .orico_footer .fotter .footerMain .foottxtbottom .ftcopyright a { + color: #b3b3b3; + font-size: 16px; /* 兜底确保16px */ + } + .orico_footer .fotter .footerMain .foottxtbottom .batext { + color: #fff; + font-size: 16px; /* 原14px → 提升至16px */ + margin-top: 5px; /* 原px保留 */ + } + + .oricoCont { + width: 100%; + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 56px 0; /* 3.5rem*16=56px */ + background: transparent; + background: #f2f2f2; + } + .oricoCont .ctitem { + width: 45%; + display: flex; + flex-direction: column; + align-items: center; + } + .oricoCont .ctitem .ctimg { + max-width: 100px; /* 6.25rem*16=100px */ + width: 60px; /* 3.75rem*16=60px */ + height: 60px; /* 3.75rem*16=60px */ + margin-top: 2%; + display: block; + margin-left: auto; + margin-right: auto; + } + .oricoCont .ctitem .cttitle { + font-size: 20px; /* 1.25rem*16=20px */ + text-align: center; + font-weight: 600; + line-height: 40px; /* 2.5rem*16=40px */ + } + .oricoCont .ctitem .ctdec { + font-size: 16px; /* 原0.875rem=14px → 提升至16px */ + text-align: center; + line-height: 16px; /* 1rem*16=16px */ + margin: auto; + } + .backtop { + position: fixed; + right: 20px; /* 1.25rem*16=20px */ + padding: 10px 5px; /* 原px值保留 */ + bottom: 10%; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + color: #666; + font-size: 16px; /* 原0.75rem=12px → 提升至16px保障可读性 */ + background: #fff; + cursor: pointer; + border: 1px solid rgb(241, 241, 241); +} + +.backtop .ictop { + height: 18px; /* 1.125rem*16=18px */ + width: 15px; /* 0.9375rem*16=15px */ + margin-bottom: 4px; /* 0.25rem*16=4px */ +} + @media screen and (max-width: 1777px) { + .footerico { + top: 65% !important; + bottom: 24%; + left: 50% !important; + } + } \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/fs.css b/public/static/index/pc/css/topic_laptop/fs.css new file mode 100644 index 00000000..60c04e64 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/fs.css @@ -0,0 +1,57 @@ +.fs { + min-width: 1280px; +} +.fs-box { + width: 100%; + aspect-ratio: 16/9; /* 2560/1440=16/9，核心比例约束 */ + position: relative; + will-change: contents; /* 告诉浏览器该元素即将变化，提前优化 */ + contain: layout paint; /* 限制重排重绘范围 */ +} +.fs-img, .fs-video { + backface-visibility: hidden; /* 开启硬件加速 */ + transform: translateZ(0); /* 硬件加速 */ +} +.fs-box img { + width: 100%; +} +.fs-box-img { + display: flex; + /* width: 100%; + position: absolute; + bottom: -60px; */ + display: flex; + flex-wrap: wrap; + /* justify-content: center; + gap: 0.2rem; */ + min-width: 1280px; +} + +.fs-h-img { + width: 100%; + display: flex; + justify-content: center; + gap: 0.2rem; + /* margin-top: 0.2rem; */ + min-width: 1280px; +} +.fs-h-img img { + max-width: 7.1rem; +} +.fs-b-img { + width: 100%; + display: flex; + justify-content: center; + margin-top: 0.2rem; + min-width: 1280px; +} +.fs-b-img img { + width: 100%; + max-width: 14.4rem; +} +.fs-ts { + font-size: clamp(16px, 1vw, 0.22rem); + text-align: center; + color:#cbcfd8; + padding:0.4rem 0; +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/header.css b/public/static/index/pc/css/topic_laptop/header.css new file mode 100644 index 00000000..a74d0248 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/header.css @@ -0,0 +1,406 @@ +@charset "UTF-8"; +/* 全局文字最小尺寸兜底 */ +.header-PC { + width: 100%; + + height: 60px; + background: #fff; + display: flex; + justify-content: center; + position: fixed; + top: 0; + z-index: 100; +} +.header-PC * { + min-font-size: 16px !important; /* 强制最小16px */ + box-sizing: border-box; +} + +.header-PC #header { + margin: 0 auto; + height: 60px; /* 0.6rem*100=60px */ + max-width: var(--max-width); + /* position: fixed; + top: 0; */ + display: flex; + flex-direction: row; + align-items: center; + z-index: 999; + background: white; + color: black; + width: 100%; + font-size: 16px; /* 基础字号16px */ +} +.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: 16px; /* 强制16px */ + position: relative; + display: flex; + flex-direction: row; + align-items: center; + flex-wrap: wrap; + justify-content: center; + width: 12.5%; + height: 60px; /* 0.6rem*100=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; /* 0.05rem*100=5px */ + padding-left: 20px; /* 0.2rem*100=20px */ + text-decoration: none; + word-break: keep-all; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + word-wrap: break-word; + text-wrap: nowrap; + font-size: 16px; /* 确保16px */ +} +.header-PC #header .nav2 .navItem .downimg { + height: 12px; /* 0.12rem*100=12px */ +} +.header-PC #header .nav2 .navItem .navItemConten { + width: 100%; + z-index: 999; + background-color: #f2f2f2; + max-height: 660px; /* 6.6rem*100=660px */ + box-shadow: 3px 5px 60px -20px #88909a; /* 0.03/0.05/0.6/-0.2rem 转px */ + position: fixed; + border: 1px solid lightgray; + top: 60px; /* 0.6rem*100=60px */ + transition: max-height 0.5s ease-out, opacity 0.5s ease-out; + left: 0; + display: none; + font-size: 16px; /* 基础字号16px */ +} +.header-PC #header .nav2 .navItem .navItemConten .navItem_cyleft { + float: left; + text-align: center; + width: 20%; + max-height: 660px; /* 6.6rem*100=660px */ + font-size: 16px; /* 强制16px */ +} +.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: 44px; /* 0.44rem*100=44px */ + color: #656a6d; + font-size: 16px; /* 确保16px */ +} +.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: 660px; /* 6.6rem*100=660px */ + min-height: 460px; /* 4.6rem*100=460px */ + overflow-y: auto; + border-left: 1px solid #dddddd; + font-weight: normal; + background-color: #fff; + margin: 0 auto; + box-shadow: -3px 0 0px #f3f3f3; /* -0.03rem*100=-3px */ + text-align: left; +} +.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dt { + font-size: 16px; /* 原0.14rem=14px → 提升至16px */ + line-height: 16px; /* 0.16rem*100=16px */ + margin-inline-start: 20px; /* 0.2rem*100=20px */ + font-weight: 600; + border-bottom: 1px solid rgba(225, 225, 225, 0.5); + padding-bottom: 13px; /* 0.13rem*100=13px */ + padding-top: 16px; /* 0.16rem*100=16px */ +} +.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dt img { + height: 16px; /* 0.16rem*100=16px */ + 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; + font-size: 16px; /* 确保16px */ +} +.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dd { + font-size: 16px; /* 原0.14rem=14px → 提升至16px */ + line-height: 40px; /* 0.4rem*100=40px */ + padding-top: 0vw; + font-weight: 100; + display: inline-block; + margin-right: 3%; + margin-inline-start: 40px; /* 0.4rem*100=40px */ +} +.header-PC #header .nav2 .navItem .navItemConten .navItem_cyright .nav_cyrightit dd a { + font-size: 16px; /* 确保16px */ +} +.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: 660px; /* 6.6rem*100=660px */ + opacity: 1; +} +.header-PC #header .nav2 .navItem .navItemConten1 { + background-color: #fff; + color: black; + position: absolute; + top: 60px; /* 0.6rem*100=60px */ + left: 20px; /* 0.2rem*100=20px */ + width: auto; + height: auto; + z-index: 9999; + border-radius: 5px; /* 0.05rem*100=5px */ + box-shadow: 0 0 1px 0 #88909a; /* 0.01rem*100=1px */ + display: none; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 8px 0; /* 0.08rem*100=8px */ + font-size: 16px; /* 基础字号16px */ +} +.header-PC #header .nav2 .navItem .navItemConten1 li { + color: #fff; + float: left; + text-align: center; + line-height: 24px; /* 0.24rem*100=24px */ + padding: 8px 32px; /* 0.08/0.32rem*100=8/32px */ + display: list-item; +} +.header-PC #header .nav2 .navItem .navItemConten1 li a { + cursor: pointer; + padding-left: 0; + white-space: nowrap; + font-size: 16px; /* 确保16px */ +} +.header-PC #header .nav2 .navItem > a.active, +.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; + font-size: 16px; /* 基础字号16px */ +} +.header-PC #header .nav3 .searchimg { + margin-left: 10%; +} +.header-PC #header .nav3 .storetopbt { + background: #004cfa; + color: #fff; + padding: 0 15px; /* 0.15rem*100=15px */ + border-radius: 20px; /* 0.2rem*100=20px */ + height: 38px; /* 0.38rem*100=38px */ + line-height: 40px; /* 0.4rem*100=40px */ + margin-left: 15%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + font-size: 16px; /* 强制16px */ +} +.header-PC #header .nav3 .storetopbt .storeImgico { + width: 20px; /* 0.2rem*100=20px */ + margin-right: 8px; /* 0.08rem*100=8px */ +} +.header-PC #header .nav3 .choesCountry { + position: relative; + margin-left: 15%; + display: flex; +} +.header-PC #header .nav3 .choesCountry .topCountry { + display: none; + width: 340px; /* 3.4rem*100=340px */ + background-color: white; + /* position: fixed; */ + position: absolute; + right: -150px; + top: 50px; /* 0.8rem*100=80px */ + border-radius: 15px; /* 0.15rem*100=15px */ + box-shadow: 2px 2px 10px 1px #88909a; /* 0.02/0.02/0.1/0.01rem 转px */ + font-size: 16px; /* 基础字号16px */ +} +.header-PC #header .nav3 .choesCountry .topCountry li { + width: 100%; + height: 50px; /* 0.5rem*100=50px */ + line-height: 50px; /* 0.5rem*100=50px */ + text-align: center; + display: flex; +} +.header-PC #header .nav3 .choesCountry .topCountry li .countryName { + width: 70%; + text-align: left; + margin-left: 10px; /* 0.1rem*100=10px */ + font-size: 16px; /* 强制16px */ +} +.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: 20px; /* 0.2rem*100=20px */ + margin-top: 15px; /* 0.15rem*100=15px */ + vertical-align: top; +} +.header-PC #header .nav3 .choesCountry .topCountry li.closec { + display: flex; + flex-direction: row; + justify-content: end; + height: 30px; /* 0.3rem*100=30px */ +} +.header-PC #header .nav3 .choesCountry .topCountry .closecountrybt { + color: #aaa; + margin-top: -5px; /* 0.05rem*100=5px */ + cursor: pointer; + height: 20px; /* 0.2rem*100=20px */ + width: 20px; /* 0.2rem*100=20px */ + margin-right: 10px; /* 0.1rem*100=10px */ + font-size: 16px; /* 确保关闭按钮文字16px */ +} +.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: 20px; /* 0.2rem*100=20px */ + border-radius: 20px; /* 0.2rem*100=20px */ + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* 0.04/0.08rem 转px */ + border: 1px solid rgba(0, 0, 0, 0.2); + position: fixed; + right: 2%; + width: 33%; + top: 80px; /* 0.8rem*100=80px */ + height: 80%; + overflow-y: auto; + z-index: 998; + font-size: 16px; /* 基础字号16px */ +} +.header-PC .searchmodalMian .searchmodalct .close-btn { + color: #aaa; + float: right; + font-size: 24px; /* 0.24rem*100=24px */ + cursor: pointer; +} +.header-PC .searchmodalMian .searchmodalct #serrchinput { + margin-left: 10%; + margin-top: 5%; + width: 80%; + height: 44px; /* 0.44rem*100=44px */ + border: 1px solid grey; + border-radius: 22px; /* 0.22rem*100=22px */ + background-position: 95% 50%; + padding-left: 5%; + font-size: 16px; /* 输入框文字16px */ +} +.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; /* 保持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 .popProduct .popmain{ + width: 100%; +} +.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: 7%; + margin-left: 1%; + display: flex; + flex-direction: column; + justify-content: center; + width: 30%; + align-items: center; + overflow: hidden; +} +.header-PC .searchmodalMian .searchmodalct .searchhistory .popmain .popitem .popimg, +.header-PC .searchmodalMian .searchmodalct .popProduct .popmain .popitem .popimg { + width: 115px; /* 1.15rem*100=115px */ + height: 115px; /* 1.15rem*100=115px */ + 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; + text-overflow: ellipsis; + font-size: 16px; /* 原0.128rem=12.8px → 提升至16px */ + margin-top: 10%; +} +.header-PC .searchmodalMian .searchmodalct .popProduct .popmain .popitem .productName + { + width: 100%; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + display: block; + font-size: 16px; /* 原14px → 提升至16px */ + } + .header-PC .searchmodalMian .searchmodalct .popProduct .popmain .popitem .produc-dec{ + font-size: 16px; /* 原10px → 提升至16px */ + color: #000000; + margin-top: 1%; + } \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/index.css b/public/static/index/pc/css/topic_laptop/index.css new file mode 100644 index 00000000..cd66744a --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/index.css @@ -0,0 +1,45 @@ + +html { + width: 100%; +} +body { + /* width: 100vw; + height: 100vh; */ + background: #000; + overflow-x: hidden; + scroll-behavior: smooth !important; + -webkit-overflow-scrolling: touch !important; + /* padding: 0 !important; + margin:0 !important; */ + /* max-width:100% !important; + width: 100vw !important; + margin:0 auto; */ + /* max-width:100vw !important */ + /* margin:0 auto !important; */ +} +/* 当视口宽度大于1920px时生效 */ +@media screen and (min-width: 1920px) { + /* 这里写你的样式 */ + body { + max-width:100% !important; + width: 100vw !important; + } + + } +.opacity0 { + opacity: 0; + transform: translateY(0.5rem); + visibility: hidden; + /* margin-top: 20px; */ + will-change: opacity, transform; + backface-visibility: hidden; + perspective: 1000px; + transition: + opacity 1.2s ease-in-out, + transform 1.2s ease-in-out, + visibility 1.2s ease-in-out; +} + /* 18-19号防卡顿：延迟19号动画 */ + /* [data-order="19"] { + transition: all 0.3s ease-out 0.2s !important; + } */ diff --git a/public/static/index/pc/css/topic_laptop/ips.css b/public/static/index/pc/css/topic_laptop/ips.css new file mode 100644 index 00000000..41815d31 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/ips.css @@ -0,0 +1,91 @@ +.ips { + position: relative; + width: 100%; + aspect-ratio: 2560/1657; /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/ips1.png'); + background-repeat: no-repeat; + background-size: 100% auto; 宽度铺满，高度自动 */ + min-width: 1280px; + /* margin-top: 2.69rem; */ +} +.ips-text { + color: #cbcfd8; + /* width: 1440px; */ + min-width: 1280px; + /* max-width: 1440px; */ + /* margin-left: 6rem; */ + width: 100%; +} +.ips-t { + color: #fff; + font-size: 0.63rem; + padding-top:3.9rem; + padding-left: 5.63rem; +} +.ips-p { + font-size: clamp(16px, 1vw, 0.22rem); + padding-top: 0.86rem; + padding-left: 5.63rem; + line-height: 1.8; + color:#cbcfd8; + font-family: "HarmonyOS-Light"; +} + +.ips-img { + display: flex; + flex-wrap: wrap; /* 允许换行 */ + justify-content: space-between; /* 左对齐，也可设为center（居中） */ + margin-left: 5.63rem; + width: 6.9rem; + padding-top: 2rem; +} + +.ips-img img { + max-width: 2.2rem; +} +.ips-img img:nth-child(2) { + margin-left: 2.5rem; +} +.ips-img img:nth-child(4) { + margin-left: 2.5rem; + margin-top: 1.22rem; +} +.ips-img img:nth-child(3) { + margin-top: 1.22rem; +} + +.ips-img1 { + display: flex; + flex-wrap: wrap; /* 允许换行 */ + justify-content: space-between; /* 左对齐，也可设为center（居中） */ + margin-left: 5.63rem; + width: 7.35rem; + padding-top: 2.03rem; +} + + +.ips-img1 img:nth-child(1) { + width: 100%; + max-width: 2.76rem; + /* aspect-ratio: 276/168; */ +} +.ips-img1 img:nth-child(2) { + width: 100%; + max-width: 3.35rem; + max-height:1.3rem ; + /* aspect-ratio: 335/130; */ +} +.ips-img1 img:nth-child(3) { + width: 100%; + max-width: 2.67rem; + max-height: 1.18rem; + /* aspect-ratio: 267/118; */ + margin-top: 1.36rem; +} +.ips-img1 img:nth-child(4) { + width: 100%; + max-width: 3.39rem; + /* aspect-ratio: 339/122; */ + margin-top: 1.36rem; + max-height: 1.22rem; +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/jk.css b/public/static/index/pc/css/topic_laptop/jk.css new file mode 100644 index 00000000..954dcd8b --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/jk.css @@ -0,0 +1,128 @@ +/* 图片容器：100vw宽，最小宽度1440px，按图片原始比例（2560:1857）定高 */ +.zoom-container { + width: 100%; + min-width: 1440px; + overflow: hidden; + position: relative; + /* 固定比例：高度 = 宽度 * 1857/2560，确保图片不裁切 */ + aspect-ratio: 2560 / 1857; + height: auto; /* 替代原max计算，用aspect-ratio保证比例 */ +} + +/* 图片包裹层：与容器同尺寸，定位参考系，承接缩放变换 */ +.img-wrapper { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + overflow: hidden; + z-index: -10; +} + +/* 图片：按原始比例填充包裹层，不裁切，初始放大+过渡动画 */ +.bg-img { + width: 100%; + height: 100%; + object-fit: contain; /* 改为contain，确保图片完整显示，不裁切 */ + display: block; + transform: scale(1.5); + transition: transform 1.8s ease; + transform-origin: center center; +} + +/* 图片缩小后的状态 */ +.bg-img.zoom-out { + transform: scale(1); +} + +/* 标注样式：关键修正 - 基于容器绝对定位，百分比参考图片原始比例 */ +.annotation { + position: absolute; + color: #48494D; + font-size: calc(12px + 0.3vw); + opacity: 0; + transform: translateY(calc(10px + 0.5vw)); + transition: opacity 0.8s ease, transform 0.8s ease; + pointer-events: none; + z-index: 10; + white-space: nowrap; + /* 关键：标注的定位参考系是容器（与图片同比例），而非缩放后的图片 */ + top: 0; + left: 0; + /* 重置默认值，依赖内联style的百分比定位 */ +} + +/* 标注显示状态 */ +.annotation.anno-show { + opacity: 1; + transform: translateY(0); +} + +.annotation span { + position: relative; + display: inline-block; + /* 确保文字居中对齐 */ + text-align: center; +} + +/* 标注线条样式：基于文字定位，适配缩放 */ +.annotation span::before { + content: ''; + position: absolute; + left: 50%; + transform: translateX(-50%); + width: 1px; + height: 0; + bottom: calc(100% + 6px); + background-color: #48494D; + transition: height 0.8s ease; + transform-origin: bottom center; +} + +/* 标注显示时，设置线条最终高度 */ +.annotation.anno-show span::before { + height:clamp(50px,3vw,0.6rem); + /* 最终高度（vw单位） */ +} +.zoom-text { + padding-top: 3rem; + padding-bottom: 2rem; +} +.zoom-text div{ + width: 100%; + text-align: center; + font-size:0.63rem; + color:#fff +} +.zoom-text p{ + width: 100%; + text-align: center; + font-size:clamp(16px,1vw,0.22rem); + color:#cbcfd8; + padding-top: 0.43rem; + font-family: "HarmonyOS-Light"; +} +/* 响应式适配：1280px以下固定尺寸 */ +@media (max-width: 1280px) { + .zoom-container { + min-width: 1280px; /* 最小宽度适配 */ + } + .annotation span::before { + bottom: calc(100% + 6px); + } + .annotation.anno-show span::before { + height: 38px; /* 固定高度 */ + } + .annotation { + font-size: 14px; /* 固定字体大小，避免过小 */ + } +} + +/* 标注延迟类 */ +.anno-delay-1 { + transition-delay: 0.8s; +} +.anno-delay-1 span::before { + transition-delay: 0.8s; +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/lb.css b/public/static/index/pc/css/topic_laptop/lb.css new file mode 100644 index 00000000..a52960cf --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/lb.css @@ -0,0 +1,163 @@ + +/* .lb { + position: relative; + width: 100%; + height: 100%; +} */ +/* 外层容器：完全保留你的REM样式 */ +.carousel-wrapper { + width: 100%; + margin: 0 auto; + display: flex; + align-items: center; + justify-content: center; + gap: 0; + padding: 0; + padding-top: 0.4rem; + position: relative; + box-sizing: border-box; +} + +/* 轮播容器：核心 - REM控制最大宽度，宽度100%自适应 */ +.carousel-container { + width: 100%; + max-width: 14.4rem; /* 你的REM限制，保留 */ + overflow: hidden !important; + border-radius: 8px; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); + flex-shrink: 0; + box-sizing: border-box !important; + transform: translateZ(0); + clip-path: inset(0 1px 0 0); +} + +/* 轮播图片列表：flex布局，无固定宽度，靠子元素撑满 */ +.carousel-imgs { + display: flex; + transition: transform 0.5s ease-out; /* 顺滑过渡 */ + will-change: transform; /* 性能优化 */ + height: auto; + flex-wrap: nowrap; /* 禁止换行 */ + margin: 0 !important; + padding: 0 !important; +} + +/* 单张图片：REM控制最大宽度，宽度100%继承容器 */ +.carousel-img { + width: 100%; + max-width: 14.4rem; /* 你的REM限制，保留 */ + flex-shrink: 0; /* 禁止收缩 */ + object-fit: cover; /* 保持比例，不拉伸 */ + height: auto; /* 高度自适应 */ + display: block; /* 去除默认间隙 */ + margin: 0 !important; + padding: 0 !important; + image-rendering: crisp-edges; + box-sizing: border-box; +} + +/* 箭头样式：完全保留你的REM样式 */ +.carousel-arrow { + width: 0.77rem; + height: 0.77rem; + background: transparent; + border: none; + border-radius: 50%; + cursor: pointer; + z-index: 10; + display: flex; + align-items: center; + justify-content: center; + transition: all 0.3s ease; + opacity: 0.85; + user-select: none; + flex-shrink: 0; + margin: 0 20px; + /* position: absolute; + top: 50%; + transform: translateY(-50%); */ +} +.carousel-arrow img { + width: 100%; + height: 100%; + object-fit: contain; + border-radius: 50%; +} +.carousel-arrow:hover { + opacity: 1; + /* transform: translateY(-50%) scale(1.1); */ + box-shadow: 0 6px 20px rgba(0, 120, 255, 0.4); +} +.arrow-left { + margin-right: 1rem; + /* left: 0; */ +} +.arrow-right { + margin-left: 1rem; + /* right: 0; */ +} + +/* 文字区域：完全保留你的REM样式 */ +.carousel-texts { + box-sizing: border-box; + max-width: 14.4rem; + margin: 0 auto; + display: flex; + justify-content: space-between; + /* padding-top: 1rem; */ + position: relative; + z-index: 10; + padding:1rem 0.28rem 0 0.52rem; +} +.carousel-text { + border-bottom: 3px solid transparent; + transition: all 0.3s ease; + cursor: pointer; + border-radius: 4px; + color:#48494D; + user-select: none; +} +.carousel-text.active { + transform: translateY(-3px); + color: #fff !important; + /* border-bottom-color: #fff; */ +} +.carousel-text-t { + font-size: 0.32rem; + text-align: center; + +} +.carousel-text-t1{ + font-size: clamp(0.18rem, 1vw, 0.26rem); /* REM版clamp */ + text-align: center; +} +.carousel-text-p1 { + font-size: clamp(0.16rem, 1vw, 0.22rem); /* REM版clamp */ + padding-top: 0.28rem; + text-align: center; + font-family: "HarmonyOS-Light"; +} +.carousel-text-p { + font-size: clamp(0.16rem, 1vw, 0.22rem); /* REM版clamp */ + padding-top: 0.3rem; + text-align: center; + font-family: "HarmonyOS-Light"; +} + +/* 响应式适配：小屏幕REM缩放 */ +@media (max-width: 768px) { + .carousel-arrow { + width: 0.6rem; + height: 0.6rem; + margin: 0 0.1rem; + } + .arrow-left { + margin-right: 0.5rem; + } + .arrow-right { + margin-left: 0.5rem; + } + .carousel-text-t { + font-size: 0.28rem; + } +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/m2.css b/public/static/index/pc/css/topic_laptop/m2.css new file mode 100644 index 00000000..df71aeec --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/m2.css @@ -0,0 +1,40 @@ +.m2 { + width: 100%; +} +.m2-bg { + position: relative; + width: 100%; + aspect-ratio: 2560/1800; /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/m2.png'); + background-repeat: no-repeat; + background-size: 100% auto; 宽度铺满，高度自动 */ + min-width: 1280px; +} +.m2-bg-t { + font-size: 0.63rem; + color: #fff; + width: 100%; + text-align: center; + padding-top: 1.78rem; + /* margin-top: 1.78rem; */ +} +.m2-bg-t1 { + font-size: 0.36rem; + color: #fff; + width: 100%; + text-align: center; + padding-top: 1.78rem; +} +.m2-img-box { + position: absolute; + bottom: 2.19rem; + width: 100%; + display: flex; + justify-content: center; + gap: 0.2rem; +} +.m2-img-box img { + max-width: 4.66rem; + aspect-ratio: 466/249 + +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/progress.css b/public/static/index/pc/css/topic_laptop/progress.css new file mode 100644 index 00000000..29d5e9fe --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/progress.css @@ -0,0 +1,203 @@ + /* 你的原始基础样式保留，仅添加/修改性能相关属性 */ + .container { + max-width: 14.4rem; + margin: 0 auto; + border-radius: 12px; + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); + } + + .progress-section { + max-width: 14.4rem; + } + + .progress-title { + font-size: 0.48rem; + color: #fff; + padding: 2.13rem 0 0.78rem 0; + font-family: "HarmonyOS-Medium"; + } + + .progress-item .label { + font-size: 0.4rem; + color: #cbcfd8; + margin-bottom: 0.08rem; + display: flex; + justify-content: space-between; + align-items: baseline; + line-height: 1; + margin-top: 0.3rem; + margin-bottom: 0.76rem; + } + + .progress-item .label .device-name { + flex: 1; + font-family: "HarmonyOS-Medium"; + } + + .progress-item .label .baseline { + color: #cbcfd8; + font-size: 0.6rem; + } + + .progress-item .label .value { + font-size: 0.4rem; + min-width: 0.8rem; + text-align: right; + margin-left: 0.16rem; + font-family: "HarmonyOS-Medium"; + } + + .colorLinearGradient { + background: linear-gradient(90deg, #7e51ff, #d5dfff); + -webkit-background-clip: text; + background-clip: text; + color: transparent; + } + + .progress-item .label .value.m4-max { + color: #5e5ce6; + } + + .progress-item .label .value.gray { + color: #86868b; + } + + .progress-bar-container { + display: flex; + align-items: center; + gap: 0.16rem; + } + + .progress-bar { + flex: 1; + height: 0.2rem; + max-height: 20px; + min-height: 10px; + border-radius: 10px; + overflow: hidden; + position: relative; + /* 性能优化1：开启硬件加速，减少重绘 */ + transform: translateZ(0); + will-change: transform; + } + + .progress-fill { + height: 100%; + border-radius: 0.05rem; + /* 性能优化2：替换width动画为transform，消除重排 */ + transform: scaleX(0); + transform-origin: left center; + transition: transform 1.2s ease-out; + will-change: transform; + position: relative; + /* 移除原始的width: 0; */ + } + + /* 保留你所有原始的进度条颜色类 */ + .progress-fill.m4-max { + background: linear-gradient(40deg, #7e51ff, #e1d5ff); + } + + .progress-fill.m2-max { + background: #bfc5d9; + } + + .progress-fill.m1-max { + background: #bfc5d9; + } + + .progress-fill.baseline { + background: #bfc5d9; + } + + /* 流光动效（保留你的注释，如需启用可直接解开） */ + /* .progress-fill::after { + content: ''; + position: absolute; + top: 0; + left: -100%; + width: 50%; + height: 100%; + background: linear-gradient( + 90deg, + transparent, + rgba(255, 255, 255, 0.3), + transparent + ); + animation: shimmer 1.5s infinite; +} */ + @keyframes shimmer { + 100% { + left: 150%; + } + } + + /* 基准说明（保留原始样式） */ + .baseline-note { + margin-top: 0.3rem; + font-size: 0.13rem; + color: #86868b; + padding-top: 0.15rem; + border-top: 1px solid #e9e9eb; + } + + .baseline-note sup { + font-size: 0.1rem; + vertical-align: top; + } + + /* 保留你所有设计稿固定宽度类（完全不动） */ + .w1440 { + width: 14.4rem; + } + + .w1368 { + width: 13.68rem; + } + + .w1243 { + width: 12.43rem; + } + + .w964 { + width: 9.64rem; + } + + .w681 { + width: 6.81rem; + } + + .w1274 { + width: 12.74rem; + } + + .w1000 { + width: 10rem; + } + + .font32 { + font-size: 0.32rem !important; + } + + .colorCBCFD8 { + color: #646778 !important; + } + + .color8A8787 { + color: #646778 !important; + } + + .progress-p { + color: #cbcfd8; + font-size: clamp(16px, 1vw, 0.22rem); + margin-top: 1.56rem; + margin-bottom: 2rem; + text-align: center; + } + + .progress-p1 { + color: #cbcfd8; + font-size: clamp(16px, 1vw, 0.22rem); + margin-top: 1.56rem; + text-align: center; + } \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/qb.css b/public/static/index/pc/css/topic_laptop/qb.css new file mode 100644 index 00000000..21abb5bc --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/qb.css @@ -0,0 +1,25 @@ +/* .qb { + position: absolute; + top:3rem; + left: 50%; + transform: translateX(-50%); +} */ +.qb-t { + width: 100%; + font-size: 0.63rem; + color: #fff; + text-align: center; + padding-top: 3rem; +} +.qb-p { + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + text-align: center; + padding-top: 0.43rem; + padding-bottom: 0.56rem; + font-family: "HarmonyOS-Light"; +} +.qb-bg-img1 { + max-width: 16.43rem; + min-height: 13.31rem; +} diff --git a/public/static/index/pc/css/topic_laptop/readon.css b/public/static/index/pc/css/topic_laptop/readon.css new file mode 100644 index 00000000..2b98204b --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/readon.css @@ -0,0 +1,79 @@ +.readon-box { + position: relative; + width: 100%; + aspect-ratio: 16/9; /* 2560/1440=16/9，核心比例约束 */ + background-repeat: no-repeat; + background-size: 100% auto; /* 宽度铺满，高度自动 */ + margin-bottom: 2.63rem; +} + + +.readon-text { + /* max-width: 1440px; + min-width: 1280px; */ + width: 14.4rem; + margin: 0 auto; +} +.readon-t { + color: #fff; + font-size: 0.68rem; + /* line-height: 1.4; */ + /* padding-top: 1.01rem; + padding-bottom: 0.50rem; */ +} +.readon-t div:nth-child(1) { + padding-top: 1.34rem; + padding-bottom: 0.41rem; +} +.readon-t div:nth-child(2),.readon-t div:nth-child(3){ + font-size:0.63rem; +} +.readon-p { + color: #cbcfd8; + font-size: 0.64rem; +} +.readon-js { + color: #cbcfd8; + font-size: 0.27rem; + line-height: 1.8; + margin-top: 0.72rem; + font-family: "HarmonyOS-Light"; +} +.readon-js1 { + color: #cbcfd8; + font-size: 0.22rem; + line-height: 1.8; + margin-top: 0.72rem; + font-family: "HarmonyOS-Light"; +} +.readon-img,.readon-img1 { + width: 100%; + /* max-w + max-width: 1440px; + min-width: 1280px; */ + margin-top:2.37rem; +} +.readon-img img { + width: 100%; + max-width: 3.78rem; + aspect-ratio: 378/218; +} +.readon-img1 img { + width: 100%; + max-width: 3.73rem; + /* aspect-ratio: 378/218; */ +} +.readon-img-box { + width: 100%; + min-width: 1280px; + position: absolute; + margin: 0 auto; + bottom: -0.61rem; + display: flex; + justify-content: center; + gap: 0.2rem; +} +.readon-img-box img { + max-width: 3.45rem; + aspect-ratio:345/245; +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/rgb.css b/public/static/index/pc/css/topic_laptop/rgb.css new file mode 100644 index 00000000..2296a707 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/rgb.css @@ -0,0 +1,46 @@ +.rgb { + position: relative; + width: 100%; + aspect-ratio: 7680/2889; /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/rgb.png'); + background-repeat: no-repeat; + background-size: 100% auto; */ + min-width: 1280px; + margin-top: 2.7rem; +} +.rgb-text { + position: absolute; + top: -1rem; + width: 100%; + display: flex; + flex-direction: column; + justify-content: center; +} +.rgb-t { + width: 100%; + font-size: 0.63rem; + color: #fff; + text-align: center; +} +.rgb-p { + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + text-align: center; + padding-top: 0.43rem; + line-height: 1.8; + font-family: "HarmonyOS-Light"; +} +.rgb-img { + width: 100%; + min-width: 1280px; + position: absolute; + bottom: -1.41rem; + display: flex; + justify-content: center; + gap: 0.2rem; +} +.rgb-img img { + max-width:4.66rem; + aspect-ratio: 466/261; + display: block; +} diff --git a/public/static/index/pc/css/topic_laptop/swiper.css b/public/static/index/pc/css/topic_laptop/swiper.css new file mode 100644 index 00000000..fb2bf64e --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/swiper.css @@ -0,0 +1,75 @@ +/* 轮播容器 - 核心：基于视口高度自适应 */ +.auto-swiper-container { + width: 100%; + /* 关键：高度 = 视口高度的百分比（可调整，如60vh=屏幕高度60%） */ + /* height: 60vh; */ + /* max-height: 800px; + min-height: 300px; */ + overflow: hidden; + position: relative; + z-index: 1; +} + +/* 轮播项 - 填充容器高度 */ +.auto-swiper-slide { + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; +} + +/* 图片自适应核心：填充屏幕比例高度，保持比例 */ +.auto-swiper-slide img { + width: 100%; + height: 100%; + object-fit: cover; /* 优先填充容器，裁剪超出部分（无拉伸） */ + /* object-fit: contain; 可选：完整显示图片，不裁剪（可能留黑边） */ + display: block; +} +.swiper-container-texts { + position: absolute; + left: 50%; + top:2.3rem; + transform: translateX(-50%); + z-index: 10; +} + +.swiper-container-texts-t { + font-size: 0.9rem; + text-align: center; + width: 100%; + line-height: 1; +} +.swiper-container-texts-p { + padding-top: 0.43rem; + font-size: 0.28rem; + text-align: center; + width: 100%; + display: flex; + align-items: center; + letter-spacing: 1.3px; + +} +.swiper-container-texts-p div { + font-family: "HarmonyOS-Light"; +} +.swiper-container-texts-line { + width: 1px; + height: 0.16rem; + background: #fff; + margin: 0 12px; +} +.swiper-container-texts-img { + width: 100%; + display: flex; + justify-content: center; + padding-top: 0.63rem; + cursor: pointer; +} +.swiper-container-texts-img a { + width: 1.82rem; +} +.swiper-container-texts-img img { + width: 1.82rem; +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/th.css b/public/static/index/pc/css/topic_laptop/th.css new file mode 100644 index 00000000..ff3cecf1 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/th.css @@ -0,0 +1,130 @@ +.tabs-container { + width: 100%; + /* color: #fff; + width: 1440px; + max-width: 1440px; + min-width: 1280px; + margin: 0 auto; */ + margin-bottom: 2.98rem; +} +.tabs-header-box { + width: 100%; + display: flex; + justify-content: center; + margin-top: 1rem; +} +.tabs-header { + display: inline-flex; + /* 改为inline-flex，宽度由子元素决定 */ + position: relative; + border-bottom: 1px solid #cbcfd8; + margin: 0 auto; + width: 2.33rem; + display: flex; +} + +.tab-item { + /* padding: 12px 24px; */ + font-size: clamp(16px, 1vw, 0.22rem); + cursor: pointer; + transition: color 0.2s ease; + white-space: nowrap; + color: #cbcfd8; + flex: 1; + text-align: center; +} + +.tab-item:nth-child(1) { + margin-bottom: 24px; +} + +.tab-item:nth-child(2) { + margin-bottom: 24px; +} + +.tab-indicator { + position: absolute; + bottom: 0; + height: 2px; + background-color: #fff; + transform: translateX(0); + width: 80px; + transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), + width 0.3s cubic-bezier(0.25, 0.1, 0.25, 1); + will-change: transform, width; + backface-visibility: hidden; + perspective: 1000px; +} + +.tab-content { + width: 14.4rem; + max-width: 14.4rem; + /* min-width: 1280px; */ + margin: 0 auto; +} + +/* 新增样式 */ +.content-image { + max-width: 100%; + height: auto; + border-radius: 8px; +} +.content-image img { + max-width: 14.4rem; +} + +.content-video { + max-width: 100%; + height: auto; + border-radius: 8px; +} +.tabs-p { + width: 100%; + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + text-align: center; + margin-top:0.7rem; + display: none; +} +.tabs-p.active { + display: block; +} +.tab-panel { + display: none; +} +.tab-panel-img { + background:#1c1c1e ; + width: 100%; + max-width: 14.4rem; + max-height: 7rem; + overflow: hidden; + display: flex; + justify-content: flex-end; + padding-top: 0.7rem; + border-radius: 0.16rem; +} +.tab-panel-img img { + width: 100%; + + max-width: 13.7rem; + height: 100%; +} +.tab-panel.active { + display: block; +} +.tab-t { + font-size: 0.63rem; + color: #cbcfd8; + width: 100%; + text-align: center; + margin-top: 3rem; + margin-bottom: 0.7rem; + display: none; +} +.tab-t.active { + display: block; +} +/* .tab-ts { + margin-top: 2.97rem; + margin-bottom: 1rem; +} */ \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/wift.css b/public/static/index/pc/css/topic_laptop/wift.css new file mode 100644 index 00000000..6014f870 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/wift.css @@ -0,0 +1,74 @@ + +.wift-bg { + position: relative; + width: 100%; + height: 100%; + aspect-ratio: 2560/1913; + /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/w1.png'); + background-repeat: no-repeat; + background-size: 100% auto; */ + min-width: 1280px; + /* margin-bottom: 0.71rem; */ + position: relative; +} +.wift-test { + position: absolute; + left:50%; + top:3rem; + transform: translateX(-50%); + +} +.wift-bg-t { + font-size: 0.5rem; + color: #cbcfd8; + width: 100%; + text-align: center; +} +.wift-bg-p { + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + width: 100%; + text-align: center; + padding-top: 0.43rem; + line-height: 1.8; + font-family: "HarmonyOS-Light"; +} +.wift-bg-p1 { + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + width: 100%; + text-align: center; + padding-top: 0.43rem; + line-height: 1.8; + font-family: "HarmonyOS-Light"; +} +.wift-bg-img { + width: 100%; + display: flex; + justify-content: center; + + position: absolute; + bottom: 1.46rem; +} +.wift-bg-img img { + width: 14.41rem; + +} +.wift-t { + width: 100%; + color: #fff; + text-align: center; + /* margin-top: 2.95rem; */ + /* padding-top: 2.95rem; */ + font-size: 0.72rem; +} +.wift-t div:nth-child(1) { + font-size: 0.72rem; + line-height: 1; + padding-bottom: 0.33rem; +} +.wift-t div:nth-child(2) { + font-size: 0.63rem; + line-height: 1; +} \ No newline at end of file diff --git a/public/static/index/pc/css/topic_laptop/wift6.css b/public/static/index/pc/css/topic_laptop/wift6.css new file mode 100644 index 00000000..bbb5190d --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/wift6.css @@ -0,0 +1,46 @@ +.wift6 { + position: relative; + width: 100%; + aspect-ratio: 2560/1440; /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/rgb.png'); + background-repeat: no-repeat; + background-size: 100% auto; */ + min-width: 1280px; + margin-top: 3.5rem; +} +.wift6-text { + position: absolute; + top: -0.3rem; + width: 100%; + display: flex; + flex-direction: column; + justify-content: center; +} +.wift6-t { + width: 100%; + font-size: 0.63rem; + color: #fff; + text-align: center; +} +.wift6-p { + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + text-align: center; + padding-top: 0.43rem; + line-height: 1.8; + font-family: "HarmonyOS-Light"; +} +.wift6-img { + width: 100%; + min-width: 1280px; + position: absolute; + bottom: -0.56rem; + display: flex; + justify-content: center; + gap: 0.4rem; +} +.wift6-img img { + max-width:7.15rem; + aspect-ratio: 715/309; + display: block; +} diff --git a/public/static/index/pc/css/topic_laptop/windows.css b/public/static/index/pc/css/topic_laptop/windows.css new file mode 100644 index 00000000..d1f9480f --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/windows.css @@ -0,0 +1,12 @@ +.windows { + max-width: 14.4rem; + /* min-width: 1280px; */ + position: relative; + width: 100%; + aspect-ratio: 1440/1117; /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/windows1.png'); + background-repeat: no-repeat; + background-size: 100% auto; */ + /* min-width: 1280px; */ + margin: 0 auto; +} diff --git a/public/static/index/pc/css/topic_laptop/xh.css b/public/static/index/pc/css/topic_laptop/xh.css new file mode 100644 index 00000000..b19f135d --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/xh.css @@ -0,0 +1,60 @@ +.xh { + position: relative; + width: 100%; + aspect-ratio: 5120/3316; /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/rgb.png'); + background-repeat: no-repeat; + background-size: 100% auto; */ + min-width: 1280px; + margin-top: 3.56rem; +} +.xh-text { + width: 100%; + display: flex; + flex-direction: column; + justify-content: center; + /* padding-top: 0.8rem; */ +} +.xh-t { + width: 100%; + font-size: 0.5rem; + color: #fff; + text-align: center; +} +.xh-t span:nth-child(1) { + font-size: 0.72rem; +} +.xh-t span:nth-child(2) { + font-size: 0.63rem; + margin-left: 0.13rem; +} +.xh-p { + font-size: clamp(16px, 1vw, 0.22rem); + color: #cbcfd8; + text-align: center; + padding-top: 0.43rem; + font-family: "HarmonyOS-Light"; +} +.xh-img { + width: 100%; + min-width: 1280px; + position: absolute; + bottom: 1.8rem; + display: flex; + justify-content: center; + gap: 0.2rem; +} +.xh-img img { + max-width: 7.1rem; + aspect-ratio: 710/308; + display: block; +} +.xh-b-p { + color: #ffffff; + font-size: clamp(16px, 1vw, 0.22rem); + position: absolute; + bottom: 0; + text-align: center; + left: 50%; + transform: translateX(-50%); +} diff --git a/public/static/index/pc/css/topic_laptop/xn.css b/public/static/index/pc/css/topic_laptop/xn.css new file mode 100644 index 00000000..ac0d3713 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/xn.css @@ -0,0 +1,55 @@ +/* 页面容器（模拟官网宽屏布局） */ +.xn-container { + /* min-width: 1280px; */ + max-width: 14.4rem; + width: 100%; + margin: 0 auto; +} + +/* 图片容器样式（核心） */ +.xn-image-section { + overflow: hidden; + border-radius: 16px; + /* 官网图片圆角风格 */ + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); + max-width: 14.4rem; + /* min-width: 1280px; */ + margin: 0 auto; + background: #0d0c10; + border:1px solid #3f3f45; +} + +.zoom-image { + width: 100%; + height: auto; + display: block; + /* 调整transform过渡时间为2s，opacity为1.5s，可按需修改 */ + transition: transform 2s cubic-bezier(0.25, 0.1, 0.25, 1), opacity 1.5s ease; + transform: scale(0.8); + /* 初始缩放比例 */ + opacity: 0.9; + /* 初始透明度（略暗，放大后变亮） */ +} + +/* 滚动触发后的放大状态 */ +.zoom-image.active { + transform: scale(1.1); + /* 放大5%（官网常用比例，不夸张） */ + opacity: 1; +} +.xn-t { + font-size:0.63rem; + color: #fff; + text-align: center; + margin-top: 3rem; + margin-bottom: 1.26rem; +} +.xn-p { + padding-top: 0.6rem; +} +.xn-p p { + font-size: clamp(16px, 1vw, 0.22rem); + color: #CBCFD8; + text-align: center; + line-height: 2.4; +} diff --git a/public/static/index/pc/css/topic_laptop/yq.css b/public/static/index/pc/css/topic_laptop/yq.css new file mode 100644 index 00000000..373fb227 --- /dev/null +++ b/public/static/index/pc/css/topic_laptop/yq.css @@ -0,0 +1,67 @@ +/* 容器高度完全跟随图片真实高度 */ +.fullscreen-img-container { + position: relative; + width: 100%; + min-width: 1280px; + margin-top:1.5rem; + aspect-ratio: 16/9; /* 2560/1440=16/9，核心比例约束 */ + /* background: url('../img/yq1.png'); */ + background-size: cover; + /* 去掉所有强制高度，高度=图片真实高度 */ +} + +/* 图片按真实比例显示，不拉伸/裁剪（可选cover，看需求） */ +.fullscreen-img { + width: 100%; + height: auto; + display: block; + /* 如需填满容器，保留cover；如需显示完整图片，改为contain */ + object-fit: cover; +} + +/* 文字：修复宽幅+居中生效（仅改定位行） */ +.overlay-text { + /* 宽幅限制生效 */ + width: 100%; + min-width: 1280px; + padding-top: 1.5rem; +} + +.overlay-text div { + width: 100%; + font-size: 0.63rem; + color: #fff; + text-align: center; + line-height: 1; + font-size: 500; +} + +.overlay-text p { + font-size: clamp(16px,1vw,0.22rem); + color: #cbcfd8; + text-align: center; + padding-top: 0.43rem; + font-family: "HarmonyOS-Light"; +} +.float-cards { + display: flex; + width: 100%; + justify-content: center; + position: absolute; + bottom: -1.05rem; + gap: 0.2rem; +} +.float-cards img { + /* width: 2.96rem; */ + /* width: 100%; */ + max-width: 2.96rem; + aspect-ratio:296/215 +} +.bottom-desc { + text-align: center; + color: #cbcfd8; + font-size: clamp(16px, 1vw, 0.22rem); + padding-top: 1.9rem; + width: 100%; + min-width: 1280px; +} diff --git a/public/static/index/pc/images/topic_laptop/eljgd.png b/public/static/index/pc/images/topic_laptop/eljgd.png new file mode 100644 index 00000000..666c9663 Binary files /dev/null and b/public/static/index/pc/images/topic_laptop/eljgd.png differ diff --git a/public/static/index/pc/images/topic_laptop/jk.png b/public/static/index/pc/images/topic_laptop/jk.png new file mode 100644 index 00000000..6ff85dc3 Binary files /dev/null and b/public/static/index/pc/images/topic_laptop/jk.png differ diff --git a/public/static/index/pc/images/topic_laptop/l1.png b/public/static/index/pc/images/topic_laptop/l1.png new file mode 100644 index 00000000..be2fe146 Binary files /dev/null and b/public/static/index/pc/images/topic_laptop/l1.png differ diff --git a/public/static/index/pc/images/topic_laptop/ljgd.png b/public/static/index/pc/images/topic_laptop/ljgd.png new file mode 100644 index 00000000..17ad3692 Binary files /dev/null and b/public/static/index/pc/images/topic_laptop/ljgd.png differ diff --git a/public/static/index/pc/images/topic_laptop/r1.png b/public/static/index/pc/images/topic_laptop/r1.png new file mode 100644 index 00000000..f2661ee7 Binary files /dev/null and b/public/static/index/pc/images/topic_laptop/r1.png differ diff --git a/public/static/index/pc/js/large.js b/public/static/index/pc/js/large.js index 1f51a85b..9f269801 100644 --- a/public/static/index/pc/js/large.js +++ b/public/static/index/pc/js/large.js @@ -10,6 +10,7 @@ $(document).ready(function () { // 初始化图片放大功能 initImageEnlarger(); + console.log('触发') }); /** @@ -294,4 +295,4 @@ function initImageEnlarger() { $enlargeImg.hide(); } }); -} \ No newline at end of file +}