implement a more responsive design
This commit is contained in:
parent
122f2b7f44
commit
956d70e60f
1 changed files with 36 additions and 1 deletions
37
style.css
37
style.css
|
@ -1,5 +1,4 @@
|
||||||
body {
|
body {
|
||||||
min-width: 750px;
|
|
||||||
margin-top: 106px;
|
margin-top: 106px;
|
||||||
position: relative;
|
position: relative;
|
||||||
font-family: Roboto;
|
font-family: Roboto;
|
||||||
|
@ -89,3 +88,39 @@ body {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.card-link {
|
||||||
|
margin-left: 0px !important;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.container {
|
||||||
|
max-width: none;
|
||||||
|
}
|
||||||
|
.list-display {
|
||||||
|
width: auto;
|
||||||
|
padding-left: 20px;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 510px) {
|
||||||
|
.social-button {
|
||||||
|
width: auto;
|
||||||
|
overflow: hidden;
|
||||||
|
text-indent: -99999px;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
.project-image {
|
||||||
|
right: -18px;
|
||||||
|
top: -18px;
|
||||||
|
width: 50px;
|
||||||
|
}
|
||||||
|
.project-status {
|
||||||
|
position: absolute;
|
||||||
|
right: 10px;
|
||||||
|
bottom: 5px;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in a new issue