merge master into mobile-style

6 files changed, 313 insertions, 74 deletions

diff --git a/core/css/auth.css b/core/css/auth.css
index 0adc10c77d9..70df9f0ae0f 100644
--- a/core/css/auth.css
+++ b/core/css/auth.css
@@ -1,7 +1,7 @@
 h2 {
-	font-size:2em;
+	font-size:32px;
 	font-weight:700;
-	margin-bottom:1em;
+	margin-bottom:16px;
 	white-space:nowrap;
 }
 
@@ -18,8 +18,8 @@ h2 img {
 }
 
 #oauth {
-	width:20em;
-	margin:4em auto 2em;
+	width:320px;
+	margin:64px auto 32px;
 }
 
 #allow-auth {
@@ -33,7 +33,7 @@ h2 img {
 	background:none;
 	border:0;
 	box-shadow:0 0 0 #fff, 0 0 0 #fff inset;
-	font-size:1.2em;
-	margin:.7em;
+	font-size:19px;
+	margin:11px;
 	padding:0;
 }
diff --git a/core/css/icons.css b/core/css/icons.css
new file mode 100644
index 00000000000..57c37c5c51c
--- /dev/null
+++ b/core/css/icons.css
@@ -0,0 +1,240 @@
+.icon {
+	background-repeat: no-repeat;
+	background-position: center;
+}
+
+
+
+
+/* general assets */
+
+.icon-breadcrumb {
+	background-image: url('../img/breadcrumb.svg');
+}
+
+.icon-loading {
+	background-image: url('../img/loading.gif');
+}
+.icon-loading-dark {
+	background-image: url('../img/loading-dark.gif');
+}
+.icon-loading-small {
+	background-image: url('../img/loading-small.gif');
+}
+
+.icon-noise {
+	background-image: url('../img/noise.png');
+	background-repeat: no-repeat;
+}
+
+
+
+
+/* action icons */
+
+.icon-add {
+	background-image: url('../img/actions/add.svg');
+}
+
+.icon-caret {
+	background-image: url('../img/actions/caret.svg');
+}
+.icon-caret-dark {
+	background-image: url('../img/actions/caret-dark.svg');
+}
+
+.icon-checkmark {
+	background-image: url('../img/actions/checkmark.svg');
+}
+
+.icon-clock {
+	background-image: url('../img/actions/clock.svg');
+}
+
+.icon-close {
+	background-image: url('../img/actions/close.svg');
+}
+
+.icon-confirm {
+	background-image: url('../img/actions/confirm.svg');
+}
+
+.icon-delete {
+	background-image: url('../img/actions/delete.svg');
+}
+.icon-delete-hover {
+	background-image: url('../img/actions/delete-hover.svg');
+}
+
+.icon-download {
+	background-image: url('../img/actions/download.svg');
+}
+
+.icon-history {
+	background-image: url('../img/actions/history.svg');
+}
+
+.icon-info {
+	background-image: url('../img/actions/info.svg');
+}
+
+.icon-lock {
+	background-image: url('../img/actions/lock.svg');
+}
+
+.icon-logout {
+	background-image: url('../img/actions/logout.svg');
+}
+
+.icon-mail {
+	background-image: url('../img/actions/mail.svg');
+}
+
+.icon-more {
+	background-image: url('../img/actions/more.svg');
+}
+
+.icon-password {
+	background-image: url('../img/actions/password.svg');
+}
+
+.icon-pause {
+	background-image: url('../img/actions/pause.svg');
+}
+.icon-pause-big {
+	background-image: url('../img/actions/pause-big.svg');
+}
+
+.icon-play {
+	background-image: url('../img/actions/play.svg');
+}
+.icon-play-add {
+	background-image: url('../img/actions/play-add.svg');
+}
+.icon-play-big {
+	background-image: url('../img/actions/play-big.svg');
+}
+.icon-play-next {
+	background-image: url('../img/actions/play-next.svg');
+}
+.icon-play-previous {
+	background-image: url('../img/actions/play-previous.svg');
+}
+
+.icon-public {
+	background-image: url('../img/actions/public.svg');
+}
+
+.icon-rename {
+	background-image: url('../img/actions/rename.svg');
+}
+
+.icon-search {
+	background-image: url('../img/actions/search.svg');
+}
+
+.icon-settings {
+	background-image: url('../img/actions/settings.svg');
+}
+
+.icon-share {
+	background-image: url('../img/actions/share.svg');
+}
+.icon-shared {
+	background-image: url('../img/actions/shared.svg');
+}
+
+.icon-sound {
+	background-image: url('../img/actions/sound.svg');
+}
+.icon-sound-off {
+	background-image: url('../img/actions/sound-off.svg');
+}
+
+.icon-star {
+	background-image: url('../img/actions/star.svg');
+}
+
+.icon-starred {
+	background-image: url('../img/actions/starred.svg');
+}
+
+.icon-toggle {
+	background-image: url('../img/actions/toggle.svg');
+}
+
+.icon-triangle-e {
+	background-image: url('../img/actions/triangle-e.svg');
+}
+.icon-triangle-n {
+	background-image: url('../img/actions/triangle-n.svg');
+}
+.icon-triangle-s {
+	background-image: url('../img/actions/triangle-s.svg');
+}
+
+.icon-upload {
+	background-image: url('../img/actions/upload.svg');
+}
+.icon-upload-white {
+	background-image: url('../img/actions/upload-white.svg');
+}
+
+.icon-user {
+	background-image: url('../img/actions/user.svg');
+}
+
+.icon-view-close {
+	background-image: url('../img/actions/view-close.svg');
+}
+.icon-view-next {
+	background-image: url('../img/actions/view-next.svg');
+}
+.icon-view-pause {
+	background-image: url('../img/actions/view-pause.svg');
+}
+.icon-view-play {
+	background-image: url('../img/actions/view-play.svg');
+}
+.icon-view-previous {
+	background-image: url('../img/actions/view-previous.svg');
+}
+
+
+
+
+/* places icons */
+
+.icon-calendar-dark {
+	background-image: url('../img/places/calendar-dark.svg');
+}
+
+.icon-contacts-dark {
+	background-image: url('../img/places/contacts-dark.svg');
+}
+
+.icon-file {
+	background-image: url('../img/places/file.svg');
+}
+.icon-files {
+	background-image: url('../img/places/files.svg');
+}
+.icon-folder {
+	background-image: url('../img/places/folder.svg');
+}
+
+.icon-home {
+	background-image: url('../img/places/home.svg');
+}
+
+.icon-link {
+	background-image: url('../img/places/link.svg');
+}
+
+.icon-music {
+	background-image: url('../img/places/music.svg');
+}
+
+.icon-picture {
+	background-image: url('../img/places/picture.svg');
+}
diff --git a/core/css/jquery.multiselect.css b/core/css/jquery.multiselect.css
index 898786a6157..9b81c3bdcfb 100644
--- a/core/css/jquery.multiselect.css
+++ b/core/css/jquery.multiselect.css
@@ -1,23 +1,23 @@
-.ui-multiselect { padding:2px 0 2px 4px; text-align:left }
-.ui-multiselect span.ui-icon { float:right }
+.ui-multiselect { padding:2px 0 2px 4px; text-align:left; }
+.ui-multiselect span.ui-icon { float:right; }
 .ui-multiselect-single .ui-multiselect-checkboxes input { position:absolute !important; top: auto !important; left:-9999px; }
-.ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important }
+.ui-multiselect-single .ui-multiselect-checkboxes label { padding:5px !important; }
 
-.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px }
-.ui-multiselect-header ul { font-size:0.9em }
-.ui-multiselect-header ul li { float:left; padding:0 10px 0 0 }
-.ui-multiselect-header a { text-decoration:none }
-.ui-multiselect-header a:hover { text-decoration:underline }
-.ui-multiselect-header span.ui-icon { float:left }
-.ui-multiselect-header li.ui-multiselect-close { float:right; text-align:right; padding-right:0 }
+.ui-multiselect-header { margin-bottom:3px; padding:3px 0 3px 4px; }
+.ui-multiselect-header ul { font-size:14px; }
+.ui-multiselect-header ul li { float:left; padding:0 10px 0 0; }
+.ui-multiselect-header a { text-decoration:none; }
+.ui-multiselect-header a:hover { text-decoration:underline; }
+.ui-multiselect-header span.ui-icon { float:left;}
+.ui-multiselect-header li.ui-multiselect-close { float:right; text-align:right; padding-right:0; }
 
-.ui-multiselect-menu { display:none; padding:3px; position:absolute; z-index:10000; text-align: left }
-.ui-multiselect-checkboxes { position:relative /* fixes bug in IE6/7 */; overflow-y:scroll }
-.ui-multiselect-checkboxes label { cursor:default; display:block; border:1px solid transparent; padding:3px 1px }
-.ui-multiselect-checkboxes label input { position:relative; top:1px }
-.ui-multiselect-checkboxes li { clear:both; font-size:0.9em; padding-right:3px }
-.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { text-align:center; font-weight:bold; border-bottom:1px solid }
-.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; padding:3px; margin:1px 0; text-decoration:none }
+.ui-multiselect-menu { display:none; padding:3px; position:absolute; z-index:10000; text-align: left; }
+.ui-multiselect-checkboxes { position:relative /* fixes bug in IE6/7 */; overflow-y:scroll; }
+.ui-multiselect-checkboxes label { cursor:default; display:block; border:1px solid transparent; padding:3px 1px; }
+.ui-multiselect-checkboxes label input { position:relative; top:1px; }
+.ui-multiselect-checkboxes li { clear:both; font-size:14px; padding-right:3px; }
+.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label { text-align:center; font-weight:bold; border-bottom:1px solid; }
+.ui-multiselect-checkboxes li.ui-multiselect-optgroup-label a { display:block; padding:3px; margin:1px 0; text-decoration:none; }
 
 /* remove label borders in IE6 because IE6 does not support transparency */
-* html .ui-multiselect-checkboxes label { border:none }
+* html .ui-multiselect-checkboxes label { border:none; }
diff --git a/core/css/multiselect.css b/core/css/multiselect.css
index e2a35ac3633..60f2f47e698 100644
--- a/core/css/multiselect.css
+++ b/core/css/multiselect.css
@@ -7,7 +7,7 @@ ul.multiselectoptions {
 	border: 1px solid #ddd;
 	border-top: none;
 	box-shadow: 0 1px 1px #ddd;
-	padding-top: .5em;
+	padding-top: 8px;
 	position: absolute;
 	max-height:  20em;
 	overflow-y:  auto;
@@ -15,8 +15,8 @@ ul.multiselectoptions {
 }
 
 ul.multiselectoptions.down {
-	border-bottom-left-radius: .5em;
-	border-bottom-right-radius: .5em;
+	border-bottom-left-radius: 8px;
+	border-bottom-right-radius: 8px;
 	width: 100%; /* do not cut off group names */
 	-webkit-box-shadow: 0px 0px 20px rgba(29,45,68,.4);
 	-moz-box-shadow: 0px 0px 20px rgba(29,45,68,.4);
@@ -24,8 +24,8 @@ ul.multiselectoptions.down {
 }
 
 ul.multiselectoptions.up {
-	border-top-left-radius: .5em;
-	border-top-right-radius: .5em;
+	border-top-left-radius: 8px;
+	border-top-right-radius: 8px;
 }
 
 ul.multiselectoptions>li {
@@ -52,8 +52,8 @@ div.multiselect {
 	display: inline-block;
 	max-width: 400px;
 	min-width: 150px;
+	padding-right: 10px;
 	min-height: 20px;
-	padding-right: .6em;
 	position: relative;
 	vertical-align: bottom;
 }
@@ -78,7 +78,7 @@ div.multiselect.down {
 
 div.multiselect>span:first-child {
 	float: left;
-	margin-right: 2em;
+	margin-right: 32px;
 	overflow: hidden;
 	text-overflow: ellipsis;
 	width: 90%;
@@ -86,12 +86,12 @@ div.multiselect>span:first-child {
 
 div.multiselect>span:last-child {
 	position: absolute;
-	right: .8em;
+	right: 13px;
 }
 
 ul.multiselectoptions input.new {
-	padding-bottom: .2em;
-	padding-top: .2em;
+	padding-bottom: 3px;
+	padding-top: 3px;
 	margin: 0;
 }
 
diff --git a/core/css/share.css b/core/css/share.css
index d8140242e06..4ae3b77757e 100644
--- a/core/css/share.css
+++ b/core/css/share.css
@@ -8,54 +8,53 @@
 	border-bottom-right-radius: 5px;
 	box-shadow:0 1px 1px #777;
 	display:block;
-	margin-right:7em;
+	margin-right:112px;
 	position:absolute;
 	right:0;
-	width:25em;
+	width:320px;
 	z-index:500;
-	padding:1em;
+	padding:16px;
 }
 
 #shareWithList {
 	list-style-type:none;
-	padding:.5em;
-}
-
-	#shareWithList li {
-		padding-top: 10px;
-		padding-bottom: 10px;
-		font-weight: bold;
-		line-height: 21px;
-		white-space: normal;
-	}
-
-	#shareWithList .unshare img, #shareWithList .showCruds img {
-		vertical-align:text-bottom; /* properly align icons */
-	}
-
-	#shareWithList label input[type=checkbox]{
-		margin-left: 0;
-	}
-	#shareWithList .username{
-		padding-right: .5em;
-		white-space: nowrap;
-		text-overflow: ellipsis;
-		max-width: 254px;
-		display: inline-block;
-		overflow: hidden;
-		vertical-align: middle;
-	}
-	#shareWithList li label{
-		margin-right: .5em;
-	}
+	padding:8px;
+}
+
+#shareWithList li {
+	padding-top: 10px;
+	padding-bottom: 10px;
+	font-weight: bold;
+	line-height: 21px;
+	white-space: normal;
+}
+
+#shareWithList .unshare img, #shareWithList .showCruds img {
+	vertical-align:text-bottom; /* properly align icons */
+}
+
+#shareWithList label input[type=checkbox]{
+	margin-left: 0;
+}
+#shareWithList .username{
+	padding-right: 8px;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	max-width: 254px;
+	display: inline-block;
+	overflow: hidden;
+	vertical-align: middle;
+}
+#shareWithList li label{
+	margin-right: 8px;
+}
 #dropdown label {
 	font-weight:400;
 	white-space: nowrap;
 }
 
 #dropdown input[type="checkbox"] {
-	margin:0 .2em 0 .5em;
-	vertical-align: middle;
+	margin:0 3px 0 8px;
 }
 
 a.showCruds {
@@ -67,13 +66,13 @@ a.unshare {
 	display:inline;
 	float:right;
 	opacity:.5;
-	padding:.3em 0 0 .3em !important;
+	padding:5px 0 0 5px !important;
 	margin-top:-5px;
 }
 
 #link {
 	border-top:1px solid #ddd;
-	padding-top:.5em;
+	padding-top:8px;
 }
 
 #dropdown input[type="text"],#dropdown input[type="password"] {
@@ -91,12 +90,12 @@ a.unshare {
 }
 
 #link #showPassword img {
-	padding-left:.3em;
+	padding-left:5px;
 	width:12px;
 }
 
 .reshare,#link label,#expiration label {
-	padding-left:.5em;
+	padding-left:8px;
 }
 
 a.showCruds:hover,a.unshare:hover {
diff --git a/core/css/styles.css b/core/css/styles.css
index 29fcdd45738..03eb76ddce5 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -264,7 +264,7 @@ input[type="submit"].enabled {
 	top: 45px;
 }
 #content-wrapper {
-	position:absolute; height:100%; width:100%; padding-top:3.5em; padding-left:80px;
+	position:absolute; height:100%; width:100%; padding-left:80px; padding-top: 45px;
 	-moz-box-sizing:border-box; box-sizing:border-box;
 }
 #leftcontent, .leftcontent {