0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-10 22:24:19 +01:00
Bootstrap/site/layouts/partials/home/masthead-followup.html
Martijn Cuppens a827934f13 Documentation tweaks (#28679)
* Documentation tweaks

* Remove redundant col-12 classes
2019-05-08 19:58:29 +03:00

47 lines
2.9 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<div class="masthead-followup row m-0 border border-white">
<div class="col-md-4 p-3 p-md-5 bg-light border border-white">
{{ "<!-- Icon by Bytesize https://github.com/danklammer/bytesize-icons -->" | safeHTML }}
{{ partial "icons/import.svg" (dict "class" "text-primary mb-2" "width" "32" "height" "32") }}
<h3>Installation</h3>
<p>Include Bootstraps source Sass and JavaScript files via npm, Composer or Meteor. Package managed installs dont include documentation, but do include our build system and readme.</p>
{{ highlight "npm install bootstrap" "sh" "" }}
{{ highlight (printf ("gem install bootstrap -v %s") .Site.Params.current_ruby_version) "sh" "" }}
<hr class="half-rule">
<a class="btn btn-outline-primary" href="/docs/{{ .Site.Params.docs_version }}/getting-started/download/">Read installation docs</a>
</div>
<div class="col-md-4 p-3 p-md-5 bg-light border border-white">
{{ "<!-- Icon by Bytesize https://github.com/danklammer/bytesize-icons -->" | safeHTML }}
{{ partial "icons/download.svg" (dict "class" "text-primary mb-2" "width" "32" "height" "32") }}
<h3>BootstrapCDN</h3>
<p>When you only need to include Bootstraps compiled CSS or JS, you can use <a href="https://www.bootstrapcdn.com/">BootstrapCDN</a>.</p>
<h5>CSS only</h5>
{{ highlight (printf (`<link rel="stylesheet" href="%s" integrity="%s" crossorigin="anonymous">`) .Site.Params.cdn.css .Site.Params.cdn.css_hash) "html" "" }}
<h5>JS and Popper.js</h5>
{{ highlight (printf (`<script src="%s" integrity="%s" crossorigin="anonymous"></script>
<script src="%s" integrity="%s" crossorigin="anonymous"></script>
`) .Site.Params.cdn.popper .Site.Params.cdn.popper_hash .Site.Params.cdn.js .Site.Params.cdn.js_hash) "html" "" }}
<hr class="half-rule">
<a class="btn btn-outline-primary" href="/docs/{{ .Site.Params.docs_version }}/layout/overview/">Explore the docs</a>
</div>
<div class="col-md-4 p-3 p-md-5 bg-light border border-white">
{{ "<!-- Icon by Bytesize https://github.com/danklammer/bytesize-icons -->" | safeHTML }}
{{ partial "icons/lightning.svg" (dict "class" "text-primary mb-2" "width" "32" "height" "32") }}
<h3>Official Themes</h3>
<p>
Take Bootstrap 4 to the next level with official premium themes—toolkits built on Bootstrap with new components and plugins, docs, and build tools.
</p>
<img class="img-fluid mt-3 mx-auto" srcset="/docs/{{ .Site.Params.docs_version }}/assets/img/bootstrap-themes.png,
/docs/{{ .Site.Params.docs_version }}/assets/img/bootstrap-themes@2x.png 2x"
src="/docs/{{ .Site.Params.docs_version }}/assets/img/bootstrap-themes.png" alt="Bootstrap Themes" width="500" height="200">
<hr class="half-rule">
<a href="{{ .Site.Params.themes }}/" class="btn btn-outline-primary">Browse themes</a>
</div>
</div>