diff --git a/app/index/lang/en-us/mobile.php b/app/index/lang/en-us/mobile.php index 6bc8a5f1..f2ef6218 100644 --- a/app/index/lang/en-us/mobile.php +++ b/app/index/lang/en-us/mobile.php @@ -178,4 +178,14 @@ return [ '网络存储解决方案' => 'Network Storage Solutions', '配套软件' => 'Software', ], + + // nas主题 - 帮助页 + 'topicnas/help' => [ + '帮助中心' => 'Quick Start Guide', + '请输入搜索关键字,如安装赛博云空间,影视库' => 'What are you looking for?', + '使用教程' => 'User\' s Guide', + '查看更多' => 'Click to view more', + '联系我们' => 'Contact US', + '目录' => 'Content' + ], ]; \ No newline at end of file diff --git a/app/index/view/mobile/topic_nas/help.html b/app/index/view/mobile/topic_nas/help.html new file mode 100644 index 00000000..034d50e1 --- /dev/null +++ b/app/index/view/mobile/topic_nas/help.html @@ -0,0 +1,132 @@ +{extend name="public/base" /} +{block name="style"} + +{/block} +{block name="header"} + +{/block} +{block name="main"} +
+
+
+ + + + +
+ + + + {notempty name="article_categorys"} +

{:lang_i18n('使用教程')}

+ {volist name="article_categorys" id="vo" key="idx"} +
+
+ {$vo.name} +
+
+ {volist name="vo.article" id="va"} + +
+ {$va.title} + + + {/volist} + {if condition="count($vo.article) >= 3"} + +
{:lang_i18n('查看更多')}
+ + {/if} +
+
+ {/volist} + {/notempty} + + {notempty name="contacts"} +

{:lang_i18n('联系我们')}

+
+
+ {volist name="contacts" id="co" key="idx" offset="0" length="4"} + + + $co.title_txt_color])}>{$co.title} + {notempty name="co.desc"} + $co.desc_txt_color])}>{$co.desc|raw} + {/notempty} + + {/volist} +
+
+ {volist name="contacts" id="co" key="idx" offset="4"} + + + $co.title_txt_color])}>{$co.title}
 + + {/volist} +
+
+ {/notempty} + +
+
+
+ + +
+ 取消 +
+
+ + +
+
+
+{/block} +{block name="script"} + +{/block} \ No newline at end of file diff --git a/public/static/index/mobile/css/topic_nas_help.css b/public/static/index/mobile/css/topic_nas_help.css new file mode 100644 index 00000000..523e1d1f --- /dev/null +++ b/public/static/index/mobile/css/topic_nas_help.css @@ -0,0 +1,265 @@ +.icon-menu-svg, +.icon-search-svg, +.icon-lag-svg { + color: #000 !important; +} + +.narshelpCenterPc-app { + width: 100%; + display: flex; + flex-direction: column; +} + +.narshelpCenterPc-app .nhlpapp-search { + position: fixed; + z-index: 2; + top: 0; + height: 100vh; + display: flex; + width: 100%; + background: #fff; + flex-direction: column; + display: none; +} + +.narshelpCenterPc-app .nhlpapp-search .nhlpappshtop { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} + +.narshelpCenterPc-app .nhlpapp-search .nhlpappshtop .closetx { + font-size: 14px; + margin-right: 8%; +} + +.narshelpCenterPc-app .nhlpapp-search .nhlpapp-shdiv { + margin: 1rem 20px; + height: 2.5rem; + display: flex; + flex-direction: row; + align-items: center; + border: 1px solid #cdcedb; + border-radius: 1.5625rem; + flex: 1; +} + +.narshelpCenterPc-app .nhlpapp-search .nhlpapp-shdiv input { + font-size: 0.8125rem; + padding: 0 20px; + flex: 1; + border: none; + margin-left: 2px; + outline: none; +} + +.narshelpCenterPc-app .nhlpapp-search .nhlpapp-shdiv input::placeholder { + color: #8f9099; + font-size: 14px; +} + +.narshelpCenterPc-app .nhlpapp-search .nhlpapp-shdiv .searchimg { + width: 1.25rem; + height: 1.25rem; + margin-left: 1%; + margin-right: 5%; +} + +.narshelpCenterPc-app .nhlpapp-search .dropdown { + height: 90vh; + overflow-y: auto; + margin: 1.25rem; +} + +.narshelpCenterPc-app .nhlpapp-search .dropdown li { + margin-bottom: 0.75rem; + font-size: 0.9rem; + font-weight: 400; + width: 100%; + white-space: nowrap; + /* 禁止文本换行 */ + overflow: hidden; + /* 隐藏超出容器的内容 */ + text-overflow: ellipsis; + /* 超出部分用省略号表示 */ +} + +.narshelpCenterPc-app .nhlpapp-search .dropdown .search-item { + color: #202734; +} + +.narshelpCenterPc-app .nhlpapp-search .nhlpappline { + width: 100%; + height: 1px; + background: #cdcedb; +} + +.narshelpCenterPc-app .headtop { + width: 100%; + left: 0; + right: 0; + margin: 0 auto; + display: flex; + position: fixed; + top: 0; + display: flex; + padding: 1.25rem 0; + align-items: center; + flex-direction: row; + justify-content: space-between; + background: #fff; +} + +.narshelpCenterPc-app .headtop .logoicoimg { + width: auto; + margin-left: 1.875rem; +} + +.narshelpCenterPc-app .headtop .ssicoimg { + width: 1.875rem; + height: 1.875rem; + margin-right: 1.875rem; +} + +.narshelpCenterPc-app .nhlpbner { + width: 100%; + margin-top: 4.75rem; +} + +.narshelpCenterPc-app .nhlpapp-title { + margin: 0 auto; + text-align: center; + font-size: 1.5rem; + margin: 2rem 0; +} + +.narshelpCenterPc-app .nhlpappit { + margin: 0 auto; + padding: 1.875rem; + background: #fafafa; + border-radius: 1rem; + color: #202734; + font-size: 1rem; + margin-bottom: 1.25rem; + width: 74%; +} + +.narshelpCenterPc-app .nhlpappit .nhlptl { + display: flex; + flex-direction: row; + align-items: center; + font-size: 1.5rem; + font-weight: bold; + padding-bottom: 1.25rem; +} + +.narshelpCenterPc-app .nhlpappit .nhlptl .bhlpicoimg { + width: 36px; + height: 36px; + margin-right: 10px; +} + +.narshelpCenterPc-app .nhlpappit .nhlp-tx-list { + display: flex; + flex-direction: column; +} + +.narshelpCenterPc-app .nhlpappit .nhlp-tx-list .txrow { + display: flex; + flex-direction: row; + align-items: center; + margin-bottom: 1rem; + cursor: pointer; +} + +.narshelpCenterPc-app .nhlpappit .nhlp-tx-list .txrow .nhlp-point { + width: 0.3125rem; + height: 0.3125rem; + background: #202734; + border-radius: 0.1875rem; + margin: 0 0.625rem; + margin-left: 0.25rem; +} + +.narshelpCenterPc-app .nhlpappit .nhlp-tx-list .txrow .nhlpsp { + flex: 1; + color: #1f2635; + font-size: 1rem; +} + +.narshelpCenterPc-app .nhlpappit .nhlp-tx-list .ckgdbt { + background: #fff; + width: fit-content; + color: #bfbfc4; + font-size: 0.9375rem; + border: 0.0625rem solid #bfbfc4; + padding: 0.4375rem 1.125rem; + margin-top: 1rem; + cursor: pointer; + border-radius: 1.5rem; + display: flex; + flex-direction: row; + align-items: center; +} + +.narshelpCenterPc-app .nhlpapp-row { + margin-bottom: 80px; +} + +.narshelpCenterPc-app .nhlpapp-row > div { + display: flex; + flex-direction: row; + justify-content: space-between; + width: 90%; + margin: 0 auto; + flex-wrap: wrap; +} + +.narshelpCenterPc-app .nhlpapp-row .nhlplxwmit { + width: 48.3%; + padding: 1.5rem 0; + background: #f9f9f9; + margin-bottom: 0.75rem; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + border-radius: 1rem; + cursor: pointer; + margin-right: 0.75rem; +} + +.narshelpCenterPc-app .nhlpapp-row .sec-1 .nhlplxwmit:nth-child(even), +.narshelpCenterPc-app .nhlpapp-row .sec-2 .nhlplxwmit:last-child { + margin-right: 0; +} + +.narshelpCenterPc-app .nhlpapp-row .nhlplxwmit .lximg { + width: 2.5rem; + height: 2.5rem; + margin-bottom: 0.75rem; +} + +.narshelpCenterPc-app .nhlpapp-row .nhlplxwmit .lxewmimg { + width: 4rem; + width: 4rem; + margin-bottom: 1.25rem; + display: none; +} + +.narshelpCenterPc-app .nhlpapp-row .nhlplxwmit .t1 { + text-align: center; + font-size: 0.875rem; + padding-bottom: 0.375rem; + color: #1f2635; +} + +.narshelpCenterPc-app .nhlpapp-row .nhlplxwmit .t2 { + font-size: 0.75rem; + color: #1f2635; +} + +.narshelpCenterPc-app .nhlpapp-row .nhlplxwmit-w1 { + width: 31%; +} \ No newline at end of file diff --git a/public/static/index/mobile/images/nars-jt.png b/public/static/index/mobile/images/nars-jt.png new file mode 100644 index 00000000..3f780f21 Binary files /dev/null and b/public/static/index/mobile/images/nars-jt.png differ diff --git a/public/static/index/mobile/images/nhlpapp-banner.webp b/public/static/index/mobile/images/nhlpapp-banner.webp new file mode 100644 index 00000000..c4fc2b35 Binary files /dev/null and b/public/static/index/mobile/images/nhlpapp-banner.webp differ