-
Notifications
You must be signed in to change notification settings - Fork 9
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
10 changed files
with
467 additions
and
23 deletions.
There are no files selected for viewing
Binary file not shown.
Binary file not shown.
Binary file not shown.
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1 +1 @@ | ||
| <!doctype html><html lang="zh-TW" class="demo-template"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"><title>範例應用 | Vital UI Kit</title><link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet"><link rel="stylesheet" href="./css/vital-ui-kit.css"><link rel="stylesheet" href="./css/styleguide.css"></head><body><nav class="nav-wrapper"><div class="nav-menu"><a href="index.html">首頁</a><a href="getting-started.html"><span>開始</span><span>使用</span></a><a href="kendo-demo.html"><span>Kendo Theme</span></a><a href="template.html"><span>範例</span><span>應用</span></a><a href="https://uwillx.com/" target="_blank"><span>聯絡</span><span>我們</span></a></div><div class="nav-dropdown-wrapper download-wrapper"><div class="nav-dropdown-toggle">下載 UI KIT</div><ul class="nav-dropdown-menu"><li><a href="https://github.com/GSS-FED/Vital-UI-Kit/raw/master/UI_design/UI-Kit-201706.sketch">SKETCH</a></li><li><a href="https://github.com/GSS-FED/Vital-UI-Kit/raw/master/build/vital-ui-kit.zip">RELEASES</a></li></ul></div></nav><div class="demo-template-wrapper"><div class="demo-template-content"><div class="demo-template-header">TEMPLATE</div><div class="demo-template-body"><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">單一框架</div><div class="demo-info-content">當頁面沒有多欄位需求，您可以使用 Vital UI Kit 提供的 class: sg-container 排版元件，搭配 sg-row、sg-col 輕鬆做好基本的排版，讓您專注在樣式的客制化。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a class="demo-btn demo-btn-primary"><i class="icon-eye"></i><span class="demo-btn-txt">Download Sketch</span></a><a href="template-container.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">雙列框架</div><div class="demo-info-content">您可使用 sg-ap-header、sg-ap-main 來完成基本雙列框架，首列可放置 menu，次列放置網頁主要內容。內容可搭配 sg-cell-group、sg-cell-row 方便您使用 table layout 來排版。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a class="demo-btn demo-btn-primary"><i class="icon-eye"></i><span class="demo-btn-txt">Download Sketch</span></a><a href="template-container-row2.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">雙欄框架</div><div class="demo-info-content">Vital UI Kit 提供 sg-ap-nav 與 sg-ap-main 來完成雙欄位的排版，方便您可以把導覽列放置於頁面左方。當畫面縮小，左方導覽列的寬度會縮小，手機版則導覽列將換到頁面下方，節省畫面閱覽的空間。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a class="demo-btn demo-btn-primary"><i class="icon-eye"></i><span class="demo-btn-txt">Download Sketch</span></a><a href="template-layout-col2.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">三欄式框架</div><div class="demo-info-content">組合了黃金排版三元件：sg-ap-header、 sg-ap-nav、sg-ap-main，您可更自由的安排網頁個區塊要呈現的資訊。header 此時可放置頁面常用的功能與產品 Logo，讓您的網頁更具有識別力！</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a href="template-layout-frame3.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">內嵌框架</div><div class="demo-info-content">三欄式框架具備內嵌性，若您希望在框架中遞迴置入框架，沒問題！Vital UI Kit 提供您最方便、最彈性的選擇，讓您愛不釋手。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a href="template-layout-embeded.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div></div></div></div><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script src="./js/vital-ui-kit.js"></script><script src="./js/template.js"></script></body></html> | ||
| <!doctype html><html lang="zh-TW" class="demo-template"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"><title>範例應用 | Vital UI Kit</title><link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet"><link rel="stylesheet" href="./css/vital-ui-kit.css"><link rel="stylesheet" href="./css/styleguide.css"></head><body><nav class="nav-wrapper"><div class="nav-menu"><a href="index.html">首頁</a><a href="getting-started.html"><span>開始</span><span>使用</span></a><a href="kendo-demo.html"><span>Kendo Theme</span></a><a href="template.html"><span>範例</span><span>應用</span></a><a href="https://uwillx.com/" target="_blank"><span>聯絡</span><span>我們</span></a></div><div class="nav-dropdown-wrapper download-wrapper"><div class="nav-dropdown-toggle">下載 UI KIT</div><ul class="nav-dropdown-menu"><li><a href="https://github.com/GSS-FED/Vital-UI-Kit/raw/master/UI_design/UI-Kit-201706.sketch">SKETCH</a></li><li><a href="https://github.com/GSS-FED/Vital-UI-Kit/raw/master/build/vital-ui-kit.zip">RELEASES</a></li></ul></div></nav><div class="demo-template-wrapper"><div class="demo-template-content"><div class="demo-template-header">TEMPLATE</div><div class="demo-template-body"><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">單一框架</div><div class="demo-info-content">當頁面沒有多欄位需求，您可以使用 Vital UI Kit 提供的 class: sg-container 排版元件，搭配 sg-row、sg-col 輕鬆做好基本的排版，讓您專注在樣式的客制化。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a class="demo-btn demo-btn-primary" href="https://github.com/GSS-FED/Vital-UI-Kit/raw/master/UI_design/template-container.sketch"><i class="icon-eye"></i><span class="demo-btn-txt">Download Sketch</span></a><a href="template-container.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">雙列框架</div><div class="demo-info-content">您可使用 sg-ap-header、sg-ap-main 來完成基本雙列框架，首列可放置 menu，次列放置網頁主要內容。內容可搭配 sg-cell-group、sg-cell-row 方便您使用 table layout 來排版。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a class="demo-btn demo-btn-primary" href="https://github.com/GSS-FED/Vital-UI-Kit/raw/master/UI_design/template-container-row2.sketch"><i class="icon-eye"></i><span class="demo-btn-txt">Download Sketch</span></a><a href="template-container-row2.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">雙欄框架</div><div class="demo-info-content">Vital UI Kit 提供 sg-ap-nav 與 sg-ap-main 來完成雙欄位的排版，方便您可以把導覽列放置於頁面左方。當畫面縮小，左方導覽列的寬度會縮小，手機版則導覽列將換到頁面下方，節省畫面閱覽的空間。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a class="demo-btn demo-btn-primary" href="https://github.com/GSS-FED/Vital-UI-Kit/raw/master/UI_design/template-container-col2.sketch"><i class="icon-eye"></i><span class="demo-btn-txt">Download Sketch</span></a><a href="template-layout-col2.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">三欄式框架</div><div class="demo-info-content">組合了黃金排版三元件：sg-ap-header、 sg-ap-nav、sg-ap-main，您可更自由的安排網頁個區塊要呈現的資訊。header 此時可放置頁面常用的功能與產品 Logo，讓您的網頁更具有識別力！</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a href="template-layout-frame3.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div><div class="demo-template-sec"><div class="demo-template-info"><div class="demo-info-title">內嵌框架</div><div class="demo-info-content">三欄式框架具備內嵌性，若您希望在框架中遞迴置入框架，沒問題！Vital UI Kit 提供您最方便、最彈性的選擇，讓您愛不釋手。</div></div><div class="demo-template-preview"><div class="demo-preview-img"></div></div><div class="demo-template-actions"><a href="template-layout-embeded.html" target="_blank" class="demo-btn demo-btn-default"><i class="icon-eye"></i><span class="demo-btn-txt">PREVIEW</span></a></div></div></div></div></div><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script src="./js/vital-ui-kit.js"></script><script src="./js/template.js"></script></body></html> |
Binary file not shown.
Oops, something went wrong.