From d4526e20f2fffadd91714a4e174775ddab8f9892 Mon Sep 17 00:00:00 2001 From: saman bb Date: Fri, 22 Mar 2013 19:07:55 -0400 Subject: [PATCH] layout fixes. --- css/app.css | 31 +++++++++++++++++++------------ data/core.yaml | 3 ++- data/locales.js | 3 ++- js/id/ui/commit.js | 4 ++-- js/id/ui/preset.js | 2 +- js/id/ui/restore.js | 16 ++++++++++++---- 6 files changed, 38 insertions(+), 21 deletions(-) diff --git a/css/app.css b/css/app.css index 4f356159d..c45e51ab5 100644 --- a/css/app.css +++ b/css/app.css @@ -71,11 +71,9 @@ h4:last-child { margin-bottom: 0;} h3 { font-size: 16px; - line-height: 1.3333; + line-height: 1.25; font-weight: bold; margin-bottom: 10px; - text-overflow: ellipsis; - white-space: nowrap; } h4 { @@ -389,10 +387,10 @@ button.action:hover { background: #597BE7; } -button.delete { +button.cancel { background-color: #ff7070; } -button.delete:hover { +button.cancel:hover { background-color: #ef5454; } @@ -573,11 +571,16 @@ a.selected:hover .toggle.icon { background-position: -40px -180px;} .header { border-bottom: 1px solid #ccc; z-index: 2; + height: 60px; position: relative; } .header h3 { + margin-right: 40px; margin-bottom: 0; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; } .modal > button, @@ -593,7 +596,7 @@ a.selected:hover .toggle.icon { background-position: -40px -180px;} } .modal > button { - height: 61px; + height: 59px; z-index: 3; } @@ -636,6 +639,9 @@ a.selected:hover .toggle.icon { background-position: -40px -180px;} .inspector-wrap .header button.preset-reset { border-right: 1px solid #CCC; position: relative; +} + +.inspector-wrap .header button.preset-reset { width: 60px; } @@ -669,7 +675,7 @@ a.selected:hover .toggle.icon { background-position: -40px -180px;} .pane:last-child .header h3 { position: absolute; left: 60px; - right: 40px; + right: 0px; } .inspector-toggle { @@ -927,7 +933,7 @@ a.selected:hover .toggle.icon { background-position: -40px -180px;} display: inline-block; } -.preset-field .preset-label { +.form-label { font-weight: bold; border: 1px solid #cfcfcf; padding: 5px 10px; @@ -1004,12 +1010,13 @@ input[type=number] { float: left; height: 100%; width: 50%; - border: 1px solid #CCC; + border-top: 1px solid #CCC; + border-bottom: 1px solid #CCC; border-radius: 0; border-left: 0; } -.spin-control button.descend { +.spin-control button.decrement { border-bottom-right-radius: 4px; } @@ -1846,7 +1853,7 @@ div.typeahead a:first-child { ------------------------------------------------------- */ .modal a.success-action { - height: 180px; + height: 170px; border-bottom: 1px solid #CCC; text-align: center; -webkit-transition: all 200ms; @@ -1868,7 +1875,7 @@ a.success-action:before { height: 100px; width: 100px; margin: auto; - margin-bottom: 20px; + margin-bottom: 10px; background:transparent url(../img/sprite.png) no-repeat 0px -220px; } diff --git a/data/core.yaml b/data/core.yaml index d8ef0f31e..5e27328a4 100644 --- a/data/core.yaml +++ b/data/core.yaml @@ -150,7 +150,8 @@ en: fix_misalignment: Fix misalignment reset: reset restore: - description: "You have unsaved changes from a previous editing session. Do you wish to restore these changes?" + heading: You have unsaved changes + description: "Do you wish to restore changes from a previous editing session?" restore: Restore reset: Reset save: diff --git a/data/locales.js b/data/locales.js index 20146edcc..b14eb867b 100644 --- a/data/locales.js +++ b/data/locales.js @@ -188,7 +188,8 @@ locale.en = { "reset": "reset" }, "restore": { - "description": "You have unsaved changes from a previous editing session. Do you wish to restore these changes?", + "heading": "You have unsaved changes", + "description": "Do you wish to restore changes from a previous editing session?", "restore": "Restore", "reset": "Reset" }, diff --git a/js/id/ui/commit.js b/js/id/ui/commit.js index 8bba39cb2..8a787fc7a 100644 --- a/js/id/ui/commit.js +++ b/js/id/ui/commit.js @@ -38,8 +38,8 @@ iD.ui.Commit = function(context) { var commentSection = body.append('div') .attr('class', 'modal-section preset-field'); - commentSection.append('h4') - .attr('for','input-commit-note') + commentSection.append('label') + .attr('class','form-label') .text(t('commit.message_label')); var commentField = commentSection diff --git a/js/id/ui/preset.js b/js/id/ui/preset.js index 062a94b8c..bb20ff827 100644 --- a/js/id/ui/preset.js +++ b/js/id/ui/preset.js @@ -69,7 +69,7 @@ iD.ui.preset = function(context, entity) { }); sections.append('label') - .attr('class', 'preset-label') + .attr('class', 'form-label') .attr('for', function(field) { return 'preset-input-' + field.id; }) .text(function(field) { return field.label(); }) .append('button') diff --git a/js/id/ui/restore.js b/js/id/ui/restore.js index a7554c88d..b1dd64e33 100644 --- a/js/id/ui/restore.js +++ b/js/id/ui/restore.js @@ -6,21 +6,29 @@ iD.ui.Restore = function(context) { var modal = iD.ui.modal(selection); modal.select('.modal') - .attr('class', 'modal-splash modal fillL'); + .attr('class', 'modal fillL col6'); var introModal = modal.select('.content'); + introModal.attr('class','cf'); + introModal.append('div') .attr('class', 'modal-section header') .append('h3') - .text(t('restore.description')); + .text(t('restore.heading')); + + introModal.append('div') + .attr('class','modal-section') + .append('p') + .text(t('restore.description')); + var buttonWrap = introModal.append('div') - .attr('class', 'modal-section cf col12'); + .attr('class', 'modal-section col12'); var buttons = buttonWrap .append('div') - .attr('class', 'button-wrap joined col6'); + .attr('class', 'button-wrap joined col4'); var restore = buttons.append('button') .attr('class', 'save action button col6')