Permalink
Browse files

update can i use usage

  • Loading branch information...
nguyenvanduocit committed Jan 4, 2019
1 parent a6de6b7 commit 97e57b058a6975b8326aa944182ddd4eae47bbab
@@ -112,7 +112,10 @@ shortcodes/caniuse.html:
```
{{ .Page.Scratch.Set "include_caniuse" true }}
{{ $periods := .Get "periods" | default "future_1,current,past_1,past_2" }}
<div class="ciu_embed" data-feature="{{ .Get "feature" }}" data-periods="{{ $periods }}"></div>
{{ $features := default (.Get "features") (.Get 0) }}
<div class="ciu_embed" data-feature="{{ $features }}" data-periods="{{ $periods }}">
<a href="http://caniuse.com/#feat={{ $features }}">Can I Use {{ $features }}?</a>
</div>
```
Chúng ta lưu giá trị `include_caniuse` vào Scratch, và check giá trị này ở footer để chỉ load script khi cần thiết:
@@ -128,10 +131,10 @@ footer.html
### cách dùng
```markdown
{{</* caniuse feature="proxy" */>}}
{{</* caniuse features="proxy" */>}}
```
{{< caniuse feature="proxy" >}}
{{< caniuse features="proxy" >}}
## image-zoom
@@ -88,4 +88,4 @@ Như đã nói, Reflect có các phương thức tương ứng với các trap,
Bài viết ngắn gọn này nhằm sử dụng làm tham khảo cho các bài viết khác, cũng như cung cấp thông tin ngắn gọn về reflect và cách dùng nó với proxy.
{{% caniuse feature="proxy" %}}
{{% caniuse features="proxy" %}}
@@ -168,4 +168,4 @@ Ta có kết quả cuối cùng như sau:

Flex giúp ích rất nhiều trong việc tạo layout, không còn cần phải sự dụng float hoặc table nữa. CSS Grid cũng là một tính năng vô cùng mạnh mẽ mà chúng ta sẽ tìm hiểu ở những bài tiếp theo với cùng một ví dụ.

{{% caniuse feature="flexbox" %}}
{{% caniuse features="flexbox" %}}
@@ -56,4 +56,4 @@ Demo

{{<codepen tatthien LgMKpm>}}

{{% caniuse feature="css-variables" %}}
{{% caniuse features="css-variables" %}}
@@ -118,10 +118,10 @@ console.log(array1[2]);
## caniuse
```markdown
{{</* caniuse feature="proxy" */>}}
{{</* caniuse features="proxy" */>}}
```
{{< caniuse feature="proxy" >}}
{{< caniuse "proxy" >}}
## mermaid
@@ -17,10 +17,10 @@
{{ $commentJs := resources.Get "js/comment.js" }}
{{ $md5 := resources.Get "lib/md5.js" }}
{{ $js := slice $app $highlightJs $md5 $commentJs | resources.Concat "js/bundle.js" | resources.Minify | resources.Fingerprint}}
<script src="{{ $js.RelPermalink }}" async defer onload="hljs.initHighlightingOnLoad();"></script>
<script src="{{ $js.RelPermalink }}" defer onload="hljs.initHighlightingOnLoad();"></script>
{{ else }}
{{ $js := $app | resources.Minify | resources.Fingerprint}}
<script src="{{ $js.RelPermalink }}" async defer></script>
<script src="{{ $js.RelPermalink }}" defer></script>
{{ end }}


@@ -36,17 +36,17 @@
display:none;
}
</style>
<script src="//cdn.embedly.com/widgets/platform.js" async defer></script>
<script src="//cdn.embedly.com/widgets/platform.js" defer></script>
{{ end }}

{{ if ($.Page.Scratch.Get "include_caniuse") "true" }}
<script async src="https://cdn.jsdelivr.net/gh/ireade/caniuse-embed/caniuse-embed.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/gh/ireade/caniuse-embed/caniuse-embed.min.js"></script>
{{ end }}
{{ if ($.Page.Scratch.Get "include_mermaid") "true" }}
<script async src="https://unpkg.com/mermaid@8.0.0/dist/mermaid.min.js"></script>
<script defer src="https://unpkg.com/mermaid@8.0.0/dist/mermaid.min.js"></script>
{{ end }}
{{ if ($.Page.Scratch.Get "include_image_zoom") "true" }}
<script src="https://unpkg.com/medium-zoom@1.0.2/dist/medium-zoom.min.js" async defer onload="mediumZoom('[data-zoomable]');"></script>
<script src="https://unpkg.com/medium-zoom@1.0.2/dist/medium-zoom.min.js" defer onload="mediumZoom('[data-zoomable]');"></script>
{{ end }}
</body>
</html>
@@ -1,3 +1,6 @@
{{ .Page.Scratch.Set "include_caniuse" true }}
{{ $periods := .Get "periods" | default "future_1,current,past_1,past_2" }}
<div class="ciu_embed" data-feature="{{ .Get "feature" }}" data-periods="{{ $periods }}"></div>
{{ $features := default (.Get "features") (.Get 0) }}
<div class="ciu_embed" data-feature="{{ $features }}" data-periods="{{ $periods }}">
<a href="http://caniuse.com/#feat={{ $features }}" target="_blank">Can I Use {{ $features }}?</a>
</div>

0 comments on commit 97e57b0

Please sign in to comment.