Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

MINOR AssetUploadField styling

  • Loading branch information...
commit 3c29a9268ca5bba5983065bba27ca40a9f327777 1 parent cbc2891
@chillu chillu authored
View
50 admin/css/screen.css
@@ -31,7 +31,7 @@ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav,
/** ---------------------------------------------------- Double tone borders http://daverupert.com/2011/06/two-tone-borders-with-css3/ ----------------------------------------------------- */
/** ----------------------------- Sprite images ----------------------------- */
/** Helper SCSS file for generating sprites for the interface. */
-.btn-icon-sprite, .ui-state-default .btn-icon-accept, .ui-state-default .btn-icon-accept_disabled, .ui-state-default .btn-icon-add, .ui-state-default .btn-icon-add_disabled, .ui-state-default .btn-icon-addpage, .ui-state-default .btn-icon-addpage_disabled, .ui-state-default .btn-icon-arrow-circle-135-left, .ui-state-default .btn-icon-cross-circle, .ui-state-default .btn-icon-cross-circle_disabled, .ui-state-default .btn-icon-decline, .ui-state-default .btn-icon-decline_disabled, .ui-state-default .btn-icon-drive-upload, .ui-state-default .btn-icon-drive-upload_disabled, .ui-state-default .btn-icon-magnifier, .ui-state-default .btn-icon-minus-circle, .ui-state-default .btn-icon-minus-circle_disabled, .ui-state-default .btn-icon-navigation, .ui-state-default .btn-icon-navigation_disabled, .ui-state-default .btn-icon-network-cloud, .ui-state-default .btn-icon-network-cloud_disabled, .ui-state-default .btn-icon-pencil, .ui-state-default .btn-icon-pencil_disabled, .ui-state-default .btn-icon-plug-disconnect-prohibition, .ui-state-default .btn-icon-plug-disconnect-prohibition_disabled, .ui-state-default .btn-icon-preview, .ui-state-default .btn-icon-preview_disabled, .ui-state-default .btn-icon-settings, .ui-state-default .btn-icon-settings_disabled, .ui-state-default .btn-icon-unpublish, .ui-state-default .btn-icon-unpublish_disabled { background: url('../images/btn-icon-s1c742dc591.png') no-repeat; }
+.btn-icon-sprite, .ui-state-default .btn-icon-accept, .ui-state-default .btn-icon-accept_disabled, .ui-state-default .btn-icon-add, .ui-state-default .btn-icon-add_disabled, .ui-state-default .btn-icon-addpage, .ui-state-default .btn-icon-addpage_disabled, .ui-state-default .btn-icon-arrow-circle-135-left, .ui-state-default .btn-icon-back, .ui-state-default .btn-icon-back_disabled, .ui-state-default .btn-icon-cross-circle, .ui-state-default .btn-icon-cross-circle_disabled, .ui-state-default .btn-icon-decline, .ui-state-default .btn-icon-decline_disabled, .ui-state-default .btn-icon-drive-upload, .ui-state-default .btn-icon-drive-upload_disabled, .ui-state-default .btn-icon-magnifier, .ui-state-default .btn-icon-minus-circle, .ui-state-default .btn-icon-minus-circle_disabled, .ui-state-default .btn-icon-navigation, .ui-state-default .btn-icon-navigation_disabled, .ui-state-default .btn-icon-network-cloud, .ui-state-default .btn-icon-network-cloud_disabled, .ui-state-default .btn-icon-pencil, .ui-state-default .btn-icon-pencil_disabled, .ui-state-default .btn-icon-plug-disconnect-prohibition, .ui-state-default .btn-icon-plug-disconnect-prohibition_disabled, .ui-state-default .btn-icon-preview, .ui-state-default .btn-icon-preview_disabled, .ui-state-default .btn-icon-settings, .ui-state-default .btn-icon-settings_disabled, .ui-state-default .btn-icon-unpublish, .ui-state-default .btn-icon-unpublish_disabled { background: url('../images/btn-icon-s4a0551bc3f.png') no-repeat; }
.ui-state-default .btn-icon-accept { background-position: 0 0; }
.ui-state-default .btn-icon-accept_disabled { background-position: 0 -17px; }
@@ -40,29 +40,31 @@ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav,
.ui-state-default .btn-icon-addpage { background-position: 0 -70px; }
.ui-state-default .btn-icon-addpage_disabled { background-position: 0 -88px; }
.ui-state-default .btn-icon-arrow-circle-135-left { background-position: 0 -104px; }
-.ui-state-default .btn-icon-cross-circle { background-position: 0 -120px; }
-.ui-state-default .btn-icon-cross-circle_disabled { background-position: 0 -136px; }
-.ui-state-default .btn-icon-decline { background-position: 0 -152px; }
-.ui-state-default .btn-icon-decline_disabled { background-position: 0 -169px; }
-.ui-state-default .btn-icon-drive-upload { background-position: 0 -186px; }
-.ui-state-default .btn-icon-drive-upload_disabled { background-position: 0 -202px; }
-.ui-state-default .btn-icon-magnifier { background-position: 0 -218px; }
-.ui-state-default .btn-icon-minus-circle { background-position: 0 -234px; }
-.ui-state-default .btn-icon-minus-circle_disabled { background-position: 0 -250px; }
-.ui-state-default .btn-icon-navigation { background-position: 0 -266px; }
-.ui-state-default .btn-icon-navigation_disabled { background-position: 0 -282px; }
-.ui-state-default .btn-icon-network-cloud { background-position: 0 -298px; }
-.ui-state-default .btn-icon-network-cloud_disabled { background-position: 0 -314px; }
-.ui-state-default .btn-icon-pencil { background-position: 0 -330px; }
-.ui-state-default .btn-icon-pencil_disabled { background-position: 0 -346px; }
-.ui-state-default .btn-icon-plug-disconnect-prohibition { background-position: 0 -362px; }
-.ui-state-default .btn-icon-plug-disconnect-prohibition_disabled { background-position: 0 -378px; }
-.ui-state-default .btn-icon-preview { background-position: 0 -394px; }
-.ui-state-default .btn-icon-preview_disabled { background-position: 0 -411px; }
-.ui-state-default .btn-icon-settings { background-position: 0 -428px; }
-.ui-state-default .btn-icon-settings_disabled { background-position: 0 -444px; }
-.ui-state-default .btn-icon-unpublish { background-position: 0 -460px; }
-.ui-state-default .btn-icon-unpublish_disabled { background-position: 0 -478px; }
+.ui-state-default .btn-icon-back { background-position: 0 -120px; }
+.ui-state-default .btn-icon-back_disabled { background-position: 0 -136px; }
+.ui-state-default .btn-icon-cross-circle { background-position: 0 -152px; }
+.ui-state-default .btn-icon-cross-circle_disabled { background-position: 0 -168px; }
+.ui-state-default .btn-icon-decline { background-position: 0 -184px; }
+.ui-state-default .btn-icon-decline_disabled { background-position: 0 -201px; }
+.ui-state-default .btn-icon-drive-upload { background-position: 0 -218px; }
+.ui-state-default .btn-icon-drive-upload_disabled { background-position: 0 -234px; }
+.ui-state-default .btn-icon-magnifier { background-position: 0 -250px; }
+.ui-state-default .btn-icon-minus-circle { background-position: 0 -266px; }
+.ui-state-default .btn-icon-minus-circle_disabled { background-position: 0 -282px; }
+.ui-state-default .btn-icon-navigation { background-position: 0 -298px; }
+.ui-state-default .btn-icon-navigation_disabled { background-position: 0 -314px; }
+.ui-state-default .btn-icon-network-cloud { background-position: 0 -330px; }
+.ui-state-default .btn-icon-network-cloud_disabled { background-position: 0 -346px; }
+.ui-state-default .btn-icon-pencil { background-position: 0 -362px; }
+.ui-state-default .btn-icon-pencil_disabled { background-position: 0 -378px; }
+.ui-state-default .btn-icon-plug-disconnect-prohibition { background-position: 0 -394px; }
+.ui-state-default .btn-icon-plug-disconnect-prohibition_disabled { background-position: 0 -410px; }
+.ui-state-default .btn-icon-preview { background-position: 0 -426px; }
+.ui-state-default .btn-icon-preview_disabled { background-position: 0 -443px; }
+.ui-state-default .btn-icon-settings { background-position: 0 -460px; }
+.ui-state-default .btn-icon-settings_disabled { background-position: 0 -476px; }
+.ui-state-default .btn-icon-unpublish { background-position: 0 -492px; }
+.ui-state-default .btn-icon-unpublish_disabled { background-position: 0 -510px; }
.icon { text-indent: -9999px; border: none; outline: none; }
.icon.icon-24 { width: 24px; height: 24px; background: url('../images/menu-icons/24x24-s546fcae8fd.png'); }
View
BIN  admin/images/btn-icon-s1c742dc591.png
Deleted file not rendered
View
BIN  admin/images/btn-icon-s4a0551bc3f.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN  admin/images/btn-icon/back.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
BIN  admin/images/btn-icon/back_disabled.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
2  css/AssetUploadField.css
@@ -7,6 +7,7 @@
#AssetUploadField { border-bottom: 0; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; }
.ss-assetuploadfield h3 { border-bottom: 1px solid rgba(201, 205, 206, 0.8); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); -o-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8); margin: 0 0 8px; padding: 0 0 7px; clear: both; }
+.ss-assetuploadfield .field { border-bottom: 0; }
.ss-assetuploadfield .ss-uploadfield-files { margin: 0; padding: 0; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item { border: 1px solid #b3b3b3; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; -moz-background-clip: padding; -webkit-background-clip: padding; -o-background-clip: padding-box; -ms-background-clip: padding-box; -khtml-background-clip: padding-box; background-clip: padding-box; background: #E2E2E2; margin: 0 0 5px; padding: 0; overflow: hidden; position: relative; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-preview { position: absolute; height: 30px; width: 40px; overflow: hidden; z-index: 1; }
@@ -30,7 +31,6 @@
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-cancel button { display: block; overflow: hidden; text-indent: -9999px; padding: 0; margin: 0; border: 0; width: 16px; height: 16px; cursor: pointer; -moz-box-shadow: none; -webkit-box-shadow: none; -o-box-shadow: none; box-shadow: none; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform { /* don't use display none, for it will break jQuery('iframe').contents().height() */ height: 0; overflow: hidden; clear: both; }
.ss-assetuploadfield .ss-uploadfield-files .ss-uploadfield-item-editform iframe { width: 100%; }
-.ss-assetuploadfield .ss-uploadfield-addfile { height: 70px; padding: 5px 15px 15px; }
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-info { float: left; margin: 19px 0 0; }
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-fromcomputer { position: relative; overflow: hidden; display: block; margin: 0 10px 0 0; }
.ss-assetuploadfield .ss-uploadfield-addfile .ss-uploadfield-item-uploador { float: left; font-weight: bold; font-size: 22px; padding: 0 20px; line-height: 70px; display: none; }
View
6 scss/AssetUploadField.scss
@@ -16,6 +16,10 @@
padding: 0 0 7px;
clear: both;
}
+
+ .field {
+ border-bottom: 0;
+ }
.ss-uploadfield-files {
margin: 0;
@@ -162,8 +166,6 @@
}
}
.ss-uploadfield-addfile {
- height: 70px;
- padding: 5px 15px 15px;
.ss-uploadfield-item-info {
float: left;
View
22 templates/AssetUploadField.ss
@@ -1,4 +1,12 @@
-<div class="ss-uploadfield-item ss-uploadfield-addfile">
+<div class="ss-uploadfield-item ss-uploadfield-addfile field">
+
+ <h3>
+ <span class="step-label">
+ <span class="flyout">1</span><span class="arrow"></span>
+ <span class="title"><% _t('AssetUploadField.ChooseFiles', 'Choose files') %></span>
+ </span>
+ </h3>
+
<div class="ss-uploadfield-item-info">
<label class="ss-uploadfield-fromcomputer ss-ui-button ss-ui-action-constructive" title="<% _t('AssetUploadField.FROMCOMPUTERINFO', 'Upload from your computer') %>" data-icon="drive-upload">
<% _t('AssetUploadField.FROMCOMPUTER', 'Choose files from your computer') %>
@@ -18,5 +26,13 @@
</div>
<div class="clear"><!-- --></div>
</div>
-<h3 class="ss-uploadfield-editandorganize"><% _t('AssetUploadField.EDITANDORGANIZE', 'Edit & organize') %></h3>
-<ul class="ss-uploadfield-files files"></ul>
+
+<div class="ss-uploadfield-editandorganize">
+ <h3>
+ <span class="step-label">
+ <span class="flyout">2</span><span class="arrow"></span>
+ <span class="title"><% _t('AssetUploadField.EDITANDORGANIZE', 'Edit & organize') %></span>
+ </span>
+ </h3>
+ <ul class="ss-uploadfield-files files"></ul>
+</div>
Please sign in to comment.
Something went wrong with that request. Please try again.