freeCodeCamp.org-Front-End-Dev-Libraries/Random-Quote-Machine
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Styling updated for small devices

Browse Source
This commit is contained in:
Manish 2022-06-30 12:24:46 +10:00
parent e3b4870858
commit c18016aaa8
2 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
random-quote-machine/public/index.html
View File

@ -36,5 +36,6 @@
To begin the development, run `npm start` or `yarn start`. To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`. To create a production bundle, use `npm run build` or `yarn build`.
--> -->
<script src="https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js"></script>
</body> </body>
</html> </html>

4
random-quote-machine/src/App.js
View File

@ -57,14 +57,14 @@ class App extends React.Component {
</p> </p>
<div className="row justify-content-center"> <div className="row justify-content-center">
<button <button
className={`btn col-5 col-sm-5 col-md-4 col-lg-3 col-xl-2 ${this.state.randomBackgroundColorClass}`} className={`btn col-10 mb-2 mb-sm-0 col-sm-5 col-md-4 col-lg-3 col-xl-2 ${this.state.randomBackgroundColorClass}`}
id="new-quote" id="new-quote"
onClick={this.handleNewQuote} onClick={this.handleNewQuote}
> >
<FontAwesomeIcon icon={faShuffle} /> Random Quote <FontAwesomeIcon icon={faShuffle} /> Random Quote
</button> </button>
<a <a
className="btn bg-color-twitter col-5 col-sm-5 col-md-4 col-lg-3 col-xl-2 offset-1" className="btn bg-color-twitter col-10 col-sm-5 col-md-4 col-lg-3 col-xl-2 offset-sm-1"
href={`https://twitter.com/intent/tweet?text="${encodeURI( href={`https://twitter.com/intent/tweet?text="${encodeURI(
`${this.state.randomQuote}"\n- By ${this.state.randomAuthor}\n` `${this.state.randomQuote}"\n- By ${this.state.randomAuthor}\n`
)}&hashtags=quotes,freeCodeCamp`} )}&hashtags=quotes,freeCodeCamp`}