diff --git a/src/assets/styles/components/_contact.scss b/src/assets/styles/components/_contact.scss new file mode 100644 index 0000000..8511a71 --- /dev/null +++ b/src/assets/styles/components/_contact.scss @@ -0,0 +1,37 @@ +#contact { + header { + @include vendor('order', '1'); + + p { + color: inherit; + } + } + + .actions { + @include vendor('order', '2'); + width: 30%; + } + + @include breakpoint(medium) { + display: block; + text-align: center; + + header { + padding-right: 0; + width: 100%; + } + + .actions { + margin-left: auto; + margin-right: auto; + max-width: 20em; + width: 100%; + } + } + + @include breakpoint(small) { + .actions { + max-width: none; + } + } +} diff --git a/src/assets/styles/components/_cta.scss b/src/assets/styles/components/_cta.scss deleted file mode 100644 index 94d8c67..0000000 --- a/src/assets/styles/components/_cta.scss +++ /dev/null @@ -1,50 +0,0 @@ - - - - -/* CTA */ - -#cta { - .inner { - @include vendor('display', 'flex'); - max-width: 45em; - - header { - @include vendor('order', '1'); - padding-right: 3em; - width: 70%; - - p { - color: inherit; - } - } - - .actions { - @include vendor('order', '2'); - width: 30%; - } - - @include breakpoint(medium) { - display: block; - text-align: center; - - header { - padding-right: 0; - width: 100%; - } - - .actions { - margin-left: auto; - margin-right: auto; - max-width: 20em; - width: 100%; - } - } - - @include breakpoint(small) { - .actions { - max-width: none; - } - } - } -} \ No newline at end of file diff --git a/src/assets/styles/main.scss b/src/assets/styles/main.scss index 865e9be..8e816d5 100644 --- a/src/assets/styles/main.scss +++ b/src/assets/styles/main.scss @@ -42,7 +42,7 @@ @import 'components/menu'; @import 'components/header'; @import 'components/banner'; -@import 'components/cta'; +@import 'components/contact'; /* Main */