Fix font-family/font-size in form elements (#1489936)

Aleksander Machniak

2014-06-28 ab985fdaede17b312550651271d0fc7217015204

 skins/larry/styles.css

@@ -35,6 +35,29 @@
  border: 0;
}

.voice {
   position: absolute;
   border: 0;
   clip: rect(0 0 0 0);
   width: 1px;
   height: 1px;
   margin: -1px;
   padding: 0;
   overflow: hidden;
}

html.mozilla select {
   padding: 2px 1px;
}

input,
textarea,
select,
button {
   font-family: inherit;
   font-size: inherit;
}

input[type="text"],
input[type="password"],
textarea {
@@ -50,8 +73,6 @@

input[type="text"]:focus,
input[type="password"]:focus,
input[type="text"]:required,
input[type="password"]:required,
input.button:focus,
textarea:focus {
   border-color: #4787b1;
@@ -60,6 +81,11 @@
   -webkit-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
   -o-box-shadow: 0 0 5px 2px rgba(71,135,177, 0.9);
   outline: none;
}

input[type="text"]:required,
input[type="password"]:required {
   border-color: #4787b1;
}

input.placeholder,
@@ -312,6 +338,16 @@
   border-left-color: #555;
}

.buttongroup a.button:focus,
.buttongroup a.button.selected:focus {
   background: #f2f2f2;
   background: -moz-linear-gradient(top, #49b3d2 0, #66bcd9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#49b3d2), color-stop(100%,#66bcd9));
   background: -o-linear-gradient(top, #49b3d2 0, #66bcd9 100%);
   background: -ms-linear-gradient(top, #49b3d2 0, #66bcd9 100%);
   background: linear-gradient(top, #49b3d2 0, #66bcd9 100%);
}

.pagenav a.button {
   padding: 1px 3px;
   height: 16px;
@@ -325,6 +361,7 @@
   margin-bottom: 0;
}

a.button span.icon,
.pagenav a.button span.inner {
   display: inline-block;
   width: 16px;
@@ -334,54 +371,75 @@
   background: url(images/buttons.png) -6px -211px no-repeat;
}

a.button.prevpage span.icon,
.pagenav a.prevpage span.inner {
   background-position: -7px -226px;
}

a.button.nextpage span.icon,
.pagenav a.nextpage span.inner {
   background-position: -28px -226px;
}

a.button.lastpage span.icon,
.pagenav a.lastpage span.inner {
   background-position: -28px -211px;
}

a.button.pageup span.icon,
.pagenav a.pageup span.inner {
   background-position: -7px -241px;
}

a.button.pagedown span.icon,
.pagenav a.pagedown span.inner {
   background-position: -29px -241px;
}

a.button.reply span.icon,
.pagenav a.reply span.inner {
   background-position: -7px -256px;
}

a.button.forward span.icon,
.pagenav a.forward span.inner {
   background-position: -29px -256px;
}

a.button.replyall span.icon,
.pagenav a.replyall span.inner {
   background-position: -7px -271px;
}

a.button.extwin span.icon,
.pagenav a.extwin span.inner {
   background-position: -29px -271px;
}

a.button.changeformat.html span.icon,
.pagenav a.changeformat.html span.inner {
   background-position: -7px -1859px;
}
a.button.changeformat.html.selected span.icon,
.pagenav a.changeformat.html.selected span.inner {
   background-position: -29px -1859px;
}

a.button.changeformat.text span.icon,
.pagenav a.changeformat.text span.inner {
   background-position: -7px -1874px;
}
a.button.changeformat.text.selected span.icon,
.pagenav a.changeformat.text.selected span.inner {
   background-position: -29px -1874px;
}

a.button.add span.icon {
   background-position: -7px -2009px;
}

a.button.delete span.icon {
   background-position: -29px -2009px;
}

.pagenav .countdisplay {
@@ -398,7 +456,7 @@

a.iconbutton {
   display: inline-block;
   width: 24px;
   width: 20px;
   height: 18px;
   text-decoration: none;
   text-indent: -5000px;
@@ -411,17 +469,50 @@
   cursor: default;
}

a.iconbutton.searchicon,
a.iconbutton.searchoptions {
   width: 24px;
   background-position: -2px -317px;
}

a.iconbutton.searchicon {
   width: 15px;
}

a.iconbutton.reset {
   width: 24px;
   background-position: -25px -317px;
}

a.iconbutton.remove,
a.iconbutton.cancel {
   background-position: -7px -377px;
   background-position: -7px -378px;
}

a.iconbutton.delete {
   background-position: -7px -338px;
}

a.iconbutton.add {
   background-position: -7px -358px;
}

a.iconbutton.remove {
   background-position: -7px -379px;
}

a.iconbutton.cancel {
   background-position: -7px -398px;
}

a.iconbutton.edit {
   background-position: -7px -418px;
}

a.iconbutton.upload {
   background-position: -6px -438px;
}


a.iconlink {
   display: inline-block;
@@ -531,8 +622,8 @@

#messagestack {
   position: absolute;
   bottom: 12px;
   right: 10px;
   bottom: 20px;
   right: 12px;
   z-index: 50000;
   width: auto;
   height: auto;
@@ -614,6 +705,20 @@
   top: 4px;
   left: 6px;
   background: url(images/ajaxloader_dark.gif) 0 4px no-repeat;
}

#messagestack div.voice {
   position: absolute;
   top: -1000px;
}

#messagestack div a {
   color: #94c0da;
}

#messagestack div a:hover {
   text-decoration: underline;
   cursor: pointer;
}

.ui-dialog.error .ui-dialog-title,
@@ -852,13 +957,9 @@
   border-width: 0 4px 4px;
   border-color: #888 transparent;
   /* reduce the damage in FF3.0 */
   display: block; 
   display: block;
   width: 0;
   z-index: 251;
}

.ie8 .minimal #taskbar .tooltip:after {
   top: -6px;
}

.minimal #taskbar a:hover .tooltip {
@@ -888,6 +989,13 @@
   padding: 5px 0 0 34px;
   height: 19px;
   background: url(images/buttons.png) -1000px 0 no-repeat;
}

#taskbar a:focus {
   color: #fff;
   text-shadow: 0px 1px 1px #666;
   background-color: rgba(73,180,210,0.7);
   outline: none;
}

#taskbar a.button-selected {
@@ -955,6 +1063,22 @@
   bottom: 20px;
}

#mainscreencontent {
   position: absolute;
   top: 42px;
   left: 0;
   right: 0;
   bottom: 0;
}

#mainscreen.offset {
   top: 132px;
}

#mainscreen .offset {
   top: 42px;
}

.minimal #mainscreen {
   top: 62px;
}
@@ -967,12 +1091,8 @@
   top: 40px;
}

#mainscreen.offset {
   top: 132px;
}

#mainscreen .offset {
   top: 42px;
.extwin #mainscreen.offset {
   top: 86px;
}

.uibox {
@@ -987,11 +1107,6 @@
}

.minwidth {
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   width: 100%;
   min-width: 1024px;
}

@@ -1052,23 +1167,26 @@
}

.boxtitle,
.uibox .listing thead th,
.uibox .listing thead td {
   font-size: 12px;
   font-weight: bold;
   padding: 10px 8px 3px 8px;
   height: 20px;  /* doesn't affect table-cells in FF */
   padding: 7px 8px 6px 8px;
   line-height: 20px;
   margin: 0;
   text-shadow: 0px 1px 1px #fff;
   border-bottom: 1px solid #bbd3da;
   white-space: nowrap;
}

.uibox .listing thead th,
.uibox .listing thead td {
   padding-bottom: 8px;
   height: auto;
}

.uibox .boxtitle,
.uibox .listing thead th,
.uibox .listing thead td {
   background: #b0ccd7;
   color: #004458;
@@ -1087,6 +1205,7 @@
}

.listbox .listitem a,
.listbox .listitem span,
.listbox .tablink a,
.listing tbody td,
.listing li a {
@@ -1095,27 +1214,50 @@
   text-shadow: 0px 1px 1px #fff;
   text-decoration: none;
   cursor: default;
   padding: 6px 8px 2px 8px;
   height: 17px; /* doesn't affect table-cells in FF */
   padding: 4px 8px;
   line-height: 17px;
   height: 17px;
   white-space: nowrap;
}

.listing tbody td {
   display: table-cell;
   padding-bottom: 5px;
   height: auto;
   min-height: 14px;
   outline: none;
}

.listing tbody td a {
   color: #376572;
   text-shadow: 0px 1px 1px #fff;
   text-decoration: none;
}

.webkit .listing tbody td {
   height: 14px;
}

/* This padding-left minus the focused padding left should be half of the focused border-left */
.listing thead tr td:first-child,
.listing tbody tr td:first-child {
   border-left: 2px solid transparent;
   padding-left: 6px;
}

.listing.iconized thead tr td:first-child,
.listing.iconized tbody tr td:first-child {
   padding-left: 34px;
}

/* because of border-collapse, we make the left border twice what we want it to be - half will be hidden to the left */
.listing.focus tbody tr.focused > td:first-child {
   border-left: 2px solid #739da8;
}

.listbox .listitem.selected,
.listbox .tablink.selected,
.listbox .listitem.selected > a,
.listbox .tablink.selected > a,
.listing tbody tr.unfocused td,
.listing tbody tr.selected td,
.listing li.selected,
.listing li.selected > a {
@@ -1133,6 +1275,9 @@

ul.listing li {
   background-color: #d9ecf4;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}

ul.listing li ul {
@@ -1163,14 +1308,81 @@
   position: relative;
}

ul.treelist li ul {
   margin: 0;
   padding: 0;
}

ul.treelist li ul li:last-child {
   border-bottom: 0;
}

ul.treelist li a {
   display: block;
   padding-left: 20px;
   overflow: hidden;
   text-overflow: ellipsis;
}

ul.treelist li a:focus,
ul.listing .listitem a:focus,
ul.listing .listitem span:focus,
ul.listing.focus .listitem.focused span {
   color: #fff !important;
   background-color: rgba(73,180,210,0.6);
   text-shadow: 0px 1px 1px #666;
   outline: none;
}

ul.treelist ul li a {
   padding-left: 38px;
}

ul.treelist ul ul li a {
   padding-left: 54px;
}

ul.treelist.iconized li a {
   padding-left: 36px;
}

ul.treelist.iconized ul li a {
   padding-left: 62px;
}

ul.treelist.iconized ul ul li a {
   padding-left: 88px;
}

ul.treelist.iconized ul ul ul li a {
   padding-left: 114px;
}

ul.treelist li div.treetoggle {
   position: absolute;
   top: 13px;
   left: 19px;
   top: 7px;
   left: 4px;
   width: 13px;
   height: 13px;
   background: url(images/listicons.png) -3px -144px no-repeat;
   cursor: pointer;
}

ul.treelist li ul li div.treetoggle {
   left: 22px;
}

ul.treelist.iconized li div.treetoggle {
   top: 13px;
   left: 19px;
}

ul.treelist.iconized ul li div.treetoggle {
   left: 45px;
}

ul.treelist.iconized ul ul li div.treetoggle {
   left: 71px;
}

ul.treelist li div.treetoggle.expanded {
@@ -1214,6 +1426,13 @@
   margin-top: 1px;
}

.boxfooter a.listbutton:focus {
   color: #fff;
   background-color: rgba(73,180,210,0.6);
   text-shadow: 0px 1px 1px #666;
   outline: none;
}

.uibox .boxfooter .listbutton:first-child {
   border-radius: 0 0 0 4px;
}
@@ -1223,7 +1442,9 @@
   width: 48px;
   height: 35px;
   text-indent: -5000px;
   background: url(images/buttons.png) -1000px 0 no-repeat;
   background-image: url(images/buttons.png);
   background-position: -1000px 0;
   background-repeat: no-repeat;
}

.boxfooter .listbutton.add .inner {
@@ -1337,6 +1558,7 @@
   border: 0;
}

.records-table thead th,
.records-table thead td {
   color: #69939e;
   font-size: 11px;
@@ -1351,13 +1573,17 @@
   padding: 8px 7px;
   overflow: hidden;
   text-overflow: ellipsis;
   text-align: left;
}

.records-table.sortheader thead th,
.records-table.sortheader thead td {
   padding: 0;
}

.records-table thead th a,
.records-table thead td a,
.records-table thead th span,
.records-table thead td span {
   display: block;
   padding: 7px 7px;
@@ -1365,6 +1591,14 @@
   text-decoration: none;
   overflow: hidden;
   text-overflow: ellipsis;
}

.records-table thead th a:focus,
.records-table thead td a:focus {
   color: #fff;
   background-color: rgba(73,180,210,0.7);
   text-shadow: 0px 1px 1px #666;
   outline: none;
}

.records-table tbody td {
@@ -1376,27 +1610,28 @@
   overflow: hidden;
   text-overflow: ellipsis;
   background-color: #fff;
   outline: none;
}

/* This padding-left minus the focused padding left should be half of the focused border-left */
.records-table thead tr th:first-child,
.records-table thead tr td:first-child,
.records-table tbody tr td:first-child {
   border-left: 0;
   padding-left: 6px;
}

/* because of border-collapse, we make the left border twice what we want it to be - half will be hidden to the left */
.records-table tbody tr.focused > td:first-child {
   border-left: 2px solid #b0ccd7;
   border-left: 2px solid transparent;
   padding-left: 4px;
}

.records-table tbody tr.selected.focused > td:first-child {
   border-left-color: #49b3d2;
/* because of border-collapse, we make the left border twice what we want it to be - half will be hidden to the left */
.records-table.focus tbody tr.focused > td:first-child {
   border-left: 2px solid #49b3d2;
}

.records-table tr.selected td {
   color: #fff !important;
   background-color: #4db0d2 !important;
}

.records-table.focus tr.selected td {
   background: #019bc6;
   background: -moz-linear-gradient(top, #019bc6 0%, #017cb4 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#019bc6), color-stop(100%,#017cb4));
@@ -1407,16 +1642,6 @@

.records-table tr.selected td a,
.records-table tr.selected td span {
   color: #fff !important;
}

.records-table tr.unfocused td {
   color: #fff !important;
   background: #4db0d2 !important;
}

.records-table tr.unfocused td a,
.records-table tr.unfocused td span {
   color: #fff !important;
}

@@ -1550,6 +1775,12 @@
.propform div.prop.block input,
.propform div.prop.block textarea {
   width: 95%;
}

.propform a.disabled {
   color: #999;
   text-decoration: none;
   cursor: default;
}

fieldset.floating {
@@ -1734,7 +1965,7 @@

#quicksearchbar {
   position: absolute;
   right: 1px;
   right: 2px;
   top: 2px;
   width: 240px;
}
@@ -1751,6 +1982,7 @@
   font-size: 11px;
}

.searchbox .searchicon,
.searchbox #searchmenulink,
#quicksearchbar #searchmenulink {
   position: absolute;
@@ -1759,12 +1991,25 @@
}

.searchbox #searchreset,
.searchbox .iconbutton.reset,
#quicksearchbar #searchreset {
   position: absolute;
   top: 4px;
   right: 1px;
}

.listsearchbox {
   position: relative;
   padding: 4px;
   background: #c7e3ef;
}

.listsearchbox input {
   width: 100%;
   height: 26px;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}

/*** toolbar ***/

@@ -1796,6 +2041,14 @@
   border-radius: 0;
}

.dropbutton .dropbuttontip:focus,
.toolbar a.button:focus {
   color: #fff;
   text-shadow: 0px 1px 1px #666;
   background-color: rgba(30,150,192, 0.5);
   border-radius: 3px;
}

.toolbar a.button.disabled {
   opacity: 0.4;
   filter: alpha(opacity=40);
@@ -1811,12 +2064,16 @@
   position: absolute;
   right: 0;
   top: 0;
   height: 42px;
   height: 41px;
   width: 18px;
   overflow: hidden;
   text-indent: -5000px;
   background: url(images/buttons.png) 0 -1255px no-repeat;
   cursor: pointer;
   outline: none;
}

.dropbutton .dropbuttontip:focus,
.dropbutton .dropbuttontip:hover {
   background-position: -26px -1255px;
}
@@ -1881,6 +2138,10 @@

.toolbar a.button.markmessage {
   background-position: center -1094px;
}

.toolbar a.button.move {
   background-position: center -1971px;
}

.toolbar a.button.more {
@@ -2003,16 +2264,53 @@
}


a.menuselector:focus,
a.menuselector.focus,
a.iconbutton:focus,
.pagenav a.button:focus {
   border-color: #4fadd5;
   -webkit-box-shadow: 0 0 4px 2px rgba(71,135,177, 0.8);
      -moz-box-shadow: 0 0 4px 2px rgba(71,135,177, 0.8);
        -o-box-shadow: 0 0 4px 2px rgba(71,135,177, 0.8);
           box-shadow: 0 0 4px 2px rgba(71,135,177, 0.8);
   outline: none;
}


/*** quota indicator ***/

#quotadisplay {
   left: 6px;
   height: 18px;
   font-size: 12px;
   font-weight: bold;
   text-shadow: 0px 1px 1px #fff;
   padding-left: 30px;
   height: 18px;
   background: url(images/quota.png) -100px 0 no-repeat;
}

table.quota-info {
   border-spacing: 0;
   border-collapse: collapse;
   table-layout: fixed;
   margin: 5px;
}

table.quota-info td,
table.quota-info th {
   color: white;
   border: 1px solid lightgrey;
   padding: 2px 3px;
   text-align: center;
   min-width: 80px;
}

table.quota-info td.name {
   text-align: left;
}

table.quota-info td.root {
   font-style: italic;
}

/*** popup menus ***/
@@ -2080,7 +2378,7 @@
   text-shadow: 0px 1px 1px #333;
   text-decoration: none;
   min-height: 14px;
   padding: 6px 10px 6px 10px;
   padding: 6px 16px 6px 10px;
}

.googie_list td span {
@@ -2095,6 +2393,7 @@

.googie_list td.googie_list_onhover,
ul.toolbarmenu li a.active:hover,
ul.toolbarmenu li a.active:focus,
#rcmKSearchpane ul li.selected,
select.decorated option:hover,
select.decorated option[selected='selected'] {
@@ -2104,6 +2403,7 @@
   background: -o-linear-gradient(top, #00aad6 0%, #008fc9 100%);
   background: -ms-linear-gradient(top, #00aad6 0%, #008fc9 100%);
   background: linear-gradient(top, #00aad6 0%, #008fc9 100%);
   outline: none;
}

ul.toolbarmenu.iconized li a,
@@ -2203,6 +2503,14 @@

ul.toolbarmenu li span.conversation {
   background-position: 0 -1532px;
}

ul.toolbarmenu li span.move {
   background-position: 0 -2126px;
}

ul.toolbarmenu li span.copy {
   background-position: 0 -2150px;
}

#snippetslist {
@@ -2317,6 +2625,42 @@
   z-index: 255;
}

/*** folder selector ***/

#folder-selector {
   z-index: 1000;
}

#folder-selector li a span {
   background: url("images/listicons.png") 4px -2021px no-repeat;
   display: block;
   height: 17px;
   min-height: 14px;
   padding: 4px 4px 1px 28px;
   overflow: hidden;
   max-width: 120px;
   text-overflow: ellipsis;
}

#folder-selector li a.virtual {
   opacity: .2;
}

#folder-selector li a.inbox span {
   background-position: 4px -2049px;
}
#folder-selector li a.drafts span {
   background-position: 4px -1388px;
}
#folder-selector li a.sent span {
   background-position: 4px -2074px;
}
#folder-selector li a.trash span {
   background-position: 4px -1508px;
}
#folder-selector li a.junk span {
   background-position: 4px -2100px;
}

/*** attachment list ***/

@@ -2333,6 +2677,11 @@
   position: relative;
   background: url(images/filetypes.png) 0 0 no-repeat;
   margin-bottom: 1px;
}

.attachmentslist li.txt,
.attachmentslist li.text {
   background-position: 0 -416px;
}

.attachmentslist li.pdf {
@@ -2394,11 +2743,6 @@
   background-position: 0 -338px;
}

.attachmentslist li.txt,
.attachmentslist li.text {
   background-position: 0 -416px;
}

.attachmentslist li.ics,
.attachmentslist li.calendar {
   background-position: 0 -364px;
@@ -2447,6 +2791,7 @@
   overflow: hidden;
   text-overflow: ellipsis;
   line-height: 20px;
   outline: none;
}

.attachmentslist li a.drop {
@@ -2458,6 +2803,15 @@
   right: 0;
   top: 0;
   padding: 0;
   overflow: hidden;
   text-indent: -5000px;
   outline: none;
}

.attachmentslist li a:focus,
.attachmentslist li a.drop:focus {
   background-color: rgba(30,150,192, 0.5);
   border-radius: 2px;
}

#compose-attachments ul li {
@@ -2482,36 +2836,37 @@
   padding: 0;
   text-decoration: none;
   text-indent: -5000px;
   background: url(images/buttons.png) -7px -337px no-repeat;
   background-image: url(images/buttons.png);
   background-position: -6px -338px;
   background-repeat: no-repeat;
}

.attachmentslist li a.cancelupload {
   background-position: -7px -377px;
   background-position: -6px -378px;
}


/*** fieldset tabs ***/

.tabsbar {
   margin-bottom: 12px;
   padding-top: 15px;
   height: 27px;
   white-space: nowrap;
.tabbed.ui-tabs {
   padding: 0;
   border: 0 !important;
   background: none;
}

.ui-dialog-content .tabsbar {
.ui-dialog .tabbed.ui-tabs {
   margin: -12px -8px 0 -8px;
}

.boxcontent.tabbed.ui-tabs {
   padding: 10px;
}

.ui-tabs .tabsbar.ui-tabs-nav {
   margin-bottom: 10px;
}

.ui-dialog-content .ui-tabs .tabsbar.ui-tabs-nav {
   margin-bottom: 0;
}

.tabsbar .tablink {
   padding: 15px 1px 15px 0;
   background: #f8f8f8;
   background: -moz-linear-gradient(top, #f8f8f8 0%, #d3d3d3 50%, #f8f8f8 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f8f8), color-stop(50%,#d3d3d3), color-stop(100%,#f8f8f8));
   background: -webkit-linear-gradient(top, #f8f8f8 0%, #d3d3d3 50%, #f8f8f8 100%);
   background: -o-linear-gradient(top, #f8f8f8 0%, #d3d3d3 50%, #f8f8f8 100%);
   background: -ms-linear-gradient(top, #f8f8f8 0%, #d3d3d3 50%, #f8f8f8 100%);
   background: linear-gradient(top, #f8f8f8 0%, #d3d3d3 50%, #f8f8f8 100%);
}

.tabsbar .tablink:last-child {
@@ -2522,28 +2877,28 @@
   border-right: 0;
}

.tabsbar .tablink a {
   padding: 15px;
   color: #999;
   font-size: 12px;
   font-weight: bold;
   text-decoration: none;
.ui-tabs .ui-tabs-nav li.tablink a {
   background: #fff;
   border-right: 1px solid #fafafa;
}

.tabsbar .tablink.selected a {
   color: #004458;
   background: #f6f6f6;
   background: -moz-linear-gradient(top, #fff 40%, #efefef 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(40%,#fff), color-stop(100%,#efefef));
   background: -o-linear-gradient(top, #fff 40%, #efefef 100%);
   background: -ms-linear-gradient(top, #fff 40%, #efefef 100%);
   background: linear-gradient(top, #fff 40%, #efefef 100%);
}

fieldset.tab {
.ui-tabs fieldset.ui-tabs-panel {
   border: 0;
   padding: 0;
   margin-left: 0;
   background: none;
}

.ui-dialog .propform .ui-tabs-panel {
   display: block;
   background: #efefef;
   padding: 0.5em 1em;
}

#image-selector-form.droptarget {
   background: url(images/filedrop.png) center bottom no-repeat;
}

/** Common TinyMCE fixes **/
.mce-btn-small .mce-ico {
   display: inline; /* for old Firefox */
}