CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-02-12 16:52:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Begin making UI adapt correctly to scaled text sizes (re: #7965)

Browse Source
This commit is contained in:
Quincy Morgan
2020-09-09 16:11:46 -04:00
parent 59f45b39fe
commit e6703cb1cc
8 changed files with 68 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
css/80_app.css
View File

@@ -172,8 +172,7 @@ input[type=email] {
background-color: #fff;
color: #333;
border: 1px solid #ccc;
padding: 5px 20px 5px 10px;
height: 30px;
padding: 0px 20px 0px 10px;
border-radius: 4px;
text-overflow: ellipsis;
overflow: auto;
@@ -204,16 +203,14 @@ input.disabled {
input[type="checkbox"],
input[type="radio"] {
float: left;
width: 14px;
height: 14px;
margin-right: 5px;
margin-top: 3px;
cursor: pointer;
vertical-align: middle;
}
.ideditor[dir='rtl'] input[type="checkbox"],
.ideditor[dir='rtl'] input[type="radio"] {
float: right;
margin-left: 5px;
margin-right: 0;
}
@@ -303,14 +300,12 @@ li.hide {
------------------------------------------------------- */
button {
text-align: center;
line-height: 20px;
border: 0;
background: #fff;
font-weight: bold;
color: #333;
font-size: 12px;
display: inline-block;
height: 40px;
border-radius: 4px;
}
@@ -402,7 +397,7 @@ button[disabled].action {
/* Icons
------------------------------------------------------- */
.icon {
vertical-align: top;
vertical-align: middle;
width: 20px;
height: 20px;
}
@@ -423,8 +418,9 @@ button.disabled .icon.operation use,
.icon.inline {
vertical-align: text-top;
width: 14px;
height: 14px;
display: inline-block;
width: 1.17em;
height: 1.17em;
margin: 0px 3px;
}
@@ -578,7 +574,7 @@ button.save .count {
text-align: center;
}
.help-pane svg.icon.pre-text.add-note,
.help-pane svg.icon.inline.add-note,
button.add-note svg.icon {
height: 15px;
width: 15px;
@@ -595,7 +591,7 @@ button.add-note svg.icon {
margin-left: 4px;
margin-right: unset;
}
.help-pane svg.icon.pre-text.add-note {
.help-pane svg.icon.inline.add-note {
margin-left: 3px;
margin-right: 3px;
}
@@ -937,7 +933,6 @@ a.hide-toggle {
background-color: #ccc;
margin: 30px auto;
padding: 5px;
height: auto;
min-height: 40px;
}
@@ -1382,7 +1377,6 @@ a.hide-toggle {
display: flex;
flex-flow: row nowrap;
flex: 1 1 100%;
height: 30px;
position: relative;
font-weight: bold;
color: #333;
@@ -1395,10 +1389,10 @@ a.hide-toggle {
overflow: hidden;
text-overflow: ellipsis;
flex: 1 1 auto;
padding: 5px 0 5px 10px;
padding: 5px 0 4px 10px;
}
.ideditor[dir='rtl'] .field-label .label-text {
padding: 5px 10px 5px 0;
padding: 5px 10px 4px 0;
}
.field-label .label-text span {
white-space: nowrap;
@@ -1435,6 +1429,7 @@ a.hide-toggle {
}
.field-label .icon {
opacity: .5;
}
.field-label .modified-icon,
@@ -1484,7 +1479,6 @@ a.hide-toggle {
/* Buttons inside fields */
.form-field-button {
flex: 0 0 auto;
height: 30px;
width: 32px;
position: relative;
background-color: #fff;
@@ -1816,9 +1810,9 @@ a.hide-toggle {
flex: 1 1 auto;
display: flex;
flex-flow: row nowrap;
align-items: center;
width: 100%;
padding: 5px 10px;
height: 30px;
background-color: #fff;
color: #7092ff;
cursor: pointer;
@@ -2189,7 +2183,7 @@ div.combobox {
.combobox-caret {
display: inline-block;
position: relative;
height: 30px;
height: 100%;
width: 30px !important;
margin-left: -30px;
vertical-align: top;
@@ -2344,7 +2338,6 @@ div.combobox {
}
.form-field-input-wrap .label {
height: 30px;
background: #f6f6f6;
padding: 5px 10px;
}
@@ -2431,7 +2424,6 @@ button.raw-tag-option svg.icon {
}
.tag-row input {
height: 31px;
border: 0;
border-radius: 0;
border-bottom: 1px solid #ccc;
@@ -2469,8 +2461,7 @@ button.raw-tag-option svg.icon {
border-top: 1px solid #ccc;
}
.tag-row button {
flex: 0 0 32px;
height: 31px;
flex: 0 0 auto;
width: 32px;
border: 1px solid #ccc;
border-top-width: 0;
@@ -2939,9 +2930,13 @@ input.key-trap {
right: auto;
}
.map-control {
position: relative;
}
.map-control > button {
position: relative;
width: 40px;
height: 40px;
background: rgba(0,0,0,.5);
border-radius: 0;
pointer-events: auto;
@@ -3045,11 +3040,6 @@ div.full-screen > button:active {
/* Background / Map Data Settings
------------------------------------------------------- */
.map-data-control,
.background-control {
position: relative;
}
.imagery-faq {
margin-bottom: 10px;
white-space: nowrap;
@@ -3062,7 +3052,6 @@ div.full-screen > button:active {
}
.layer-list > li {
height: 30px;
background-color: #fff;
color: #7092ff;
position: relative;
@@ -3121,6 +3110,7 @@ div.full-screen > button:active {
cursor: pointer;
flex: 1 1 auto;
display: flex;
align-items: center;
overflow: hidden;
}
@@ -3141,7 +3131,6 @@ div.full-screen > button:active {
.map-data-pane .layer-list button,
.background-pane .layer-list button {
height: 100%;
border-left: 1px solid #ccc;
border-radius: 0;
padding-left: 4px;
@@ -3637,6 +3626,7 @@ li.issue-fix-item:not(.actionable) .fix-icon {
float: left;
display: block;
width: 20%;
height: 40px;
position: relative;
background-color: transparent;
}
@@ -3728,7 +3718,6 @@ li.issue-fix-item:not(.actionable) .fix-icon {
flex-flow: row nowrap;
justify-content: space-between;
border-bottom: 1px solid #ccc;
height: 60px;
}
.pane-heading h2 {
@@ -3737,7 +3726,6 @@ li.issue-fix-item:not(.actionable) .fix-icon {
.pane-heading button {
width: 40px;
height: 100%;
border-radius: 0;
}
@@ -3764,11 +3752,11 @@ li.issue-fix-item:not(.actionable) .fix-icon {
margin-bottom: 20px;
}
.help-pane .left-content .icon.pre-text {
vertical-align: text-top;
.help-pane .left-content .icon.inline {
margin-right: 0;
margin-left: 0;
display: inline-block;
height: 1.34em;
width: 1.34em;
}
.help-pane .toc {
@@ -5606,7 +5594,6 @@ li.hide + li.version .badge .tooltip .popover-arrow {
.huge-modal-button {
width: 100%;
height: auto;
padding: 20px;
}