yusufipek/quote-machine
1
0
Fork 0
mirror of https://github.com/yusufipk/quote-machine.git synced 2026-09-11 10:46:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

made the box and buttons more responsive

Browse Source
This commit is contained in:
Yusuf İpek
2021-01-26 07:57:11 +03:00
parent 2bd4e8197c
commit ec9de62d7f
2 changed files with 21 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.eslintcache
+1 -1
View File
@@ -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":641,"mtime":1611569283324,"results":"8","hashOfConfig":"7"},{"size":362,"mtime":1611491491707,"results":"9","hashOfConfig":"7"},{"size":3064,"mtime":1611576938230,"results":"10","hashOfConfig":"7"},{"size":313,"mtime":1611576825130,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"zhej84",{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"20","messages":"21","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/home/yusuf/Programming/React/quote-machine/src/index.js",[],"/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",[]] [{"/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":3064,"mtime":1611576938230,"results":"10","hashOfConfig":"7"},{"size":313,"mtime":1611576825130,"results":"11","hashOfConfig":"7"},{"filePath":"12","messages":"13","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1h1r0ga",{"filePath":"14","messages":"15","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"18","messages":"19","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"20","messages":"21","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"/home/yusuf/Programming/React/quote-machine/src/index.js",[],"/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",[]]
src/components/quote-box/quote-box-styles.scss
+20 -4
View File
@@ -2,7 +2,7 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-content: center; align-content: center;
height: 954px; height: 100vh;
#quote-box { #quote-box {
display: flexbox; display: flexbox;
@@ -16,19 +16,19 @@
} }
.writing { .writing {
padding-top: 130px; padding-top: 16vh;
height: 150px; height: 150px;
text-align: center; text-align: center;
} }
#new-quote { #new-quote {
margin-top: 100px; margin-top: 150px;
float: right; float: right;
} }
#tweet { #tweet {
float: right; float: right;
margin-top: 100px; margin-top: 150px;
margin-right: 15px; margin-right: 15px;
} }
@@ -41,4 +41,20 @@
a:active { a:active {
color: white; color: white;
} }
@media only screen and (max-width: 500px) {
#new-quote,
#tweet {
margin-top: -150px;
}
#tweet {
margin-right: 115px;
}
}
@media only screen and (max-width: 350px) {
.writing {
h3 {
font-size: 22px;
}
}
}
} }