Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
知鸟1号
tabler
提交
6262c262
T
tabler
项目概览
知鸟1号
/
tabler
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
T
tabler
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
6262c262
编写于
11月 12, 2020
作者:
C
codecalm
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
ribbon fixes
上级
31cfbd25
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
10 addition
and
7 deletion
+10
-7
src/pages/_docs/ribbons.md
src/pages/_docs/ribbons.md
+5
-5
src/pages/_includes/cards/ribbon.html
src/pages/_includes/cards/ribbon.html
+1
-1
src/pages/_includes/ui/ribbon.html
src/pages/_includes/ui/ribbon.html
+3
-1
src/scss/demo/_examples.scss
src/scss/demo/_examples.scss
+1
-0
未找到文件。
src/pages/_docs/ribbons.md
浏览文件 @
6262c262
...
...
@@ -12,7 +12,7 @@ Use the `ribbon` class to add the default ribbon to any section of your interfac
{% capture code %}
{% include cards/ribbon.html %}
{% endcapture %}
{% include example.html code=code %}
{% include example.html code=code
columns=1
%}
## Ribbon position
...
...
@@ -29,7 +29,7 @@ Using multiple classes at once will give you more position options. For example,
{% capture code %}
{% include cards/ribbon.html top=true left=true %}
{% endcapture %}
{% include example.html code=code %}
{% include example.html code=code
columns=1
%}
## Ribbon color
...
...
@@ -39,7 +39,7 @@ Customize the ribbon's background color. You can click [here]({% docs_url colors
{% capture code %}
{% include cards/ribbon.html color="red" %}
{% endcapture %}
{% include example.html code=code %}
{% include example.html code=code
columns=1
%}
## Ribbon text
...
...
@@ -49,7 +49,7 @@ Add your own text to a ribbon to display any additional information and make it
{% capture code %}
{% include cards/ribbon.html color="green" text="-50%" %}
{% endcapture %}
{% include example.html code=code %}
{% include example.html code=code
columns=1
%}
## Ribbon style
...
...
@@ -59,4 +59,4 @@ Change the style of a ribbon to make it go well with your interface design.
{% capture code %}
{% include cards/ribbon.html bookmark=true color="orange" text="-50%" %}
{% endcapture %}
{% include example.html code=code %}
{% include example.html code=code
columns=1
%}
src/pages/_includes/cards/ribbon.html
浏览文件 @
6262c262
...
...
@@ -2,7 +2,7 @@
{% assign product = site.data.products[product-id] %}
<div
class=
"card"
>
<div
class=
"card-body
{% unless include.lorem %} h-8{% endunless %}"
>
<div
class=
"card-body
"
{%
unless
include.lorem
%}
style=
"height: 5rem"
{%
endunless
%}
>
{% if include.lorem %}
<h3
class=
"card-title"
>
Card with ribbon
</h3>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda consectetur consequuntur culpa cum dolorum eveniet.
</p>
...
...
src/pages/_includes/ui/ribbon.html
浏览文件 @
6262c262
<div
class=
"ribbon{% if include.top %} ribbon-top{% endif %}{% if include.left %} ribbon-left{% endif %}{% if include.bottom %} ribbon-bottom{% endif %}{% if include.bookmark %} ribbon-bookmark{% endif %}{% if include.color %} bg-{{ include.color }}{% endif %}"
>
{% if include.text %}{{ include.text }}{% else %}{% include ui/icon.html icon="star" use-svg=true %}{% endif %}
</div>
\ No newline at end of file
<div
class=
"ribbon{% if include.top %} ribbon-top{% endif %}{% if include.left %} ribbon-left{% endif %}{% if include.bottom %} ribbon-bottom{% endif %}{% if include.bookmark %} ribbon-bookmark{% endif %}{% if include.color %} bg-{{ include.color }}{% endif %}"
>
{% if include.text %}{{ include.text }}{% else %}{% include ui/icon.html icon="star" use-svg=true %}{% endif %}
</div>
\ No newline at end of file
src/scss/demo/_examples.scss
浏览文件 @
6262c262
...
...
@@ -38,6 +38,7 @@
pre
{
margin
:
0
;
border
:
0
;
border-radius
:
0
0
3px
3px
;
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录