wbrawner/server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

filepicker: improve layout and style

Browse source 
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
Jan-Christoph Borchardt 2016-10-18 11:42:13 +02:00 committed by Robin Appelman
parent 14f78369d7
commit cee7bfef16
No known key found for this signature in database
GPG key ID: 425003AC385454C5
3 changed files with 26 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
core/css/jquery.ocdialog.css
View file

@ -1,7 +1,7 @@
.oc-dialog { .oc-dialog {
background: white; background: #fff;
color: #333333; color: #333;
border-radius: 3px; box-shadow: 0 0 7px #888888; border-radius: 3px; box-shadow: 0 0 7px #888;
padding: 15px; padding: 15px;
z-index: 1000; z-index: 1000;
font-size: 100%; font-size: 100%;
@ -11,26 +11,25 @@
min-width: 200px; min-width: 200px;
} }
.oc-dialog-title { .oc-dialog-title {
background: white; background: #fff;
font-weight: bold;
font-size: 110%;
margin-bottom: 5px;
margin-top: -9px;
} }
.oc-dialog-content { .oc-dialog-content {
z-index: 1000; z-index: 1000;
background: white;
} }
.oc-dialog-separator { .oc-dialog-separator {
} }
.oc-dialog-buttonrow { .oc-dialog-buttonrow {
background: white;
float: right;
position: relative;
bottom: 5px;
display: block; display: block;
margin-top: 10px; background: transparent;
position: absolute;
right: 0;
bottom: 0;
padding: 10px;
box-sizing: border-box;
width: 100%; width: 100%;
background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
} }
/* align primary button to right, other buttons to left */ /* align primary button to right, other buttons to left */
.oc-dialog-buttonrow.twobuttons button:nth-child(1) { .oc-dialog-buttonrow.twobuttons button:nth-child(1) {
@ -45,10 +44,11 @@
} }
.oc-dialog-close { .oc-dialog-close {
position:absolute; position: absolute;
top:7px; right:7px; top: 0;
height:20px; width:20px; right: 0;
background:url('../img/actions/close.svg') no-repeat center; padding: 25px;
background: url('../img/actions/close.svg') no-repeat center;
} }
.oc-dialog-dim { .oc-dialog-dim {

8
core/css/styles.css
View file

@ -775,11 +775,12 @@ a.bookmarklet { background-color:#ddd; border:1px solid #ccc; padding:5px;paddin
#oc-dialog-filepicker-content .dirtree span:last-child { font-weight: bold; } #oc-dialog-filepicker-content .dirtree span:last-child { font-weight: bold; }
#oc-dialog-filepicker-content .dirtree span:not(:last-child)::after { content: '>'; padding: 3px;} #oc-dialog-filepicker-content .dirtree span:not(:last-child)::after { content: '>'; padding: 3px;}
#oc-dialog-filepicker-content .filelist-container { #oc-dialog-filepicker-content .filelist-container {
box-sizing: border-box;
display: inline-block; display: inline-block;
overflow-y: auto; overflow-y: auto;
height: 290px; height: 321px;
width: 100%; width: 100%;
border-top: 1px solid #eee; padding-bottom: 55px;
} }
#oc-dialog-filepicker-content .filelist { #oc-dialog-filepicker-content .filelist {
background-color:white; background-color:white;
@ -790,6 +791,9 @@ a.bookmarklet { background-color:#ddd; border:1px solid #ccc; padding:5px;paddin
padding: 14px; padding: 14px;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
} }
#oc-dialog-filepicker-content .filelist tr:last-child td {
border-bottom: none;
}
#oc-dialog-filepicker-content .filelist .filename { #oc-dialog-filepicker-content .filelist .filename {
overflow: hidden; overflow: hidden;
white-space: nowrap; white-space: nowrap;

4
core/js/jquery.ocdialog.js
View file

@ -101,9 +101,9 @@
if(this.$title) { if(this.$title) {
this.$title.text(value); this.$title.text(value);
} else { } else {
var $title = $('<h3 class="oc-dialog-title">' var $title = $('<h2 class="oc-dialog-title">'
+ value + value
+ '</h3>'); + '</h2>');
this.$title = $title.prependTo(this.$dialog); this.$title = $title.prependTo(this.$dialog);
} }
this._setSizes(); this._setSizes();