Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
Dashboards
Tabler
提交
b99d8173
T
Tabler
项目概览
Dashboards
/
Tabler
10 个月 前同步成功
通知
0
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
T
Tabler
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
未验证
提交
b99d8173
编写于
2月 23, 2020
作者:
P
Paweł Kuna
提交者:
GitHub
2月 23, 2020
浏览文件
操作
浏览文件
下载
差异文件
Merge pull request #434 from tabler/dev-form-layout
form-layouts added
上级
27a4babb
f81a1c6c
变更
6
显示空白变更内容
内联
并排
Showing
6 changed file
with
98 addition
and
35 deletion
+98
-35
pages/_includes/cards/form/layout.html
pages/_includes/cards/form/layout.html
+59
-0
pages/_includes/parts/form/select.html
pages/_includes/parts/form/select.html
+6
-6
pages/form-elements.html
pages/form-elements.html
+8
-0
pages/tmp3.html
pages/tmp3.html
+7
-28
scss/ui/_buttons.scss
scss/ui/_buttons.scss
+4
-0
scss/ui/_forms.scss
scss/ui/_forms.scss
+14
-1
未找到文件。
pages/_includes/cards/form/layout.html
0 → 100644
浏览文件 @
b99d8173
{% assign horizontal = include.horizontal | default: false %}
<div
class=
"card"
>
<div
class=
"card-header"
>
<h3
class=
"card-title"
>
{{ include.title | default: 'Basic form' }}
</h3>
</div>
<div
class=
"card-body"
>
<form>
<div
class=
"form-group mb-3 {% if horizontal %}row{% endif %}"
>
<label
class=
"form-label{% if horizontal %} col-3 col-form-label{% endif %}"
>
Email address
</label>
<div
{%
if
horizontal
%}
class=
"col"
{%
endif
%}
>
<input
type=
"email"
class=
"form-control"
aria-describedby=
"emailHelp"
placeholder=
"Enter email"
>
<small
class=
"form-hint"
>
We'll never share your email with anyone else.
</small>
</div>
</div>
<div
class=
"form-group mb-3 {% if horizontal %}row{% endif %}"
>
<label
class=
"form-label{% if horizontal %} col-3 col-form-label{% endif %}"
>
Password
</label>
<div
{%
if
horizontal
%}
class=
"col"
{%
endif
%}
>
<input
type=
"password"
class=
"form-control"
placeholder=
"Password"
>
<small
class=
"form-hint"
>
Your password must be 8-20 characters long, contain letters and numbers, and must not contain
spaces, special characters, or emoji.
</small>
</div>
</div>
<div
class=
"form-group mb-3 {% if horizontal %}row{% endif %}"
>
<label
class=
"form-label{% if horizontal %} col-3 col-form-label{% endif %}"
>
Select
</label>
<div
{%
if
horizontal
%}
class=
"col"
{%
endif
%}
>
<select
class=
"form-select"
>
<option>
Option 1
</option>
</select>
</div>
</div>
<div
class=
"form-group {% if horizontal %}row{% else %}mb-3{% endif %}"
>
<label
class=
"form-label{% if horizontal %} col-3 col-form-label pt-0{% endif %}"
>
Checkboxes
</label>
<div
{%
if
horizontal
%}
class=
"col"
{%
endif
%}
>
<label
class=
"form-check"
>
<input
class=
"form-check-input"
type=
"checkbox"
checked=
""
>
<span
class=
"form-check-label"
>
Option 1
</span>
</label>
<label
class=
"form-check"
>
<input
class=
"form-check-input"
type=
"checkbox"
>
<span
class=
"form-check-label"
>
Option 2
</span>
</label>
<label
class=
"form-check"
>
<input
class=
"form-check-input"
type=
"checkbox"
disabled=
""
>
<span
class=
"form-check-label"
>
Option 3
</span>
</label>
</div>
</div>
<div
class=
"form-footer"
>
<button
type=
"submit"
class=
"btn btn-primary"
>
Submit
</button>
</div>
</form>
</div>
</div>
\ No newline at end of file
pages/_includes/parts/form/select.html
浏览文件 @
b99d8173
{% assign options = include.options | default: "One,Two,Three" | split: "," %}
<div
class=
"mb-3"
>
<div
class=
"form-label"
>
{{ include.label | default: 'Select' }}
</div>
<select
class=
"form-select"
{%
if
include.multiple
%}
multiple
{%
endif
%}
>
<select
class=
"form-select"
{%
if
include.multiple
%}
multiple
{%
endif
%}
>
{% for option in options %}
<option
value=
"{{ forloop.index }}"
>
{{ option }}
</option>
{% endfor %}
...
...
pages/form-elements.html
浏览文件 @
b99d8173
...
...
@@ -40,4 +40,12 @@ menu: forms
</div>
</form>
</div>
<div
class=
"col-md-6"
>
{% include cards/form/layout.html %}
</div>
<div
class=
"col-md-6"
>
{% include cards/form/layout.html horizontal=true title="Horizontal form" %}
</div>
</div>
pages/tmp3.html
浏览文件 @
b99d8173
---
tmp: true
---
<div
class=
"dropdown d-inline-block"
>
<button
class=
"btn btn-secondary dropdown-toggle"
type=
"button"
id=
"dropdownMenuButtonAlias"
data-toggle=
"dropdown"
aria-haspopup=
"true"
aria-expanded=
"false"
>
Dropdown button
</button>
<ul
class=
"dropdown-menu"
>
<li>
<a
class=
"dropdown-item"
href=
"#"
>
Action
</a>
</li>
<li>
<a
class=
"dropdown-item"
href=
"#"
>
Another action
</a>
</li>
<li
class=
"dropright"
>
<a
class=
"dropdown-item dropdown-toggle"
href=
"#"
id=
"dropdownSubmenuButton"
data-toggle=
"dropdown"
>
Something else here
</a>
<div
class=
"dropdown-menu"
>
<a
class=
"dropdown-item"
href=
"#"
>
Action
</a>
<a
class=
"dropdown-item"
href=
"#"
>
Another action
</a>
<a
class=
"dropdown-item"
href=
"#"
>
Something else action
</a>
<div
class=
"row"
>
<div
class=
"col-md-6"
>
{% include cards/form/layout.html %}
</div>
</li>
</ul>
</div>
<div
class=
"dropdown d-inline-block"
>
<button
class=
"btn btn-secondary dropdown-toggle"
type=
"button"
data-toggle=
"dropdown"
>
Dropdown with card
</button>
{% include cards/card.html class="dropdown-menu" title="Card title" footer=true img-top=true %}
<div
class=
"col-md-6"
>
{% include cards/form/layout.html horizontal=true title="Horizontal form" %}
</div>
</div>
\ No newline at end of file
scss/ui/_buttons.scss
浏览文件 @
b99d8173
...
...
@@ -69,6 +69,10 @@
padding-right
:
1
.5em
;
padding-left
:
1
.5em
;
border-radius
:
10rem
;
&
[
class
*=
"btn-icon"
]
{
padding
:
0
.375rem
15px
;
}
}
.btn-icon
{
...
...
scss/ui/_forms.scss
浏览文件 @
b99d8173
...
...
@@ -26,14 +26,27 @@ Form label
Form hint
*/
.form-hint
{
display
:
block
;
font-size
:
$small-font-size
;
color
:
$text-muted
;
margin
:
0
0
.75rem
;
line-height
:
$line-height-sm
;
&
:last-child
{
margin-bottom
:
0
;
}
&
+
.form-control
{
margin-top
:
.25rem
;
}
.form-label
+
&
{
margin-top
:
-.5rem
;
}
.form-control
+
&
,
.form-select
+
&
{
margin-top
:
.25rem
;
}
}
/**
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录