diff --git a/app/assets/images/mocks/tpi_splash_01.jpg b/app/assets/images/mocks/tpi_splash_01.jpg new file mode 100644 index 000000000..ed9b02ae0 Binary files /dev/null and b/app/assets/images/mocks/tpi_splash_01.jpg differ diff --git a/app/assets/stylesheets/app/_colors.scss b/app/assets/stylesheets/app/_colors.scss index d7f951279..871c66c92 100644 --- a/app/assets/stylesheets/app/_colors.scss +++ b/app/assets/stylesheets/app/_colors.scss @@ -1,5 +1,5 @@ $white: #fff; -$blue: #5587F6; +$blue: #5587F7; $blue-dark: #0A4BDC; $blue-darker: #083AAB; $yellow: #FFDD49; diff --git a/app/assets/stylesheets/app/_sizes.scss b/app/assets/stylesheets/app/_sizes.scss new file mode 100644 index 000000000..dc1fbfb8b --- /dev/null +++ b/app/assets/stylesheets/app/_sizes.scss @@ -0,0 +1,10 @@ +// TEXT SIZE +// $size-1: 3.5rem; +// $size-2: 3rem; +// $size-3: 2.5rem; +// $size-4: 2rem; +// $size-5: 1.5rem; +// $size-6: 1rem; +$size-6: 0.875rem; +// $size-7: 0.875rem; +$size-7: 0.75rem; diff --git a/app/assets/stylesheets/app/layout.scss b/app/assets/stylesheets/app/layout.scss deleted file mode 100644 index ba31ff9aa..000000000 --- a/app/assets/stylesheets/app/layout.scss +++ /dev/null @@ -1,50 +0,0 @@ -@import "app/colors"; - -.banner { - height: 140px; - display: flex; - align-items: center; - - .column { - align-items: flex-end; - } - - .partners--container { - .content { - display: flex; - justify-content: flex-end; - } - } - - .partners { - align-items: center; - - .column { - flex-grow: 0; - flex-basis: initial; - flex-shrink: 1; - } - } -} - -.header-nav { - width: 100%; - background-color: $dark; -} - -.navbar-item, -.navbar-link { - padding: 0.5rem 1.25rem; -} - -.navbar-dropdown { - @if $desktop { - width: 300px; - } - - > .navbar-item { - font-size: $size-6; - padding-top: 10px; - padding-bottom: 10px; - } -} diff --git a/app/assets/stylesheets/app/tags.scss b/app/assets/stylesheets/app/tags.scss index 8ac83aeb2..5e9f0f196 100644 --- a/app/assets/stylesheets/app/tags.scss +++ b/app/assets/stylesheets/app/tags.scss @@ -2,5 +2,5 @@ .tag:not(body) { border: 1px solid rgba($grey-dark, 0.5); - font-size: $size-8; + font-size: $size-7; } diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss index 058b64159..b5585b031 100644 --- a/app/assets/stylesheets/application.scss +++ b/app/assets/stylesheets/application.scss @@ -1,21 +1,12 @@ @charset "utf-8"; @import "app/colors"; +@import "app/sizes"; @import "app/typography"; $primary: $blue; $radius: 0; -// TEXT SIZE -// $size-1: 3.5rem; -// $size-2: 3rem; -// $size-3: 2.5rem; -// $size-4: 2rem; -// $size-5: 1.5rem; -$size-6: 1rem; -$size-7: 0.875rem; -$size-8: 0.75rem; - // $control-border-width: 2px; $input-border-color: $blue; // $input-shadow: none; @@ -93,9 +84,8 @@ $tag-radius: 0; // @import "bulma/sass/form/all"; @import "bulma/sass/components/all"; @import "bulma/sass/grid/all"; -// @import "bulma/sass/layout/all"; +@import "bulma/sass/layout/all"; -@import "app/layout"; @import "app/buttons"; @import "app/forms"; @import "app/tags"; diff --git a/app/assets/stylesheets/tpi.scss b/app/assets/stylesheets/tpi.scss index 2d3bcd71f..5abafaf30 100644 --- a/app/assets/stylesheets/tpi.scss +++ b/app/assets/stylesheets/tpi.scss @@ -1,4 +1,7 @@ @import 'settings'; +@import "tpi/banner"; +@import "tpi/navbar"; +@import "tpi/hero"; .container { display: flex; @@ -39,4 +42,4 @@ container-columns { .companies-size { font-size: $font-size-36; font-family: $font-family-bold; -} \ No newline at end of file +} diff --git a/app/assets/stylesheets/tpi/_banner.scss b/app/assets/stylesheets/tpi/_banner.scss new file mode 100644 index 000000000..a2c48e880 --- /dev/null +++ b/app/assets/stylesheets/tpi/_banner.scss @@ -0,0 +1,32 @@ +@import "app/colors"; + +.tpi--banner { + .banner { + height: 140px; + display: flex; + align-items: center; + + .column { + align-items: flex-end; + } + + .partners--container { + .content { + display: flex; + justify-content: flex-end; + color: $grey-dark; + } + } + + .partners { + align-items: center; + max-height: 60px; + + .column { + flex-grow: 0; + flex-basis: initial; + flex-shrink: 1; + } + } + } +} diff --git a/app/assets/stylesheets/tpi/_hero.scss b/app/assets/stylesheets/tpi/_hero.scss new file mode 100644 index 000000000..bc266a6cc --- /dev/null +++ b/app/assets/stylesheets/tpi/_hero.scss @@ -0,0 +1,58 @@ +@import "app/colors"; + +.tpi-home--hero { + color: $white; + position: relative; + overflow: hidden; + min-height: 500px; + display: flex; + align-items: center; + + &.is-primary { + background: $blue-dark; + } + + .hero--body { + .hero--content { + align-items: center; + + .title { + color: $white; + } + + .description { + line-height: $size-4; + } + } + } + + + .button--container { + display: flex; + margin-top: 50px; + + .button--hero { + @extend .is-medium; + + height: 5rem; + padding-left: 4.125rem; + padding-right: 4.125rem; + background-color: $blue-darker; + } + } + + .hero--splash { + position: absolute; + top: 0; + left: 45%; + } + + + &.is-secondary { + background: $blue; + + .button--icon { + background: $blue-darker; + } + } +} \ No newline at end of file diff --git a/app/assets/stylesheets/home.scss b/app/assets/stylesheets/tpi/_home.scss similarity index 100% rename from app/assets/stylesheets/home.scss rename to app/assets/stylesheets/tpi/_home.scss diff --git a/app/assets/stylesheets/tpi/_navbar.scss b/app/assets/stylesheets/tpi/_navbar.scss new file mode 100644 index 000000000..0bfa725fd --- /dev/null +++ b/app/assets/stylesheets/tpi/_navbar.scss @@ -0,0 +1,27 @@ +@import "bulma/sass/utilities/all"; +@import "app/sizes"; +@import "app/colors"; + +.tpi--navbar { + .header-nav { + width: 100%; + background-color: $dark; + } + + .navbar-item, + .navbar-link { + padding: 0.5rem 1.25rem; + } + + .navbar-dropdown { + @if $desktop { + width: 300px; + } + + > .navbar-item { + font-size: $size-6; + padding-top: 10px; + padding-bottom: 10px; + } + } +} diff --git a/app/assets/stylesheets/publications.scss b/app/assets/stylesheets/tpi/_publications.scss similarity index 100% rename from app/assets/stylesheets/publications.scss rename to app/assets/stylesheets/tpi/_publications.scss diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb index 1a23b3d86..a618af503 100644 --- a/app/views/layouts/_header.html.erb +++ b/app/views/layouts/_header.html.erb @@ -1,79 +1,81 @@
-
- MENU - -
-