From c5d5f1ae46a5f9af220ae540bc6cd51d83c3706d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Yusuf=20=C4=B0pek?= Date: Mon, 25 Jan 2021 13:39:52 +0300 Subject: [PATCH] added transition, tweet button --- .eslintcache | 2 +- src/App.js | 10 ++++-- src/components/button/button.jsx | 9 +++-- .../quote-box/quote-box-styles.scss | 22 +++++++++++-- src/components/quote-box/quote-box.jsx | 33 +++++++++++++++++-- 5 files changed, 66 insertions(+), 10 deletions(-) diff --git a/.eslintcache b/.eslintcache index 6068f6d..a892b9e 100644 --- a/.eslintcache +++ b/.eslintcache @@ -1 +1 @@ -[{"/home/yusuf/Programming/React/quote-machine/src/index.js":"1","/home/yusuf/Programming/React/quote-machine/src/App.js":"2","/home/yusuf/Programming/React/quote-machine/src/reportWebVitals.js":"3","/home/yusuf/Programming/React/quote-machine/src/components/quote-box/quote-box.jsx":"4","/home/yusuf/Programming/React/quote-machine/src/components/button/button.jsx":"5"},{"size":500,"mtime":1611491491707,"results":"6","hashOfConfig":"7"},{"size":542,"mtime":1611519261709,"results":"8","hashOfConfig":"7"},{"size":362,"mtime":1611491491707,"results":"9","hashOfConfig":"7"},{"size":2105,"mtime":1611519235196,"results":"10","hashOfConfig":"7"},{"size":243,"mtime":1611512231156,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"14"},"1h1r0ga",{"filePath":"15","messages":"16","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"17","messages":"18","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"14"},{"filePath":"19","messages":"20","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"21","messages":"22","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"14"},"/home/yusuf/Programming/React/quote-machine/src/index.js",[],["23","24"],"/home/yusuf/Programming/React/quote-machine/src/App.js",[],"/home/yusuf/Programming/React/quote-machine/src/reportWebVitals.js",[],"/home/yusuf/Programming/React/quote-machine/src/components/quote-box/quote-box.jsx",[],"/home/yusuf/Programming/React/quote-machine/src/components/button/button.jsx",[],{"ruleId":"25","replacedBy":"26"},{"ruleId":"27","replacedBy":"28"},"no-native-reassign",["29"],"no-negated-in-lhs",["30"],"no-global-assign","no-unsafe-negation"] \ No newline at end of file +[{"/home/yusuf/Programming/React/quote-machine/src/index.js":"1","/home/yusuf/Programming/React/quote-machine/src/App.js":"2","/home/yusuf/Programming/React/quote-machine/src/reportWebVitals.js":"3","/home/yusuf/Programming/React/quote-machine/src/components/quote-box/quote-box.jsx":"4","/home/yusuf/Programming/React/quote-machine/src/components/button/button.jsx":"5"},{"size":500,"mtime":1611491491707,"results":"6","hashOfConfig":"7"},{"size":641,"mtime":1611569283324,"results":"8","hashOfConfig":"7"},{"size":362,"mtime":1611491491707,"results":"9","hashOfConfig":"7"},{"size":2909,"mtime":1611571160661,"results":"10","hashOfConfig":"7"},{"size":313,"mtime":1611570503827,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"14"},"1h1r0ga",{"filePath":"15","messages":"16","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"17","messages":"18","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"14"},{"filePath":"19","messages":"20","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"21","messages":"22","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"14"},"/home/yusuf/Programming/React/quote-machine/src/index.js",[],["23","24"],"/home/yusuf/Programming/React/quote-machine/src/App.js",[],"/home/yusuf/Programming/React/quote-machine/src/reportWebVitals.js",[],"/home/yusuf/Programming/React/quote-machine/src/components/quote-box/quote-box.jsx",[],"/home/yusuf/Programming/React/quote-machine/src/components/button/button.jsx",[],{"ruleId":"25","replacedBy":"26"},{"ruleId":"27","replacedBy":"28"},"no-native-reassign",["29"],"no-negated-in-lhs",["30"],"no-global-assign","no-unsafe-negation"] \ No newline at end of file diff --git a/src/App.js b/src/App.js index b15ad98..cb73bc1 100644 --- a/src/App.js +++ b/src/App.js @@ -6,7 +6,7 @@ class App extends Component { constructor() { super(); this.state = { - backG: null, + backG: "#2a9d8f", }; } @@ -19,7 +19,13 @@ class App extends Component { render() { return ( -
+
); diff --git a/src/components/button/button.jsx b/src/components/button/button.jsx index 764d5c5..7217afc 100644 --- a/src/components/button/button.jsx +++ b/src/components/button/button.jsx @@ -3,8 +3,13 @@ import "bootstrap/dist/css/bootstrap.min.css"; export const QuoteButton = (props) => { return ( - ); }; diff --git a/src/components/quote-box/quote-box-styles.scss b/src/components/quote-box/quote-box-styles.scss index 5dd579c..ce0fc9f 100644 --- a/src/components/quote-box/quote-box-styles.scss +++ b/src/components/quote-box/quote-box-styles.scss @@ -17,11 +17,29 @@ } .writing { - padding-top: 100px; + padding-top: 130px; + height: 150px; text-align: center; } - #button { + #new-quote { + margin-top: 80px; float: right; } + + #tweet { + float: right; + margin-top: 80px; + margin-right: 15px; + } + + a:link { + color: white; + } + a:visited { + color: white; + } /* visited link */ + a:active { + color: white; + } } diff --git a/src/components/quote-box/quote-box.jsx b/src/components/quote-box/quote-box.jsx index f8bc96e..479ca0f 100644 --- a/src/components/quote-box/quote-box.jsx +++ b/src/components/quote-box/quote-box.jsx @@ -65,14 +65,41 @@ class QuoteBox extends React.Component {

{this.state.displayQuote}

{this.state.displayAuthor}

-
- +
+ +
+
+ + Tweet + + } + variant="primary" + />