X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/1ba4fdd3e1553c271b07c9692e185b00ce95a470..901de4a56a58b4967eec5f2a20e241e3d1c088e9:/app/assets/stylesheets/common.css.scss?ds=sidebyside diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss index edf6eb85f..6eecae577 100644 --- a/app/assets/stylesheets/common.css.scss +++ b/app/assets/stylesheets/common.css.scss @@ -73,10 +73,24 @@ abbr, acronym { .col11 { float:left; width:91.6666%; } .col12 { width:100%; } +.margin0 { margin-left:04.1666%; } +.margin1 { margin-left:08.3333%; } +.margin2 { margin-left:16.6666%; } +.margin3 { margin-left:25.0000%; } +.margin4 { margin-left:33.3333%; } +.margin5 { margin-left:41.6666%; } +.margin6 { margin-left:50.0000%; } +.margin7 { margin-left:58.3333%; } +.margin8 { margin-left:66.6666%; } +.margin9 { margin-left:75.0000%; } +.margin10 { margin-left:83.3333%; } +.margin11 { margin-left:91.6666%; } +.margin12 { margin-left:100.0000%; } .pad1 { padding: $lineheight/2; } .pad2 { padding: $lineheight; } +.fillL { background-color: white; } /* Default rules for the body of every page */ * { @@ -1031,16 +1045,65 @@ ul.results-list li { border-bottom: 1px solid #ccc; } border-left: 1px solid #ccc; } +/* Overrides for pages that use new layout conventions */ +.user-new, +.user-create, +.user-terms, +.user-confirm, .site-copyright, -.site-welcome, -.user-new { +.site-welcome { + #content { + max-width: 740px; + } +} + +.user-new, +.user-create, +.user-terms, +.user-confirm { .content-heading { + height: 200px; } +} +.user-new, +.user-create, +.user-terms { #content { + padding: 0; } } +.header-illustration { + background-position: 0 0; + background-repeat: no-repeat; + position: absolute; + height: 200px; + width: 100%; + left: 0; + bottom: 0; + + &.new-user-main { + background-image: image-url("sign-up-illustration.png"); + } + + &.confirm-main { + background-image: image-url("confirm-illustration.png"); + } + + &.new-user-arm { + height: 110px; + width: 130px; + left: 260px; + top: 160px; + background-image: image-url("sign-up-illustration-arm.png"); + } +} + +@media only screen and (max-width:770px) { + .header-illustration.new-user-arm { display: none;} +} + .wrapper { margin-left: 184px; border-left: 1px solid #ccc; @@ -1096,6 +1159,7 @@ ul.results-list li { border-bottom: 1px solid #ccc; } position: relative; padding: $lineheight; background: $offwhite; + z-index: 2; h1, h2 { margin-bottom: $lineheight/2; line-height: 100%; @@ -1454,7 +1518,7 @@ ul.results-list li { border-bottom: 1px solid #ccc; } float: left; } -/* Rules for the login page */ +/* Rules for the log in page */ #login_openid_buttons { margin-bottom: 0; @@ -1467,7 +1531,7 @@ ul.results-list li { border-bottom: 1px solid #ccc; } /* Rules for the account confirmation page */ -#terms { +.user-terms { .legale { border: 1px solid #ccc; padding: $lineheight; @@ -1489,28 +1553,12 @@ ul.results-list li { border-bottom: 1px solid #ccc; } } } - form.sign { - input[type=submit] { - float: left; - } - #decline { - background: $grey; - &:hover { - background: darken($grey, $hovercolor); - } + #decline { + background: $lightblue; + &:hover { + background: darken($lightblue, $hovercolor); } } - fieldset { - margin-bottom: $lineheight; - } - #contributorGuidance { - background-color: $offwhite; - border-radius: 4px; - -moz-border-radius: 4px; - } - .signing-buttons { - height: 50px; - } } /* Rules for the account settings page */ @@ -1661,7 +1709,17 @@ ul.results-list li { border-bottom: 1px solid #ccc; } .field_with_errors { padding: 2px; background-color: #ff7070; - display: table; + display: inline-block; +} + +.formError { + display: inline-block; + padding: 5px 10px; + margin-top: 5px; + border-radius: 4px; + font-size: 12px; + color: #fff; + background-color: #ff7070; } /* Rules for rails validation error boxes */ @@ -2225,6 +2283,10 @@ a.button { .site-welcome { .center { text-align: center; + .sprite { + float: none; + margin: auto; + } } .drop { @@ -2234,9 +2296,19 @@ a.button { .sprite { background-image: image-url("welcome-sprite.png"); background-size: 500px 250px; - display: inline-block; + display: block; + float: left; } + .icon-list { + padding-bottom: 20px; + div { + margin-bottom: 10px; + p { + padding-top: 10px; + } + } + } .sprite.small { width: 50px; height: 50px; @@ -2259,7 +2331,7 @@ a.button { background-position: -150px 0; } - .sprite.changeset { + .sprite.tag { background-position: -200px 0; } @@ -2272,13 +2344,9 @@ a.button { } .start-mapping { - background: #EB6F67; - color: #FFF; margin: auto; cursor: pointer; border: none; - border-radius: 5px; - border-bottom: 1px solid #A53931; padding: 20px 40px; font-size: 30px; text-decoration: none;