diff --git a/roomwithavw-custom.php b/roomwithavw-custom.php index f1e785a..8a05f4f 100644 --- a/roomwithavw-custom.php +++ b/roomwithavw-custom.php @@ -15,6 +15,9 @@ function roomwithavw_custom_add_scripts() { wp_register_script( 'roomwithavw-custom-script', plugins_url( 'assets/js/index.js', __FILE__ ), '', '1.0', true ); wp_enqueue_script( 'roomwithavw-custom-script' ); + wp_register_script( 'iconify', 'https://code.iconify.design/1/1.0.6/iconify.min.js', '', '1.0', true ); + wp_enqueue_script( 'iconify' ); + wp_enqueue_style( 'roomwithavw-custom-styles', plugins_url( 'assets/css/style.css', __FILE__ ), '', '1.0' ); } add_action( 'wp_enqueue_scripts', 'roomwithavw_custom_add_scripts' ); diff --git a/src/scss/_featured.scss b/src/scss/_featured.scss index 1c25b78..9e62b6c 100644 --- a/src/scss/_featured.scss +++ b/src/scss/_featured.scss @@ -1,5 +1,187 @@ body.rwavw-custom { + .widget.rwavw-feature-sunset { + .pure-g > div:first-child { + padding-right: 44px; + display: flex; + flex-direction: column; + justify-content: center; + } + + .h2, h3, h4, h5, h6 { + font-weight: 400; + text-align: right !important; + color: #000a38; + margin-top: 0; + margin-bottom: 44px; + } + + p { + font-size:19px; + margin-bottom: 22px; + color: #020121; + text-align: right !important; + } + } + + .widget.rwavw-feature-main { + + margin-top: 0; + margin-left: auto; + margin-right: auto; + max-width: 1800px; + + .gallery-item { + flex: 100% 0 0; + + .gallery-link { + } + } + + .pure-g { + align-items: center; + } + + .pure-u-1 { + color: inherit; + } + + h4, + p { + font-size: 16px; + margin-bottom: 22px; + } + + h4 { + display: flex; + flex-direction: row; + align-items: center; + font-weight: 400; + font-size: 22px; + color: inherit; + + svg { + font-size: 32px; + margin-right: 0.7ch; + + &.small { + font-size: 24px; + } + } + } + + p { + } + + .hover-overlay { + > .overlay { + $color-overlay: #252c03; + + background-color: transparent !important; + background-image: linear-gradient( + to bottom, + rgba($color-overlay, 0.05), + rgba($color-overlay, 0.0) 50%, + rgba($color-overlay, 1) + ), linear-gradient( + to right, + rgba($color-overlay, 0.1), + rgba($color-overlay, 0) 20%, + rgba($color-overlay, 0) 80%, + rgba($color-overlay, 0.1) + ); + + opacity: 1; + + &:hover { + opacity: 0; + } + + > div { + height: 100%; + top: 0; + transform: none; + + display: flex; + flex-direction: row; + justify-content: flex-end; + align-items: flex-end; + padding: 22px; + + h2, h3, h4, h5, h6 { + color: #fff !important; + margin: 0; + line-height: 1.2; + font-size: 26px; + font-weight: 400; + text-align: right; + } + } + } + + &:hover img { + transform: none; + } + } + + @media (max-width: 63.98em) { + text-align: center; + + .hover-overlay { + margin-bottom: 22px; + } + + h4 { + justify-content: center; + } + } + + @media (min-width: 64em) { + margin-top: 44px; + + .gallery-item { + flex: 40% 0 0; + } + + .hover-overlay { + > .overlay { + + &:hover { + } + + > div { + + h2, h3, h4, h5, h6 { + font-size: 32px; + } + } + } + } + + h4, + p { + margin-left: 44px; + } + } + + @media (min-width: 104em) { + .hover-overlay { + > .overlay { + + &:hover { + } + + > div { + + h2, h3, h4, h5, h6 { + font-size: 44px; + } + } + } + } + } + } + .widget.rwavw-featured { h2 { color: red; diff --git a/src/scss/_footer.scss b/src/scss/_footer.scss new file mode 100644 index 0000000..2049d73 --- /dev/null +++ b/src/scss/_footer.scss @@ -0,0 +1,71 @@ +body.rwavw-custom { + + #footer { + // TODO set using theme - how? + color: #b0b0b0; + background-color: #272729; + + a { + color: #fff; + font-weight: 600; + opacity: 0.8; + + &.button-social { + color: #fff; + &.btn-massive > i { + font-size: 24px; + } + } + } + + h2, h3, h4, h5, h6 { + color: inherit; + font-size: 2.4rem; + font-weight: 400; + line-height: 22px; + letter-spacing: 0.75px; + margin: 0 0 22px; + } + + .section-title .heading + .excerpt { + margin-top: 22px; + } + + p { + margin: 0 0 22px; + + &:last-child { + margin: 0; + } + } + } + + .footer-widgets { + .widget.invert, + .section-title.invert, + widget *:not(:link) { + color: inherit; + } + + > .pure-g > .pure-u-1 { + padding: 44px 22px 0; + } + + .section-title { + margin: 0 0 22px; + } + + .content-vertical-massive { + padding-top: 0; + padding-bottom: 0; + } + + // FIXME temp fix - why happening in first place?? + .scroll-in-animation { + animation: none; + opacity: 1; + } + } +} + + diff --git a/src/scss/style.scss b/src/scss/style.scss index a9127b0..4738995 100644 --- a/src/scss/style.scss +++ b/src/scss/style.scss @@ -1,6 +1,7 @@ @import "featured"; @import "contact"; @import "faq"; +@import "footer"; #top-nav .ext-nav-toggle, .state2 body.rwavw-custom .page-border.top {