diff --git a/src/_includes/components/button-link.html b/src/_includes/components/button-link.html new file mode 100644 index 0000000000..1086ea4e9a --- /dev/null +++ b/src/_includes/components/button-link.html @@ -0,0 +1,3 @@ + + {{ include.text }} + diff --git a/src/_sass/components/_button-link.scss b/src/_sass/components/_button-link.scss new file mode 100644 index 0000000000..d93e582414 --- /dev/null +++ b/src/_sass/components/_button-link.scss @@ -0,0 +1,4 @@ +.button-link { + text-decoration: underline; + font-weight: 700; +} diff --git a/src/_sass/segment.scss b/src/_sass/segment.scss index 3b89908acc..95f16ee4c1 100644 --- a/src/_sass/segment.scss +++ b/src/_sass/segment.scss @@ -32,3 +32,7 @@ @import "elements/h"; @import "elements/ul"; @import "elements/ol"; + +// Components +// ================================================= +@import "components/button-link"; diff --git a/src/styleguide.md b/src/styleguide.md index 1da5c8b301..f64661cc04 100644 --- a/src/styleguide.md +++ b/src/styleguide.md @@ -5,6 +5,8 @@ hidden: true layout: page --- +{% include components/button-link.html text="Find out more" href="https://segment.com" %} + # Heading 1 ## Heading 2 ### Heading 3