diff --git a/src/components/Designer.vue b/src/components/Designer.vue index 63804a4..8418309 100644 --- a/src/components/Designer.vue +++ b/src/components/Designer.vue @@ -122,13 +122,20 @@ export default { margin-bottom: 0; } - width: 50%; + width: 80%; + max-width: 800px; margin: 0 auto; padding: 25px; + + @media (max-width: 680px) { + width: 100%; + padding: 25px 0; + } + } .profile-container { - width: 900px; + width: 915px; max-width: 100%; margin: 0 auto; resize: horizontal; @@ -141,6 +148,7 @@ export default { .profile { position: relative; width: 100%; + border-radius: 10px; padding-bottom: 62.5%; background-color: red; } @@ -182,6 +190,7 @@ export default { .flex-item { max-width: 100%; + margin: 0 15px; } #preview { @@ -190,6 +199,7 @@ export default { } #commands { min-width: 300px; + flex-grow: 1; align-self: flex-start; .command {