diff --git a/src/components/Molecules/Logos/Logos.js b/src/components/Molecules/LogoLinked/LogoLinked.js similarity index 81% rename from src/components/Molecules/Logos/Logos.js rename to src/components/Molecules/LogoLinked/LogoLinked.js index d5b53742c..2637461d9 100644 --- a/src/components/Molecules/Logos/Logos.js +++ b/src/components/Molecules/LogoLinked/LogoLinked.js @@ -5,9 +5,9 @@ import styled, { css } from 'styled-components'; import Logo from '../../Atoms/Logo/Logo'; const TitleLabel = styled.span` - line-height: 0; + line-height: 0; font-size: 0; - color: transparent; + color: transparent; `; const LogoLink = styled.a` @@ -25,8 +25,8 @@ const LogoLink = styled.a` `} `; -const Logos = ({ - campaign = 'Comic Relief', animateRotate = false, sizeSm, sizeMd +const LogoLinked = ({ + campaign = 'Comic Relief', title = 'Go to Comic Relief homepage', animateRotate = false, sizeSm, sizeMd }) => { if (campaign === 'Sport Relief Gameon') { return ( @@ -62,18 +62,19 @@ const Logos = ({ } return ( - - - Go to Comic Relief homepage + + + {title} ); }; -Logos.propTypes = { +LogoLinked.propTypes = { campaign: PropTypes.string, animateRotate: PropTypes.bool, + title: PropTypes.string, sizeSm: PropTypes.string, sizeMd: PropTypes.string }; -export default Logos; +export default LogoLinked; diff --git a/src/components/Molecules/LogoLinked/LogoLinked.md b/src/components/Molecules/LogoLinked/LogoLinked.md new file mode 100644 index 000000000..8485806d7 --- /dev/null +++ b/src/components/Molecules/LogoLinked/LogoLinked.md @@ -0,0 +1,11 @@ +# Comic Relief Logo without animation + +```js + +``` + +# Comic Relief Logo with hover animation and custom hovertext + +```js + +``` diff --git a/src/components/Molecules/Logos/Logos.md b/src/components/Molecules/Logos/Logos.md deleted file mode 100644 index 7fa49af5e..000000000 --- a/src/components/Molecules/Logos/Logos.md +++ /dev/null @@ -1,5 +0,0 @@ -# Comic Relief Logo - -```js - -``` \ No newline at end of file diff --git a/src/components/Organisms/Header/Header.js b/src/components/Organisms/Header/Header.js index c1d0253d9..0f6da72cc 100644 --- a/src/components/Organisms/Header/Header.js +++ b/src/components/Organisms/Header/Header.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; -import Logos from '../../Molecules/Logos/Logos'; +import LogoLinked from '../../Molecules/LogoLinked/LogoLinked'; import MainNav from './Nav/Nav'; import { Brand, HeaderWrapper, InnerWrapper, MetaIcons @@ -13,7 +13,7 @@ const Header = ({ - + {metaIcons} diff --git a/src/components/Organisms/Header2025/Header2025.js b/src/components/Organisms/Header2025/Header2025.js index 6913c4e05..bb86e6652 100644 --- a/src/components/Organisms/Header2025/Header2025.js +++ b/src/components/Organisms/Header2025/Header2025.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; -import Logos from '../../Molecules/Logos/Logos'; +import LogoLinked from '../../Molecules/LogoLinked/LogoLinked'; import HeaderNav2025 from './HeaderNav2025/HeaderNav2025'; import { Brand, Header2025Wrapper, InnerWrapper, @@ -15,7 +15,7 @@ const Header2025 = ({ -