diff --git a/public/assets/css/allStyle.css b/public/assets/css/allStyle.css index c09df932..5ae8b256 100644 --- a/public/assets/css/allStyle.css +++ b/public/assets/css/allStyle.css @@ -25,6 +25,18 @@ width: 22%; } +footer { + width: 100%; + margin-bottom: 2px; + padding-bottom: 2px; + border-bottom: 1px lightgrey solid; + margin-top: 2px; + padding-top: 2px; + border-top: 1px lightgrey solid; + text-align: center; + color: grey; +} + /* panels */ .panel { @@ -82,4 +94,58 @@ h4 { .toggle-link { float: right; +} + +@media (max-width: 1250px) { + + .wrapper { + margin-left: 10%; + width:80%; + } + +} + +@media (max-width: 1000px) { + + .wrapper { + margin-left: 10%; + width:80%; + } + + .main { + float: none; + width: 100%; + margin-right: 0px; + padding-right: 0px; + border-right: 0px; + margin-bottom: 5px; + } + + .sidebar { + float: none; + width: 100%; + } + +} + +@media (max-width: 750px ) { + .col-left, .col-right { + float: none; + margin: 0px; + padding: 0px; + width: 100%; + } + + .col-right { + padding-top: 20px; + } +} + +@media (max-width: 475px) { + + .wrapper { + margin: 0px; + width: 100%; + } + } \ No newline at end of file diff --git a/public/assets/css/componentStyle.css b/public/assets/css/componentStyle.css index 0072444a..f5914eac 100644 --- a/public/assets/css/componentStyle.css +++ b/public/assets/css/componentStyle.css @@ -25,24 +25,6 @@ margin: 5px 15px 5px 0px; } -/* meme */ -canvas { - background-color: white; - width: 100%; - height: auto; -} - -/* publish */ -#drop-zone { - border: 1px dashed lightgrey; - padding: 1em; - height: 6em; -} - -#image-preview { - display: none; -} - /* all claims */ .all-claims-item { @@ -58,21 +40,23 @@ canvas { margin: 5px 30px 5px 0px; } -/* footer */ - -footer { - width: 100%; - margin-bottom: 2px; - padding-bottom: 2px; - border-bottom: 1px lightgrey solid; - margin-top: 2px; - padding-top: 2px; - border-top: 1px lightgrey solid; - text-align: center; - color: grey; +/* publish */ +#drop-zone { + border: 1px dashed lightgrey; + padding: 1em; + height: 6em; } -/* meme fodder */ +#image-preview { + display: none; +} + +/* meme */ +canvas { + background-color: white; + width: 100%; + height: auto; +} .meme-fodder-img { width: 21%; diff --git a/views/partials/publish.handlebars b/views/partials/publish.handlebars index 2d61a2b5..5daea311 100644 --- a/views/partials/publish.handlebars +++ b/views/partials/publish.handlebars @@ -15,13 +15,11 @@

-
-

-

+ +