From 9db37832e96b7f254a4807dcff25b2df2b916dd8 Mon Sep 17 00:00:00 2001 From: Denis Strigo Date: Wed, 31 Oct 2018 13:13:36 +0200 Subject: [PATCH] feat(landing): update landing page (#4) --- .../components/footer/footer.component.scss | 1 - .../components/header/header.component.html | 7 ++- .../components/header/header.component.scss | 5 +- .../download-icon.component.scss | 1 - .../page-container.component.html | 3 +- .../page-container.component.scss | 24 ++++++--- src/app/@theme/styles/_open-sans.scss | 53 ------------------- src/app/@theme/styles/_raleway.scss | 11 ---- src/app/@theme/styles/styles.scss | 1 - src/app/@theme/styles/themes.scss | 3 -- src/assets/img/heart.svg | 53 +++++++------------ src/index.html | 2 +- 12 files changed, 42 insertions(+), 122 deletions(-) delete mode 100644 src/app/@theme/styles/_open-sans.scss diff --git a/src/app/@theme/components/footer/footer.component.scss b/src/app/@theme/components/footer/footer.component.scss index d9e6fb2..93f1c86 100644 --- a/src/app/@theme/components/footer/footer.component.scss +++ b/src/app/@theme/components/footer/footer.component.scss @@ -12,7 +12,6 @@ $social-fg: nb-theme(color-fg-icon); $title-fg: nb-theme(color-fg); - font-family: 'Open Sans SemiBold', sans-serif; font-weight: nb-theme(font-weight-bold); display: flex; flex: 1; diff --git a/src/app/@theme/components/header/header.component.html b/src/app/@theme/components/header/header.component.html index e1cf9ca..52acb7b 100644 --- a/src/app/@theme/components/header/header.component.html +++ b/src/app/@theme/components/header/header.component.html @@ -10,12 +10,12 @@ Twitter - + Behance - + GitHub @@ -53,8 +53,7 @@
  • - + NPM diff --git a/src/app/@theme/components/header/header.component.scss b/src/app/@theme/components/header/header.component.scss index 30b72d6..84b0009 100644 --- a/src/app/@theme/components/header/header.component.scss +++ b/src/app/@theme/components/header/header.component.scss @@ -30,7 +30,6 @@ display: flex; margin-top: 1.5rem; color: $social-color; - font-family: 'Open Sans', sans-serif; } &.right { @@ -97,8 +96,7 @@ margin-top: 1.5rem; color: $primary; background-color: transparent; - font-family: 'Open Sans Bold', sans-serif; - font-weight: nb-theme(font-weight-ultra-bold); + font-weight: nb-theme(font-weight-bold); padding: 0.875rem; border: 1px solid nb-theme(color-gray-bg); border-radius: 0.25rem; @@ -155,7 +153,6 @@ text-decoration: none; text-transform: none; padding: 1rem; - font-family: 'Open Sans SemiBold', sans-serif; color: nb-theme(color-white); &:hover { diff --git a/src/app/@theme/components/modals/download-icon/download-icon.component.scss b/src/app/@theme/components/modals/download-icon/download-icon.component.scss index 3c8d449..2bb1a72 100644 --- a/src/app/@theme/components/modals/download-icon/download-icon.component.scss +++ b/src/app/@theme/components/modals/download-icon/download-icon.component.scss @@ -103,7 +103,6 @@ } .name { - font-family: 'Open Sans Extra Bold', sans-serif; font-size: nb-theme(font-size-sm); font-weight: nb-theme(font-weight-ultra-bold); color: nb-theme(color-primary); diff --git a/src/app/@theme/components/page-container/page-container.component.html b/src/app/@theme/components/page-container/page-container.component.html index d07476b..7e32ca3 100644 --- a/src/app/@theme/components/page-container/page-container.component.html +++ b/src/app/@theme/components/page-container/page-container.component.html @@ -8,7 +8,7 @@

    Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items.
    - Download on the desktop to use them in your digital products for Web, iOS and Android. + Download our set on the desktop to use them in your digital products for Web, iOS and Android.

    @@ -30,6 +30,7 @@
    + Animation: diff --git a/src/app/@theme/components/page-container/page-container.component.scss b/src/app/@theme/components/page-container/page-container.component.scss index b07ac64..24934d0 100644 --- a/src/app/@theme/components/page-container/page-container.component.scss +++ b/src/app/@theme/components/page-container/page-container.component.scss @@ -18,6 +18,7 @@ $version-bg: #edfff3; $description-color: #5670a1; $search-icon-fill-color: #a6aebd; + $actions-color: #a7b4cc; margin-top: 4.5rem; margin-bottom: 3rem; @@ -31,7 +32,6 @@ background-color: $version-bg; position: relative; bottom: 0.35rem; - font-family: 'Raleway Medium', sans-serif; font-size: nb-theme(font-size); font-weight: nb-theme(font-weight-bold); color: $version-color; @@ -41,7 +41,7 @@ } h1 { - font-family: 'Raleway Bold', sans-serif; + font-family: 'Raleway Bold', Arial, Helvetica, Geneva, sans-serif; color: $primary; font-size: 5rem; padding-left: 6.625rem; @@ -51,7 +51,6 @@ .description { color: $description-color; - font-family: 'Raleway Medium', sans-serif; font-size: nb-theme(font-size-lg); line-height: 1.625; margin-bottom: 2rem; @@ -88,6 +87,7 @@ height: 3.75rem; background: url('../../../../assets/img/heart.svg') no-repeat; background-position: 50% 50%; + background-size: contain; } .search-input { @@ -116,6 +116,15 @@ justify-content: space-between; margin-top: 2.875rem; } + + .right-action { + display: flex; + color: $actions-color; + } + + .animation-title { + margin-right: 1.625rem; + } // actions // icons container @@ -142,7 +151,6 @@ width: 70%; margin: 2.5rem auto; text-align: center; - font-family: 'Raleway Medium', sans-serif; font-size: nb-theme(font-size-lg); background-color: nb-theme(info-bg); color: nb-theme(info-fg); @@ -160,10 +168,6 @@ padding-right: 1rem; } - @include media-breakpoint-down(md) { - - } - @include media-breakpoint-down(sm) { margin-top: 0; @@ -210,6 +214,10 @@ } } + .animation-title { + display: none; + } + .info-message { width: 100%; padding: 0 1rem; diff --git a/src/app/@theme/styles/_open-sans.scss b/src/app/@theme/styles/_open-sans.scss deleted file mode 100644 index 689e546..0000000 --- a/src/app/@theme/styles/_open-sans.scss +++ /dev/null @@ -1,53 +0,0 @@ -/** - * @license - * Copyright Akveo. All Rights Reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - */ - -$open-sans-font-path: 'assets/fonts/open-sans' !default; - -@font-face { - font-family: 'Open Sans'; - font-style: normal; - font-weight: 400; - src: url('#{$open-sans-font-path}/open-sans-latin-regular.eot'); - src: local('Open Sans Regular'), local('OpenSans-Regular'), - url('#{$open-sans-font-path}/open-sans-latin-regular.eot?#iefix') format('embedded-opentype'), - url('#{$open-sans-font-path}/open-sans-latin-regular.woff2') format('woff2'), - url('#{$open-sans-font-path}/open-sans-latin-regular.woff') format('woff'), - url('#{$open-sans-font-path}/open-sans-latin-regular.ttf') format('truetype'), - url('#{$open-sans-font-path}/open-sans-latin-regular.svg#OpenSans') format('svg'); -} - -@font-face { - font-family: 'Open Sans SemiBold'; - src: url('#{$open-sans-font-path}/OpenSans-SemiBold.eot'); - src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'), - url('#{$open-sans-font-path}/OpenSans-SemiBold.eot?#iefix') format('embedded-opentype'), - url('#{$open-sans-font-path}/OpenSans-SemiBold.woff') format('woff'), - url('#{$open-sans-font-path}/OpenSans-SemiBold.ttf') format('truetype'); - font-weight: 600; - font-style: normal; -} - -@font-face { - font-family: 'Open Sans Bold'; - src: url('#{$open-sans-font-path}/OpenSans-Bold.eot'); - src: local('Open Sans Bold'), local('OpenSans-Bold'), - url('#{$open-sans-font-path}/OpenSans-Bold.eot?#iefix') format('embedded-opentype'), - url('#{$open-sans-font-path}/OpenSans-Bold.woff') format('woff'), - url('#{$open-sans-font-path}/OpenSans-Bold.ttf') format('truetype'); - font-weight: bold; - font-style: normal; -} - -@font-face { - font-family: 'Open Sans Extra Bold'; - src: url('#{$open-sans-font-path}/OpenSans-ExtraBold.eot'); - src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), - url('#{$open-sans-font-path}/OpenSans-ExtraBold.eot?#iefix') format('embedded-opentype'), - url('#{$open-sans-font-path}/OpenSans-ExtraBold.woff') format('woff'), - url('#{$open-sans-font-path}/OpenSans-ExtraBold.ttf') format('truetype'); - font-weight: 800; - font-style: normal; -} diff --git a/src/app/@theme/styles/_raleway.scss b/src/app/@theme/styles/_raleway.scss index 0eab82c..84d6e87 100644 --- a/src/app/@theme/styles/_raleway.scss +++ b/src/app/@theme/styles/_raleway.scss @@ -6,17 +6,6 @@ $raleway-font-path: 'assets/fonts/raleway' !default; -@font-face { - font-family: 'Raleway Medium'; - src: url('#{$raleway-font-path}/Raleway-Medium.eot'); - src: local('Raleway Medium'), local('Raleway-Medium'), - url('#{$raleway-font-path}/Raleway-Medium.eot?#iefix') format('embedded-opentype'), - url('#{$raleway-font-path}/Raleway-Medium.woff') format('woff'), - url('#{$raleway-font-path}/Raleway-Medium.ttf') format('truetype'); - font-weight: 500; - font-style: normal; -} - @font-face { font-family: 'Raleway Bold'; src: url('#{$raleway-font-path}/Raleway-Bold.eot'); diff --git a/src/app/@theme/styles/styles.scss b/src/app/@theme/styles/styles.scss index f0cd874..3c5be39 100644 --- a/src/app/@theme/styles/styles.scss +++ b/src/app/@theme/styles/styles.scss @@ -5,7 +5,6 @@ */ @import 'raleway'; -@import 'open-sans'; @import 'themes'; @import '~@nebular/theme/styles/globals'; diff --git a/src/app/@theme/styles/themes.scss b/src/app/@theme/styles/themes.scss index 24c6548..215b5c1 100644 --- a/src/app/@theme/styles/themes.scss +++ b/src/app/@theme/styles/themes.scss @@ -11,9 +11,6 @@ $nb-enabled-themes: (eva); /* stylelint-disable */ $nb-themes: nb-register-theme(( - font-main: 'Open Sans', - font-secondary: 'Raleway Bold', - content-width: 1120px, color-primary: #3366ff, diff --git a/src/assets/img/heart.svg b/src/assets/img/heart.svg index b24d8ed..f3ec1cf 100644 --- a/src/assets/img/heart.svg +++ b/src/assets/img/heart.svg @@ -1,43 +1,28 @@ - - - 595CB108-9780-47D9-AAF4-432058714209 - Created with sketchtool. + + + Group 2 + Created with Sketch. - - - - - - - - - - - + + - - - - - - - - + + + + + + + + - - - - + - - - + + + - - - - + diff --git a/src/index.html b/src/index.html index 23f2e0a..87f622c 100644 --- a/src/index.html +++ b/src/index.html @@ -13,7 +13,7 @@ Eva Icons - beautifully crafted Open Source UI icons for common actions and items. - +