diff options
Diffstat (limited to 'app/views/help/ui.html.haml')
| -rw-r--r-- | app/views/help/ui.html.haml | 188 |
1 files changed, 91 insertions, 97 deletions
diff --git a/app/views/help/ui.html.haml b/app/views/help/ui.html.haml index c9244770bd0..9b39376d2f6 100644 --- a/app/views/help/ui.html.haml +++ b/app/views/help/ui.html.haml @@ -1,37 +1,34 @@ -- page_title "UI Development Kit", "Help" -- lorem = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed fermentum nisi sapien, non consequat lectus aliquam ultrices. Suspendisse sodales est euismod nunc condimentum, a consectetur diam ornare." +- page_title "UI 开发包", "帮助" +- lorem = "《大教堂与市集》（The Cathedral and the Bazaar）是埃里克·斯蒂芬·雷蒙 Eric Steven Raymond 所撰写的软件工程方法论。以 Linux 的核心开发过程以及作者自己主持开发的开放源代码软件──Fetchmail 为讨论案例。文章在 1997 年 5 月 27 日发表，并在 1999 年出版成书。" .gitlab-ui-dev-kit - %h1 GitLab UI development kit + %h1 GitLab UI 开发包 %p.light - Use page inspector in your browser to check element classes and structure - of examples below. + 在浏览器中使用页面检查器查看下面例子中的元素样式和结构。 %hr %ul %li - = link_to 'Blocks', '#blocks' + = link_to '区块', '#blocks' %li - = link_to 'Lists', '#lists' + = link_to '列表', '#lists' %li - = link_to 'Tables', '#tables' + = link_to '表格', '#tables' %li - = link_to 'Nav', '#nav' + = link_to '导航', '#nav' %li - = link_to 'Buttons', '#buttons' + = link_to '按钮', '#buttons' %li - = link_to 'Dropdowns', '#dropdowns' + = link_to '面板', '#panels' %li - = link_to 'Panels', '#panels' + = link_to '警告', '#alerts' %li - = link_to 'Alerts', '#alerts' + = link_to '表单', '#forms' %li - = link_to 'Forms', '#forms' - %li - = link_to 'Files', '#file' + = link_to '文件', '#file' %li = link_to 'Markdown', '#markdown' - %h2#blocks Blocks + %h2#blocks 区块 .lead Content block separated with botton border @@ -39,24 +36,24 @@ .example .content-block - %h4 Normal block inside content + %h4 包含内容的普通区块 = lorem .content-block - %h4 Second block + %h4 第二个区块 = lorem .lead - Gray content block with side padding using + 灰色内容块与侧垫使用 %code .gray-content-block .example .gray-content-block - %h4 Normal block inside content + %h4 正常块里面的内容 = lorem .gray-content-block.second-block - %h4 Second block + %h4 第二个区块 = lorem @@ -80,20 +77,20 @@ = link_to '#', class: 'btn btn-gray' do = icon('rss') - %h2#lists Lists + %h2#lists 列表 .lead - Simple list using + 简单的列表使用 %code .content-list .example %ul.content-list %li - One item + 一个项目 %li - One item + 一个项目 %li - One item + 一个项目 .lead List with avatar, title and description using @@ -139,16 +136,16 @@ %li One item - %h2#tables Tables + %h2#tables 表格 .example %table.table %thead %tr %th # - %th First Name - %th Last Name - %th Username + %th 名字 + %th 姓氏 + %th 用户名 %tbody %tr %td 1 @@ -166,53 +163,53 @@ %td the Bird %td @twitter - %h2#navs Navigation + %h2#navs 导航条 - .lead - Holder for top page navigation. Includes navigation, search field, sorting and button + %h4 %code .top-area + %p 页面顶部导航。包括导航、搜索区域、排序和按钮 .example .top-area %ul.nav-links %li.active - %a Open + %a 打开的 %li - %a Closed + %a 关闭的 .nav-controls = text_field_tag 'sample', nil, class: 'form-control' .dropdown - %button.dropdown-menu-toggle{type: 'button', 'data-toggle' => 'dropdown'} - %span Sort by name - = icon('chevron-down') + %button.dropdown-toggle.btn{type: 'button', 'data-toggle' => 'dropdown'} + %span 按名称排序 + %b.caret %ul.dropdown-menu %li - %a Sort by date + %a 按日期排序 - = link_to 'New issue', '#', class: 'btn btn-new' + = link_to '新问题', '#', class: 'btn btn-new' .lead - Only nav links without button and search + 不含按钮和搜索的导航 %code .nav-links .example %ul.nav-links %li.active - %a Open + %a 打开的 %li - %a Closed + %a 关闭的 %h2#buttons Buttons .example - %button.btn.btn-default{:type => "button"} Default - %button.btn.btn-gray{:type => "button"} Gray - %button.btn.btn-primary{:type => "button"} Primary - %button.btn.btn-success{:type => "button"} Success - %button.btn.btn-info{:type => "button"} Info - %button.btn.btn-warning{:type => "button"} Warning - %button.btn.btn-danger{:type => "button"} Danger - %button.btn.btn-link{:type => "button"} Link + %button.btn.btn-default{:type => "button"} 默认 + %button.btn.btn-gray{:type => "button"} 灰色 + %button.btn.btn-primary{:type => "button"} 主要 + %button.btn.btn-success{:type => "button"} 成功 + %button.btn.btn-info{:type => "button"} 信息 + %button.btn.btn-warning{:type => "button"} 警告 + %button.btn.btn-danger{:type => "button"} 危险 + %button.btn.btn-link{:type => "button"} 链接 %h2#dropdowns Dropdowns @@ -435,33 +432,33 @@ %div = dropdown_tag("Projects", options: { title: "Go to project", filter: true, placeholder: "Filter projects" }) - %h2#panels Panels + %h2#panels 面板 .row .col-md-6 .panel.panel-success - .panel-heading Success + .panel-heading 成功 .panel-body = lorem .panel.panel-primary - .panel-heading Primary + .panel-heading 主要 .panel-body = lorem .panel.panel-info - .panel-heading Info + .panel-heading 信息 .panel-body = lorem .col-md-6 .panel.panel-warning - .panel-heading Warning + .panel-heading 警告 .panel-body = lorem .panel.panel-danger - .panel-heading Danger + .panel-heading 危险 .panel-body = lorem - %h2#alert Alerts + %h2#alert 警告 .row .col-md-6 @@ -477,51 +474,48 @@ .alert.alert-danger = lorem - %h2#forms Forms + %h2#forms 表单 - .lead - Horizontal form when label rendered inline with input + %h4 %code form.horizontal-form - .example - %form.form-horizontal - .form-group - %label.col-sm-2.control-label{:for => "inputEmail3"} Email - .col-sm-10 - %input#inputEmail3.form-control{:placeholder => "Email", :type => "email"}/ - .form-group - %label.col-sm-2.control-label{:for => "inputPassword3"} Password - .col-sm-10 - %input#inputPassword3.form-control{:placeholder => "Password", :type => "password"}/ - .form-group - .col-sm-offset-2.col-sm-10 - .checkbox - %label - %input{:type => "checkbox"}/ - Remember me - .form-group - .col-sm-offset-2.col-sm-10 - %button.btn.btn-default{:type => "submit"} Sign in + %form.form-horizontal + .form-group + %label.col-sm-2.control-label{:for => "inputEmail3"} 电子邮箱 + .col-sm-10 + %input#inputEmail3.form-control{:placeholder => "电子邮箱", :type => "email"}/ + .form-group + %label.col-sm-2.control-label{:for => "inputPassword3"} 密码 + .col-sm-10 + %input#inputPassword3.form-control{:placeholder => "密码", :type => "password"}/ + .form-group + .col-sm-offset-2.col-sm-10 + .checkbox + %label + %input{:type => "checkbox"}/ + 记住我 + .form-group + .col-sm-offset-2.col-sm-10 + %button.btn.btn-default{:type => "submit"} 登录 .lead - Form when label rendered above input + 当标签上面呈现的输入形式 %code form - .example - %form - .form-group - %label{:for => "exampleInputEmail1"} Email address - %input#exampleInputEmail1.form-control{:placeholder => "Enter email", :type => "email"}/ - .form-group - %label{:for => "exampleInputPassword1"} Password - %input#exampleInputPassword1.form-control{:placeholder => "Password", :type => "password"}/ - .checkbox - %label - %input{:type => "checkbox"}/ - Remember me - %button.btn.btn-default{:type => "submit"} Sign in - - %h2#file File + %form + .form-group + %label{:for => "exampleInputEmail1"} 电子邮箱地址 + %input#exampleInputEmail1.form-control{:placeholder => "输入电子邮箱", :type => "email"}/ + .form-group + %label{:for => "exampleInputPassword1"} 密码 + %input#exampleInputPassword1.form-control{:placeholder => "密码", :type => "password"}/ + .checkbox + %label + %input{:type => "checkbox"}/ + 记住我 + %button.btn.btn-default{:type => "submit"} 登录 + + %h2#file 文件 %h4 %code .file-holder |