increase height of controls bar and elements to more clickable 44px

diff --git a/apps/files/css/files.css b/apps/files/css/files.css
index f09e51e70c2df53bd6cd3f79f394f9dea0955f6d..138b15db04fff6c8fb950738e1a62209155b38cb 100644 (file)
--- a/apps/files/css/files.css
+++ b/apps/files/css/files.css
@@ -7,14 +7,34 @@
 .actions input, .actions button, .actions .button { margin:0; float:left; }
 .actions .button a { color: #555; }
 .actions .button a:hover, .actions .button a:active { color: #333; }
-#new {
-       height:17px;  margin:0 0 0 1em; z-index:1010; float:left;
+#new, #trash {
+       z-index: 1010;
+       float: left;
+       padding: 0 !important; /* override default control bar button padding */
+}
+#trash {
+       margin: 0 1em;
+       float: right;
+}
+#new>a, #trash>a {
+       padding: 14px 10px;
+       position: relative;
+       top: 7px;
+}
+#new.active {
+       border-bottom-left-radius: 0;
+       border-bottom-right-radius: 0;
+       border-bottom: none;
 }
-#new.active { border-bottom-left-radius:0; border-bottom-right-radius:0; border-bottom:none; }
-#new>a { padding:.5em 1.2em .3em; }
 #new>ul {
-       display:none; position:fixed; min-width:7em; z-index:10;
-       padding:.5em; padding-bottom:0; margin-top:.075em; margin-left:-.5em;
+       display: none;
+       position: fixed;
+       min-width: 7em;
+       z-index: 10;
+       padding: .5em;
+       padding-bottom: 0;
+       margin-top: 14px;
+       margin-left: -1px;
        text-align:left;
        background: #f8f8f8;
        border: 1px solid #ddd;
@@ -25,18 +45,16 @@
 #new>ul>li { height:36px; margin:.3em; padding-left:3em; padding-bottom:0.1em;
                background-repeat:no-repeat; cursor:pointer; }
 #new>ul>li>p { cursor:pointer; padding-top: 7px; padding-bottom: 7px;}
-#new>ul>li>form>input {
-       padding: 5px;
-       margin: 2px 0;
-}
-
-#trash { margin: 0 1em; z-index:1010; float: right; }
 
 
 
 /* FILE TABLE */
 
-#filestable { position: relative; top:37px; width:100%; }
+#filestable {
+       position: relative;
+       top: 44px;
+       width: 100%;
+}
 #filestable tbody tr { background-color:#fff; height:2.5em; }
 #filestable tbody tr:hover, tbody tr:active {
        background-color: rgb(240,240,240);
@@ -90,9 +108,18 @@ table th#headerDate, table td.date {
 
 /* Multiselect bar */
 #filestable.multiselect {
-       top: 88px;
+       top: 95px;
+}
+table.multiselect thead {
+       position: fixed;
+       top: 89px;
+       z-index: 1;
+       -moz-box-sizing: border-box;
+       box-sizing: border-box;
+       left: 0;
+       padding-left: 80px;
+       width: 100%;
 }
-table.multiselect thead { position:fixed; top:82px; z-index:1; -moz-box-sizing: border-box; box-sizing: border-box; left: 0; padding-left: 80px; width:100%; }
 
 table.multiselect thead th {
        background-color: rgba(210,210,210,.7);
@@ -293,8 +320,6 @@ a.action>img { max-height:16px; max-width:16px; vertical-align:text-bottom; }
 
 #scanning-message{ top:40%; left:40%; position:absolute; display:none; }
 
-div.crumb a{ padding:0.9em 0 0.7em 0; color:#555; }
-
 table.dragshadow {
        width:auto;
 }

diff --git a/apps/files/css/upload.css b/apps/files/css/upload.css
index 2d11e41ba88e3b09520d421d4decf28a95a6c339..ef0435690945e0f9878f085f8024d6ac7c30c981 100644 (file)
--- a/apps/files/css/upload.css
+++ b/apps/files/css/upload.css
@@ -1,38 +1,63 @@
-
 #upload {
-       height:27px; padding:0; margin-left:0.2em; overflow:hidden;
+       -moz-box-sizing: border-box;
+       -webkit-box-sizing: border-box;
+       box-sizing: border-box;
+       height: 36px;
+       width: 39px;
+       padding: 0 !important; /* override default control bar button padding */
+       margin-left: .2em;
+       overflow: hidden;
        vertical-align: top;
 }
 #upload a {
-       position:relative; display:block; width:100%; height:27px;
-       cursor:pointer; z-index:10;
-       background-image:url('%webroot%/core/img/actions/upload.svg');
-       background-repeat:no-repeat;
-       background-position:7px 6px;
-       opacity:0.65;
+       position: relative;
+       display: block;
+       width: 100%;
+       height: 44px;
+       width: 44px;
+       margin: -5px -3px;
+       cursor: pointer;
+       z-index: 10;
+       background-image: url('%webroot%/core/img/actions/upload.svg');
+       background-repeat: no-repeat;
+       background-position: center;
+       opacity: .65;
 }
 .file_upload_target { display:none; }
 .file_upload_form { display:inline; float:left; margin:0; padding:0; cursor:pointer; overflow:visible; }
 #file_upload_start {
-       float: left;
-       left:0; top:0; width:28px; height:27px; padding:0;
-       font-size:1em;
+       position: relative;
+       left: 0;
+       top: 0;
+       width: 44px;
+       height: 44px;
+       margin: -5px -3px;
+       padding: 0;
+       font-size: 1em;
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:0;
-       z-index:20; position:relative; cursor:pointer; overflow:hidden;
+       z-index: 20;
+       cursor: pointer;
+       overflow: hidden;
 }
 
 #uploadprogresswrapper {
+       -moz-box-sizing: border-box;
+       -webkit-box-sizing: border-box;
+       box-sizing: border-box;
        display: inline-block;
        vertical-align: top;
-       margin:0.3em;
-       height: 29px;
+       height: 36px;
+       box-sizing: border-box;
+}
+#uploadprogresswrapper > input[type='button'] {
+       height: 36px;
 }
 #uploadprogressbar {
        position:relative;
        float: left;
        margin-left: 12px;
        width: 130px;
-       height: 26px;
+       height: 36px;
        display:inline-block;
 }
 #uploadprogressbar + stop {

diff --git a/core/css/styles.css b/core/css/styles.css
index 06b61f0fa689d792a3e61b46e1c867c1baf6a30b..72cb7994ea665f51f1b11de169e909fae3077eee 100644 (file)
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -152,22 +152,37 @@ input[type="submit"].enabled { background:#66f866; border:1px solid #5e5; -moz-b
 
 /* CONTENT ------------------------------------------------------------------ */
 #controls {
+       -moz-box-sizing: border-box;
+       -webkit-box-sizing: border-box;
+       box-sizing: border-box;
        position: fixed;
-       height: 36px;
+       height: 44px;
        width: 100%;
-       padding: 0 75px 0 6px;
+       padding-right: 75px;
        margin: 0;
        background: #eee;
        border-bottom: 1px solid #e7e7e7;
        z-index: 50;
-       -moz-box-sizing: border-box; box-sizing: border-box;
 }
-#controls .button {
+#controls .button,
+#controls button,
+#controls input[type='submit'],
+#controls input[type='text'],
+#controls input[type='password'],
+#controls select {
+       -moz-box-sizing: border-box;
+       -webkit-box-sizing: border-box;
+       box-sizing: border-box;
        display: inline-block;
+       height: 36px;
+       padding: 7px 10px
 }
 
 #content { position:relative; height:100%; width:100%; }
-#content .hascontrols { position: relative; top: 2.9em; }
+#content .hascontrols {
+       position: relative;
+       top: 45px;
+}
 #content-wrapper {
        position:absolute; height:100%; width:100%; padding-top:3.5em; padding-left:80px;
        -moz-box-sizing:border-box; box-sizing:border-box;
@@ -746,15 +761,38 @@ span.ui-icon {float: left; margin: 3px 7px 30px 0;}
 .arrow.left { left:-13px; bottom:1.2em; -webkit-transform:rotate(270deg); -moz-transform:rotate(270deg); -o-transform:rotate(270deg); -ms-transform:rotate(270deg); transform:rotate(270deg); }
 .arrow.up { top:-8px; right:2em; }
 .arrow.down { -webkit-transform:rotate(180deg); -moz-transform:rotate(180deg); -o-transform:rotate(180deg); -ms-transform:rotate(180deg); transform:rotate(180deg); }
-.help-includes {overflow: hidden; width: 100%; height: 100%; -moz-box-sizing: border-box;      box-sizing: border-box; padding-top: 2.8em; }
+.help-includes {
+       overflow: hidden;
+       width: 100%;
+       height: 100%;
+       -moz-box-sizing: border-box;
+       box-sizing: border-box;
+       padding-top: 44px;
+}
 .help-iframe {width: 100%; height: 100%; margin: 0;padding: 0; border: 0; overflow: auto;}
 
 
 /* ---- BREADCRUMB ---- */
-div.crumb { float:left; display:block; background:url('../img/breadcrumb.svg') no-repeat right 0; padding:.75em 1.5em 0 1em; height:2.9em;  -moz-box-sizing:border-box; box-sizing:border-box; }
-div.crumb:first-child { padding:10px 20px 10px 5px; }
-div.crumb.last { font-weight:bold; background:none; padding-right:10px; }
-div.crumb a{ padding: 0.9em 0 0.7em 0; }
+div.crumb {
+       float: left;
+       display: block;
+       background: url('../img/breadcrumb.svg') no-repeat right center;
+       height: 44px;
+}
+div.crumb a {
+       position: relative;
+       top: 12px;
+       padding: 14px 24px 14px 17px;
+       color: #555;
+}
+div.crumb:first-child a {
+       position: relative;
+       top: 13px;
+}
+div.crumb.last {
+       font-weight: bold;
+       margin-right: 10px;
+}
 
 /* some feedback for hover/tap on breadcrumbs */
 div.crumb:hover,

diff --git a/core/img/breadcrumb-start.png b/core/img/breadcrumb-start.png
deleted file mode 100644 (file)
index b0df5f4..0000000
Binary files a/core/img/breadcrumb-start.png and /dev/null differ

diff --git a/core/img/breadcrumb-start.svg b/core/img/breadcrumb-start.svg
deleted file mode 100644 (file)
index 7f36231..0000000
--- a/core/img/breadcrumb-start.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="36" width="11" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
- <g transform="translate(0 -1016.4)">
-  <path d="m0 0 11 18-11 18z" transform="translate(0 1016.4)" fill="#ddd"/>
- </g>
-</svg>

diff --git a/core/img/breadcrumb.png b/core/img/breadcrumb.png
index 84992be0d9350d7a94455cfe46dcea2fcc669e64..7e9593a36bf9a2fc123ee6237fdfc88c022df0a6 100644 (file)
Binary files a/core/img/breadcrumb.png and b/core/img/breadcrumb.png differ

diff --git a/core/img/breadcrumb.svg b/core/img/breadcrumb.svg
index 05a216e50a9eaec7a20be7274957dc6e8ae2f46f..f0b5c9218d50b5b05e9a7446519bad8743464440 100644 (file)
--- a/core/img/breadcrumb.svg
+++ b/core/img/breadcrumb.svg
@@ -1,6 +1,12 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="36" width="11" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
- <g transform="translate(0 -1016.4)">
-  <path d="m0.5 0 10 18-10 18 10-18z" transform="translate(0 1016.4)" stroke="#ddd" stroke-linecap="round" stroke-miterlimit="31.2" stroke-width="0.9" fill="#ddd"/>
- </g>
+<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" height="44" width="14" version="1.1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/">
+ <metadata>
+  <rdf:RDF>
+   <cc:Work rdf:about="">
+    <dc:format>image/svg+xml</dc:format>
+    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+    <dc:title/>
+   </cc:Work>
+  </rdf:RDF>
+ </metadata>
+ <path d="M0.54879,0.047777,12.744,22,0.54879,43.951,12.744,22z" stroke="#d7d7d7" stroke-linecap="round" stroke-miterlimit="31.20000076000000178" stroke-width="1.09758711000000009" fill="#F00"/>
 </svg>

diff --git a/settings/css/settings.css b/settings/css/settings.css
index 57a43180a43a5e9b5f2e2d54ecb6add952ab24bf..0afdd9edbfaef15627d0512d24f5e1621a71c5f3 100644 (file)
--- a/settings/css/settings.css
+++ b/settings/css/settings.css
@@ -47,18 +47,37 @@ tr:hover>td.remove>a { float:right; }
 li.selected { background-color:#ddd; }
 table:not(.nostyle) { width:100%; }
 #rightcontent { padding-left: 1em; }
-div.quota { float:right; display:block; position:absolute; right:25em; top:-1px; }
+div.quota {
+       float: right;
+       display: block;
+       position: absolute;
+       right: 216px;
+       top: 0;
+}
 div.quota-select-wrapper { position: relative; }
 div.recoveryPassword { left:50em; display:block; position:absolute; top:-1px; }
 input#recoveryPassword {width:15em;}
 select.quota { position:absolute; left:0; top:0; width:10em; }
 select.quota-user { position:relative; left:0; top:0; width:10em; }
-div.quota>span { position:absolute; right:0; white-space:nowrap; top:.7em; color:#888; text-shadow:0 1px 0 #fff; }
+div.quota>span {
+       position: absolute;
+       right: 0;
+       white-space: nowrap;
+       top: 12px;
+       color: #888;
+       text-shadow: 0 1px 0 #fff;
+}
 select.quota.active { background: #fff; }
 
 /* positioning fixes */
-#newuser { position:relative; top:-3px; }
-#newuser .multiselect { top:1px; }
+#newuser .multiselect {
+       min-width: 150px !important;
+}
+#newuser .multiselect,
+#newusergroups + input[type='submit'] {
+       position: relative;
+       top: 1px;
+}
 #headerGroups, #headerSubAdmins, #headerQuota { padding-left:18px; }
 
 .ie8 table.hascontrols{border-collapse:collapse;width: 100%;}