diff --git a/src/public/css/offers.css b/src/public/css/offers.css index 782859f..f195e0c 100644 --- a/src/public/css/offers.css +++ b/src/public/css/offers.css @@ -1,6 +1,5 @@ @media (max-width: 768px) { #offers-root { - width: 100%; margin: 10px 10px; } @@ -11,6 +10,19 @@ #premium-selector-area { width: 60px; } + + #create-offer-controls > * { + width: 100%; + } + + .checkbox-row { + width: 90%; + } + + .checkbox-row > input[type='checkbox'] { + flex-shrink: 0; + margin-left: 5%; + } } @media (min-width: 769px) { @@ -26,13 +38,25 @@ #premium-selector-area { width: 100px; } + + #create-offer-controls > * { + margin-left: 15%; + margin-right: 15%; + width: 70%; + } + + .checkbox-row { + width: 60%; + } + + .checkbox-row > input[type='checkbox'] { + flex-shrink: 0; + margin-left: 20%; + } } #create-offer-controls > * { text-align: center; - margin-left: 15%; - margin-right: 15%; - width: 70%; } #close-offer-controls-area { @@ -120,18 +144,20 @@ .checkbox-row { display: flex; - width: 25%; margin-left: auto; margin-right: auto; } .checkbox-row > label { text-align: start; + margin-right: auto; margin-left: 0; align-content: center; } .checkbox-row > input[type='checkbox'] { - margin-left: 20%; + flex-shrink: 0; + margin-right: 1em; height: 2em; width: 2em; } + diff --git a/src/public/css/seca.css b/src/public/css/seca.css index 8214815..86da51f 100644 --- a/src/public/css/seca.css +++ b/src/public/css/seca.css @@ -21,7 +21,7 @@ @media (min-width: 769px) { html { - font-size: 20px; + font-size: 16px; } .font-medium { diff --git a/src/views/offers.ejs b/src/views/offers.ejs index 96c91e2..7432b8b 100644 --- a/src/views/offers.ejs +++ b/src/views/offers.ejs @@ -116,37 +116,45 @@

-

¿Quién puede ver la oferta?

- - - +

¿Quién puede ver la oferta?

+
+ +
+
+ +
+
+ +
- +

Extras

+
+ +