diff --git a/src/components/HeroSection/HeroSection.css b/src/components/HeroSection/HeroSection.css index 744ef026..58c541ca 100644 --- a/src/components/HeroSection/HeroSection.css +++ b/src/components/HeroSection/HeroSection.css @@ -1,55 +1,70 @@ -.section { - width: 100%; - min-height: calc(100vh - 60px); - background-image: url("data:image/svg+xml;utf8,"); - background-size: 100% 100%; - background-position: center; +@import '../../marketplace.css'; - display: flex; - justify-content: center; +:root { + --desktopTitleMaxWidth: 625px; } -.content { +.root { display: flex; flex-direction: column; - align-items: center; + background-color: var(--matterColor); + background-image: url(./background.jpg); + background-size: cover; + background-position-y: center; + + /* + This value is specific to the given image. The value is the + relative position of the interesting area in the x axis, counted + from the left side of the image. + + In the default image, this means the person sitting in the + sauna. This value ensures the person is approximately centered in + the viewport when the browser width changes. + */ + background-position-x: 80%; } -.titleWrapper { - text-align: center; +.heroMainTitle { + composes: heroTitle from '../../marketplace.css'; + color: var(--matterColorLight); + margin-top: auto; + margin-bottom: 12px; - /* Mobile padding */ - margin-left: 24px; /* Number out of my head, not sure if it's the right one */ - margin-right: 24px; /* Number out of my head, not sure if it's the right one */ + @media (--desktopViewport) { + max-width: var(--desktopTitleMaxWidth); + } } -.title { - /* Font */ - font-size: 24px; - letter-spacing: -0.6px; - font-weight: bold; +.heroSubTitle { + color: var(--matterColorLight); + margin-bottom: 47px; - /* Mobile padding */ - margin-top: 64px; - margin-bottom: 4px; - -} -.subTitle { - /* Font */ - font-size: 20px; - letter-spacing: -0.5px; - font-weight: bold; - - /* Mobile padding */ - margin-bottom: 48px; + @media (--desktopViewport) { + max-width: var(--desktopTitleMaxWidth); + } } -.ctaWrapper { - display: flex; - flex-direction: column; - flex-grow: 1; - align-items: center; +.mobileSearchButton { + border-radius: 4px; - /* Mobile dimensions */ - width: 235px; + @media (--desktopViewport) { + display: none; + } +} + +.searchIcon { + stroke: var(--matterColorLight); + width: 16px; + height: 16px; + margin-right: 10px; +} + +.desktopSearchForm { + display: none; + background-color: var(--matterColorLight); + + @media (--desktopViewport) { + display: block; + width: 400px; + } } diff --git a/src/components/HeroSection/HeroSection.js b/src/components/HeroSection/HeroSection.js index e2170a78..de912966 100644 --- a/src/components/HeroSection/HeroSection.js +++ b/src/components/HeroSection/HeroSection.js @@ -1,29 +1,64 @@ import React, { PropTypes } from 'react'; import { FormattedMessage } from 'react-intl'; +import classNames from 'classnames'; +import { SearchIcon } from '../../components'; +import { LocationSearchForm } from '../../containers'; +import { stringify } from '../../util/urlHelpers'; +import { createResourceLocatorString } from '../../util/routes'; +import * as propTypes from '../../util/propTypes'; + import css from './HeroSection.css'; -const HeroSection = props => ( -
-
-
-
- -
-
- -
-
-
- {props.children} -
+const HeroSection = props => { + const { rootClassName, className, flattenedRoutes, history, location } = props; + + const handleMobileSearchClick = () => { + const params = { mobilesearch: 'open' }; + const path = `${location.pathname}?${stringify(params)}`; + history.push(path); + }; + + const handleSearchSubmit = values => { + const { search, selectedPlace } = values.location; + const { origin, bounds, country } = selectedPlace; + const searchParams = { address: search, origin, bounds, country }; + history.push(createResourceLocatorString('SearchPage', flattenedRoutes, {}, searchParams)); + }; + + const classes = classNames(rootClassName || css.root, className); + + return ( +
+

+ +

+

+ +

+ +
-
-); + ); +}; -HeroSection.defaultProps = { children: [] }; +HeroSection.defaultProps = { rootClassName: null, className: null }; -const { any } = PropTypes; +const { string, shape, func, arrayOf } = PropTypes; -HeroSection.propTypes = { children: any }; +HeroSection.propTypes = { + rootClassName: string, + className: string, + + flattenedRoutes: arrayOf(propTypes.route).isRequired, + history: shape({ + push: func.isRequired, + }).isRequired, + location: shape({ + search: string.isRequired, + }).isRequired, +}; export default HeroSection; diff --git a/src/components/HeroSection/HeroSection.test.js b/src/components/HeroSection/HeroSection.test.js index a6961cb6..c92c789d 100644 --- a/src/components/HeroSection/HeroSection.test.js +++ b/src/components/HeroSection/HeroSection.test.js @@ -2,13 +2,18 @@ import React from 'react'; import { renderDeep } from '../../util/test-helpers'; import HeroSection from './HeroSection'; +const noop = () => null; + describe('HeroSection', () => { it('matches snapshot', () => { - const tree = renderDeep( - - test - - ); + window.google = { maps: {} }; + const heroProps = { + flattenedRoutes: [], + history: { push: noop }, + location: { search: '' }, + }; + const tree = renderDeep(); + delete window.google; expect(tree).toMatchSnapshot(); }); }); diff --git a/src/components/HeroSection/__snapshots__/HeroSection.test.js.snap b/src/components/HeroSection/__snapshots__/HeroSection.test.js.snap index 4c13bbdd..6906955f 100644 --- a/src/components/HeroSection/__snapshots__/HeroSection.test.js.snap +++ b/src/components/HeroSection/__snapshots__/HeroSection.test.js.snap @@ -1,27 +1,89 @@ exports[`HeroSection matches snapshot 1`] = ` -
-
+

+ + Book saunas everywhere. + +

+

+ + The largest online community to rent saunas in Finland. + +

+ +
+ className="">
- - Book Studiotime anywhere - -
-
- - The largest online community to rent music studios - + className=""> + + + + + +
+
-
- test -
-
-
+ + `; diff --git a/src/components/HeroSection/background.jpg b/src/components/HeroSection/background.jpg new file mode 100644 index 00000000..0aedc3d9 Binary files /dev/null and b/src/components/HeroSection/background.jpg differ diff --git a/src/components/MenuLabel/MenuLabel.css b/src/components/MenuLabel/MenuLabel.css index f35b6ad9..22e99909 100644 --- a/src/components/MenuLabel/MenuLabel.css +++ b/src/components/MenuLabel/MenuLabel.css @@ -3,4 +3,10 @@ width: 100%; border: 0; cursor: pointer; + background-color: transparent; + + &:hover { + background-color: transparent; + box-shadow: none; + } } diff --git a/src/components/Modal/Modal.css b/src/components/Modal/Modal.css index a8b60c3e..9ecd4845 100644 --- a/src/components/Modal/Modal.css +++ b/src/components/Modal/Modal.css @@ -51,6 +51,7 @@ &:enabled:hover { background-color: transparent; color: var(--matterColorDark); + box-shadow: none; } &:enabled:active { background-color: transparent; diff --git a/src/components/SearchIcon/SearchIcon.css b/src/components/SearchIcon/SearchIcon.css new file mode 100644 index 00000000..7480319c --- /dev/null +++ b/src/components/SearchIcon/SearchIcon.css @@ -0,0 +1,5 @@ +@import '../../marketplace.css'; + +.root { + stroke: var(--marketplaceColor); +} diff --git a/src/components/SearchIcon/SearchIcon.js b/src/components/SearchIcon/SearchIcon.js new file mode 100644 index 00000000..a7817abf --- /dev/null +++ b/src/components/SearchIcon/SearchIcon.js @@ -0,0 +1,43 @@ +import React, { PropTypes } from 'react'; +import classNames from 'classnames'; + +import css from './SearchIcon.css'; + +const SearchIcon = props => { + const { rootClassName, className } = props; + const classes = classNames(rootClassName || css.root, className); + return ( + + + + + + ); +}; + +SearchIcon.defaultProps = { + rootClassName: null, + className: null, +}; + +const { string } = PropTypes; + +SearchIcon.propTypes = { + rootClassName: string, + className: string, +}; + +export default SearchIcon; diff --git a/src/components/TopbarDesktop/TopbarDesktop.css b/src/components/TopbarDesktop/TopbarDesktop.css index 01ad04ee..e83ba514 100644 --- a/src/components/TopbarDesktop/TopbarDesktop.css +++ b/src/components/TopbarDesktop/TopbarDesktop.css @@ -4,7 +4,7 @@ .root { /* Size */ width: 100%; - height: 72px; + height: var(--topbarHeightDesktop); /* Layout for child components */ display: flex; @@ -121,6 +121,7 @@ width: 100%; padding: 20px 24px; composes: h4Font from '../../marketplace.css'; + composes: textColor from '../../marketplace.css'; text-align: left; white-space: nowrap; diff --git a/src/components/TopbarMobileMenu/TopbarMobileMenu.css b/src/components/TopbarMobileMenu/TopbarMobileMenu.css index 63611f9a..438883fc 100644 --- a/src/components/TopbarMobileMenu/TopbarMobileMenu.css +++ b/src/components/TopbarMobileMenu/TopbarMobileMenu.css @@ -26,7 +26,7 @@ .avatar { flex-shrink: 0; - margin-top: 72px; + margin-top: 96px; width: 120px; height: 120px; border-radius: 50%; @@ -51,6 +51,7 @@ .logoutButton { /* Position component */ margin: 6px 0; + width: initial; /* Logout font is smaller and gray since the action is not recommended. */ composes: h3Font from '../../marketplace.css'; diff --git a/src/components/index.js b/src/components/index.js index 6c91625b..f0c22d35 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -39,6 +39,7 @@ import PaginationLinks from './PaginationLinks/PaginationLinks'; import Promised from './Promised/Promised'; import RoutesProvider from './RoutesProvider/RoutesProvider'; import SaleDetailsPanel from './SaleDetailsPanel/SaleDetailsPanel'; +import SearchIcon from './SearchIcon/SearchIcon'; import SearchResultsPanel from './SearchResultsPanel/SearchResultsPanel'; import Select from './Select/Select'; import StripeBankAccountToken from './StripeBankAccountToken/StripeBankAccountToken'; @@ -92,6 +93,7 @@ export { Promised, RoutesProvider, SaleDetailsPanel, + SearchIcon, SearchResultsPanel, Select, StripeBankAccountToken, diff --git a/src/containers/LandingPage/LandingPage.css b/src/containers/LandingPage/LandingPage.css index b2e54dc8..61cd36f6 100644 --- a/src/containers/LandingPage/LandingPage.css +++ b/src/containers/LandingPage/LandingPage.css @@ -1,3 +1,22 @@ -.form { - width: 100%; +@import '../../marketplace.css'; + +.root { + +} + +.hero { + height: calc(100vh - var(--topbarHeight)); + padding: 0 24px 26px 24px; + + @media (--desktopViewport) { + height: calc(100vh - var(--topbarHeightDesktop)); + } + + @media (min-width: 768px) { + padding: 0 24px 26px 24px; + } + + @media (min-width: 1024px){ + padding: 0 0 195px 192px; + } } diff --git a/src/containers/LandingPage/LandingPage.js b/src/containers/LandingPage/LandingPage.js index 825129bd..3ad72edf 100644 --- a/src/containers/LandingPage/LandingPage.js +++ b/src/containers/LandingPage/LandingPage.js @@ -1,40 +1,33 @@ import React, { PropTypes } from 'react'; import { withRouter } from 'react-router-dom'; -import { HeroSection, PageLayout } from '../../components'; -import { SearchForm } from '../../containers'; -import { createResourceLocatorString } from '../../util/routes'; -import * as propTypes from '../../util/propTypes'; +import { PageLayout, HeroSection } from '../../components'; +import { withFlattenedRoutes } from '../../util/contextHelpers'; import css from './LandingPage.css'; export const LandingPageComponent = props => { - const { history, flattenedRoutes } = props; - - const handleSubmit = values => { - const selectedPlace = values && values.location ? values.location.selectedPlace : null; - const { address, origin, bounds, country } = selectedPlace || {}; - const searchParams = { address, origin, bounds, country }; - history.push(createResourceLocatorString('SearchPage', flattenedRoutes, {}, searchParams)); - }; - + const { flattenedRoutes, history, location } = props; return ( - - - - + + ); }; -const { func, arrayOf, shape } = PropTypes; +const { array, object } = PropTypes; LandingPageComponent.propTypes = { - flattenedRoutes: arrayOf(propTypes.route).isRequired, + // from withFlattenedRoutes + flattenedRoutes: array.isRequired, // from withRouter - history: shape({ - push: func.isRequired, - }).isRequired, + history: object.isRequired, + location: object.isRequired, }; -export default withRouter(LandingPageComponent); +export default withRouter(withFlattenedRoutes(LandingPageComponent)); diff --git a/src/containers/LandingPage/LandingPage.test.js b/src/containers/LandingPage/LandingPage.test.js index 7c30d34e..ad8d6a1a 100644 --- a/src/containers/LandingPage/LandingPage.test.js +++ b/src/containers/LandingPage/LandingPage.test.js @@ -10,9 +10,9 @@ describe('LandingPage', () => { it('matches snapshot', () => { const tree = renderShallow( v} - history={{ push: noop }} flattenedRoutes={[]} + history={{ push: noop }} + location={{ search: '' }} /> ); expect(tree).toMatchSnapshot(); diff --git a/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap b/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap index 1456a26e..99cf9edb 100644 --- a/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap +++ b/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap @@ -1,10 +1,19 @@ exports[`LandingPage matches snapshot 1`] = ` - - - + `; diff --git a/src/containers/LocationSearchForm/LocationSearchForm.css b/src/containers/LocationSearchForm/LocationSearchForm.css new file mode 100644 index 00000000..9eaa5b61 --- /dev/null +++ b/src/containers/LocationSearchForm/LocationSearchForm.css @@ -0,0 +1,18 @@ +.root { + +} + +.searchInputIcon { + box-sizing: content-box; + padding-left: 24px; + margin-top: 2px; +} + +.searchInput { + height: 69px; +} + +.searchPredictions { + margin-top: 16px; + margin-bottom: 102px; +} diff --git a/src/containers/LocationSearchForm/LocationSearchForm.js b/src/containers/LocationSearchForm/LocationSearchForm.js new file mode 100644 index 00000000..935b03ad --- /dev/null +++ b/src/containers/LocationSearchForm/LocationSearchForm.js @@ -0,0 +1,66 @@ +import React, { PropTypes } from 'react'; +import { compose } from 'redux'; +import { Field, reduxForm, propTypes as formPropTypes } from 'redux-form'; +import { intlShape, injectIntl } from 'react-intl'; +import classNames from 'classnames'; +import { LocationAutocompleteInput } from '../../components'; + +import css from './LocationSearchForm.css'; + +const LocationSearchFormComponent = props => { + const { rootClassName, className, intl, onSubmit } = props; + + const onChange = location => { + if (location.selectedPlace) { + // Note that we use `onSubmit` instead of the conventional + // `handleSubmit` prop for submitting. We want to autosubmit + // when a place is selected, and don't require any extra + // validations for the form. + onSubmit({ location }); + } + }; + + const classes = classNames(rootClassName || css.root, className); + + // Allow form submit only when the place has changed + const preventFormSubmit = e => e.preventDefault(); + + return ( +
+ + + ); +}; + +const { func, string } = PropTypes; + +LocationSearchFormComponent.defaultProps = { rootClassName: null, className: null }; + +LocationSearchFormComponent.propTypes = { + ...formPropTypes, + + rootClassName: string, + className: string, + onSubmit: func.isRequired, + + // from injectIntl + intl: intlShape.isRequired, +}; + +const defaultFormName = 'TopbarSearchForm'; + +const LocationSearchForm = compose(reduxForm({ form: defaultFormName }), injectIntl)( + LocationSearchFormComponent +); + +export default LocationSearchForm; diff --git a/src/containers/SearchForm/SearchForm.css b/src/containers/SearchForm/SearchForm.css deleted file mode 100644 index 20cef791..00000000 --- a/src/containers/SearchForm/SearchForm.css +++ /dev/null @@ -1,22 +0,0 @@ -.locationInput { - width: 100%; - background-color: white; - - /* Font */ - font-size: 16px; - letter-spacing: -0.4px; - font-weight: bold; -} - -.locationButton { - width: 100%; - height: 50px; - margin: 0; - text-align: right; -} - -.searchIcon { - display: inline-block; - margin-left: 12px; - margin-right: 12px; -} diff --git a/src/containers/SearchForm/SearchForm.example.js b/src/containers/SearchForm/SearchForm.example.js deleted file mode 100644 index 0fb6f611..00000000 --- a/src/containers/SearchForm/SearchForm.example.js +++ /dev/null @@ -1,12 +0,0 @@ -/* eslint-disable no-console */ -import SearchForm from './SearchForm'; - -export const Empty = { - component: SearchForm, - props: { - onSubmit(values) { - console.log('submit search query:', values); - }, - }, - group: 'forms', -}; diff --git a/src/containers/SearchForm/SearchForm.js b/src/containers/SearchForm/SearchForm.js deleted file mode 100644 index 9838fffa..00000000 --- a/src/containers/SearchForm/SearchForm.js +++ /dev/null @@ -1,55 +0,0 @@ -import React from 'react'; -import { Field, reduxForm, propTypes as formPropTypes } from 'redux-form'; -import { FormattedMessage, intlShape, injectIntl } from 'react-intl'; -import { LocationAutocompleteInput, Button } from '../../components'; - -import css from './SearchForm.css'; - -const SearchForm = props => { - const { className, intl, handleSubmit, submitting } = props; - const addClassName = className ? { className } : {}; - - const submitDisabled = submitting; - - return ( -
- - - - ); -}; - -SearchForm.propTypes = { - ...formPropTypes, - - // from injectIntl - intl: intlShape.isRequired, -}; - -const defaultFormName = 'SearchForm'; - -export default reduxForm({ form: defaultFormName })(injectIntl(SearchForm)); diff --git a/src/containers/SearchForm/SearchForm.test.js b/src/containers/SearchForm/SearchForm.test.js deleted file mode 100644 index aa152982..00000000 --- a/src/containers/SearchForm/SearchForm.test.js +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react'; -import { renderDeep } from '../../util/test-helpers'; -import SearchForm from './SearchForm'; - -describe('SearchForm', () => { - it('matches snapshot', () => { - window.google = { maps: {} }; - const tree = renderDeep(); - expect(tree).toMatchSnapshot(); - delete window.google; - }); -}); diff --git a/src/containers/SearchForm/__snapshots__/SearchForm.test.js.snap b/src/containers/SearchForm/__snapshots__/SearchForm.test.js.snap deleted file mode 100644 index 7ffdf928..00000000 --- a/src/containers/SearchForm/__snapshots__/SearchForm.test.js.snap +++ /dev/null @@ -1,77 +0,0 @@ -exports[`SearchForm matches snapshot 1`] = ` -
-
-
- - - - - - -
- -
- -
-`; diff --git a/src/containers/Topbar/Topbar.css b/src/containers/Topbar/Topbar.css index a38ca3b0..b6c82886 100644 --- a/src/containers/Topbar/Topbar.css +++ b/src/containers/Topbar/Topbar.css @@ -1,7 +1,6 @@ @import '../../marketplace.css'; :root { - --topbarHeight: 60px; --logoHeight: 25px; } @@ -61,6 +60,7 @@ &:enabled:hover, &:enabled:active { background-color: transparent; + box-shadow: none; } &:disabled { background-color: transparent; diff --git a/src/containers/TopbarSearchForm/TopbarSearchForm.css b/src/containers/TopbarSearchForm/TopbarSearchForm.css index 23d40b79..08044469 100644 --- a/src/containers/TopbarSearchForm/TopbarSearchForm.css +++ b/src/containers/TopbarSearchForm/TopbarSearchForm.css @@ -25,11 +25,12 @@ } .desktopIcon { + height: var(--topbarHeightDesktop); border: none; } .desktopInput { - height: var(--topbarMargin); + height: var(--topbarHeightDesktop); border: none; padding-top: 0; padding-bottom: var(--bottomBorder); @@ -43,6 +44,6 @@ } .desktopPredictions { - margin-top: calc(var(--topbarMargin) - var(--inputHeight)); + margin-top: calc(var(--topbarHeightDesktop) - var(--inputHeight)); max-width: 434px; } diff --git a/src/containers/index.js b/src/containers/index.js index be66af4c..a9d9ccd7 100644 --- a/src/containers/index.js +++ b/src/containers/index.js @@ -13,6 +13,7 @@ import EditProfilePage from './EditProfilePage/EditProfilePage'; import InboxPage from './InboxPage/InboxPage'; import LandingPage from './LandingPage/LandingPage'; import ListingPage from './ListingPage/ListingPage'; +import LocationSearchForm from './LocationSearchForm/LocationSearchForm'; import LoginForm from './LoginForm/LoginForm'; import ManageListingsPage from './ManageListingsPage/ManageListingsPage'; import NotFoundPage from './NotFoundPage/NotFoundPage'; @@ -24,7 +25,6 @@ import PayoutDetailsForm from './PayoutDetailsForm/PayoutDetailsForm'; import PayoutPreferencesPage from './PayoutPreferencesPage/PayoutPreferencesPage'; import ProfilePage from './ProfilePage/ProfilePage'; import SalePage from './SalePage/SalePage'; -import SearchForm from './SearchForm/SearchForm'; import SearchPage from './SearchPage/SearchPage'; import SecurityPage from './SecurityPage/SecurityPage'; import SignupForm from './SignupForm/SignupForm'; @@ -49,6 +49,7 @@ export { InboxPage, LandingPage, ListingPage, + LocationSearchForm, LoginForm, ManageListingsPage, NotFoundPage, @@ -60,7 +61,6 @@ export { PayoutPreferencesPage, ProfilePage, SalePage, - SearchForm, SearchPage, SecurityPage, SignupForm, diff --git a/src/examples.js b/src/examples.js index 90349e69..759b0947 100644 --- a/src/examples.js +++ b/src/examples.js @@ -35,7 +35,6 @@ import * as EditListingPhotosForm from './containers/EditListingPhotosForm/EditListingPhotosForm.example'; import * as EditListingPricingForm from './containers/EditListingPricingForm/EditListingPricingForm.example'; -import * as SearchForm from './containers/SearchForm/SearchForm.example'; import * as LoginForm from './containers/LoginForm/LoginForm.example'; import * as PasswordForgottenForm from './containers/PasswordForgottenForm/PasswordForgottenForm.example'; @@ -71,7 +70,6 @@ export { PaginationLinks, PasswordForgottenForm, PayoutDetailsForm, - SearchForm, SignupForm, StripeBankAccountToken, StripePaymentForm, diff --git a/src/marketplace.css b/src/marketplace.css index e29f991a..0cad9f38 100644 --- a/src/marketplace.css +++ b/src/marketplace.css @@ -28,6 +28,7 @@ --boxShadowLight: 0 2px 4px 0 rgba(0, 0, 0, 0.05); --boxShadowPopup: 0 8px 16px 0 rgba(0, 0, 0, 0.3); --boxShadowPopupLight: 0 3px 6px 0 rgba(0, 0, 0, 0.3); + --boxShadowButton: 0 4px 8px 0 rgba(0, 0, 0, 0.10); /* z-index base levels */ /* small popups on UI should use z-indexes above 50 */ @@ -40,6 +41,11 @@ /* Transitions */ --transitionStyle: ease-in 0.2s; + --transitionStyleButton: ease-in-out 0.1s; + + /* Topbar */ + --topbarHeight: 60px; + --topbarHeightDesktop: 72px; } /* ================ Custom media queries ================ */ @@ -202,6 +208,7 @@ li, } } +button, .buttonFont { font-family: "sofiapro", Helvetica, Arial, sans-serif; font-weight: 600; /* SemiBold */ @@ -303,3 +310,28 @@ input { outline: none; } } + +button { + display: block; + + /* Borders */ + border: none; + border-radius: var(--borderRadius); + + /* Dimensions */ + width: 100%; + padding: 13px 0; + + /* Colors */ + color: var(--matterColorLight); + background-color: var(--marketplaceColor); + + transition: all var(--transitionStyleButton); + + &:hover, + &:active { + cursor: pointer; + background-color: var(--marketplaceColorDark); + box-shadow: var(--boxShadowButton); + } +} diff --git a/src/translations/en.json b/src/translations/en.json index 151c7c6b..7d0f43bf 100644 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -52,8 +52,9 @@ "EditListingPricingForm.perNight": "per night", "EditListingPricingForm.priceRequired": "You need to add a valid price.", "EditListingPricingPanel.title": "How much does it cost?", - "HeroSection.subTitle": "The largest online community to rent music studios", - "HeroSection.title": "Book Studiotime anywhere", + "HeroSection.mobileSearchButtonText": "Search saunas", + "HeroSection.subTitle": "The largest online community to rent saunas in Finland.", + "HeroSection.title": "Book saunas everywhere.", "InboxPage.fetchFailed": "Could not load all messages. Please try again.", "InboxPage.noOrdersFound": "You haven't made any bookings.", "InboxPage.noSalesFound": "Nobody has booked anything from you yet.", @@ -132,8 +133,6 @@ "SalePage.loadingData": "Loading sale data.", "SalePage.rejectButton": "Reject request", "SalePage.title": "Sale details for ${title}.", - "SearchForm.placeholder": "Search by location, e.g. New York", - "SearchForm.search": "Search", "SearchPage.foundResults": "{count, number} {count, plural, one {listing} other {listings}} found.", "SearchPage.loadingResults": "Loading search results...", "SearchPage.loadingResults": "Loading search results...",