ENHANCEMENT: Adapt the Widgets Editor CMS UI to fit SS 3.0

This commit is contained in:
Ryan Wachtl 2013-01-05 13:11:04 -06:00
parent a7ac169826
commit 2258c55dcb
11 changed files with 147 additions and 80 deletions

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
.sass-cache

15
config.rb Normal file
View File

@ -0,0 +1,15 @@
# Require any additional compass plugins here.
project_type = :stand_alone
# Set this to the root of your project when deployed:
http_path = "/"
css_dir = "css"
sass_dir = "scss"
images_dir = "images"
javascripts_dir = "javascript"
output_style = :compact
line_comments = false
# To enable relative paths to assets via compass helper functions. Uncomment:
# relative_assets = true
asset_cache_buster = :none

View File

@ -1,81 +1,20 @@
div.availableWidgetsHolder {
width: 30%;
}
@charset "UTF-8";
.WidgetAreaEditor p { margin-bottom: 15px; }
div.usedWidgetsHolder {
width: 66%;
max-width: 745px;
}
.Widget { padding: 0 7px 7px 7px; margin: 16px 0 16px 0; color: #1f1f1f; background-color: #b0bec7; background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzkyYTViMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=="); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #92a5b2)); background-image: -webkit-linear-gradient(#b0bec7, #92a5b2); background-image: -moz-linear-gradient(#b0bec7, #92a5b2); background-image: -o-linear-gradient(#b0bec7, #92a5b2); background-image: linear-gradient(#b0bec7, #92a5b2); border-top: 1px solid #c2cdd4; border-bottom: 1px solid #748d9d; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
.Widget h3 { margin: 0; padding: 0; line-height: 40px; text-shadow: #bfcad2 1px 1px 0; -webkit-transition-property: background-image; -moz-transition-property: background-image; -o-transition-property: background-image; transition-property: background-image; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; -o-transition-duration: 0.2s; transition-duration: 0.2s; -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; }
.Widget .widgetDescription { background: #eceff1; padding: 5px 5px 1px 5px; margin: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
.Widget .widgetFields { background: #eceff1; padding: 5px; margin: 7px 0 0 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
div.availableWidgetsHolder {
float: left;
}
.availableWidgetsHolder { width: 38%; float: left; }
div.usedWidgetsHolder {
float: right;
}
.availableWidgets .Widget h3 { cursor: pointer; background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABR0RVh0Q3JlYXRpb24gVGltZQAxLzUvMTOqzuI/AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAA8tJREFUSImdlk1MHGUYx38zO7u4s18sC10DBItFEEttUAmaTtFTJ34c9MBc/Iw99qDRHjx6682D9lBvatJotibGaGrWg4k6mgBWuggWKA1oKcm2wLJfs7A7s+OB3XRZ2Q/4n2ae9//+/8/zJu/zvAIHQCSqB4CHAAtY0VQl22iPbdsACE2Iq8C7wGkBCpIkLQOCaZpduxLEgE+Bq5qqGAc2ikT1l4GPXE5pqzscynaHQ49LDoe/kmNaVmo1vjGzGt/w5AumG/gQ+EZTlXxDo0hUDwMXREF4buiRnlR7q/9ko6oB1rdSsblbt12WVZwEzmuqsl7TKBLVZeA7n+x2Dg/2nqyuoBlMzS7paSNXAF7QVGW7bCRWmDiBz3yy2zUy1Hf6MCYAI0N9ik92O4GPI1HdU46LFZyzDlEcGhnqU+oJpTLGYipjLDYyczhEBXitHHOUqnkQiDw5+PBOi8sZqiWwdi8xMXPzn561ewlZEIRrrT5PTy1uONSaX41vPPP3rdtfHT/Wky1X9JZPds/7vXJ/vUwTyXQO+B7Qs8a2WY/rbnF1+WT3KjAO94/ujYGjneF6Gw+Dgd7OI8CbAGIkqocFONKomgpsAwaCYDci+j3ygCgIgSs//iaLwBNOp/RvMw5504LdTjCTL5gNuwqAJDkywAkJOBH0eZLVhLV7iYmF5dVjNnhLIQtIAj8ArkQqo/w0+ZdB6fgFyA70di11drSNVuoEfZ5kfDM5LAEd+2WSSKZzNnyuqcr5Gsm+WPkTiepXNpOZ9s6Otv24XglI7bcSDHjd8c3ke5Go/k4pVASmNVV5OhLVu4DLwAggldYdbQHvHzWSuisB1xPp7CvVK50dbaOl7MpCTM8vb0ei+jkgGPR7GX60V67aNlr1TyKd9QMxCZgsmFZXjUz2wCk5bGAMcLp2vxvCNK0AcFPUVCVu2/adRm2l2rMZUipjLBZtOz1+5pRRvrBfLKysxQ9g1BQWVtbuAp/A/c7wZdrIHW1UVVvA6waeB8Y88gNSPW5uJ38nbeT6ga+hYh5FovpZhyi+/+xTxwfrCZSTadRJfr42N2dZxYvjZ05dqqwI4LJVLE5MzS7p9QT8Xrm/kcnU7JJuWcVfNFW5VI7tN8q/9cnu4GEmrGlZqekby7G0kdsCXtdUJfm/CVuBt9NGbkH/88b6+lYq1qzJ+lYq9vv1+eW0kZsAXtVUZU9bq/cKegm44HJKO93hUC4cau11t7j23LeqV5AEfKCpytVKzkHedWPAOUAB2l1Oac62oWCajwEbgA5c1FTl1/32l43+A2DVjDi0+ffsAAAAAElFTkSuQmCC"); background-position: center right; background-repeat: no-repeat; }
.availableWidgets .Widget h3:hover { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABR0RVh0Q3JlYXRpb24gVGltZQAxLzUvMTOqzuI/AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAABANJREFUSImdlltsVFUUhr8znbZzbUO4VDPJcZqWSgfqxCalNT1tuEQOXh6UyHkQUQvEmKCxoTwY2wcSW4khEESiQIIXTKMZRGM0mMMDJHpqHILiNG0tnTYzGZwYCjV0rp3ScnxwJkxrOzPt/7bX/tf619rZe60tsAR4VK0ceASYBYKKLMXz+ei6DoBQQHAZaAdadF2/l4jHAoBgsdocgiAA+IDTwEVFlhJLFvKo2nPAsVg0crfvshrXLl96bCqZKMvmmMyWSPPmJ/ulrdutNnuZGTgEfKvI0nReIY+qVQCHZ2dmNp07/UFkyPe7O1/VAC53ve/FfftLSktNV4GDiizdWVTIo2oW4PtwKFh86miPe34FhaC9q0dziM57wNOKLE1lhAxZIsXAZ+FQsOR4d2fLckQAjnd3SuFQsBg44VE1a8ZuyOLsnU6lNhzv7pRyBRIrq0fEyuqRfGKp1JQEvJSxFaWreQjwfHTk3dTk3X9WLhZgo7TJ2/ZGh9jYstlyf3b2t4D/hrgY13ft12lp6/YnhsZufrW+SoxnKno1HAoOhwKjNbkyramtSwI/ANrDDnEmF3fi9rgjHAr+BeyEB0f38je9n1bkclwOLvR+sgZ4BcDgUbUKXdfX5KsmC1NAQid9nXLgZmDs0dmZmfLzl/osBqA+HouGClGw2O3wXyfot9rL8nYVgGQyEQPqjEDd2PDQ5HzCRmmT94Xd+6oEQbClTbPAJPAjULJ23XrpyJneBOnj13U9fuGLs6Ne7Upjdpyx4aFJd0PT40Zg9UKZ1NTWJQVB+FyRpYOLJPtM9sKjaufXujas8mpXFuLajEBkoR3/nwNmd0PTAY+qvZU23QeuK7LU5FE1B9ALNADG9H6Rf2jg2iJJjRuBP6rWuZ6fv+PVrjSms8sE4rUD70x5VG0/sMI/PMiZY+9Z5rk1zltTtc5VBviMwFWL1eZYJJM5SMSiOtAKFCei0by3DsBstpQDfoMiS7cMBkM4X1uZh+JCSGJl9UiR0Rjdua05kXmw53bsaru1BKGCsGNX2zjwITzoDF86RKczX1X+oQEz8BTQ+nc4ZMzFXbl6TdghOmuAryFrHnlUbe90KtXR+eae2lwBMsnk6yTdJ84OlppMJ3duaz6VXRFAb0lpqbe9q0fLFSAUGK3JJ9Le1aOVmkw/KbJ0KmNbaJR/Fw4FVyxnwprMlsjrHZ0+h+i8C+xWZGnyfxM2C3scovPGoaMf33G5632Firjc9b7O908EHKLTC+xSZGlOW8v1C3oWOByLRlJ9l9Xk9au/VE7cHp/z3kxmS0Tasq2/eYtstdnLjMDbiixdzOYs5V/XCuwHJGBVLBoZFAQBq83uAiYADTipyNLPC/lnhP4FKHOWW0c+c/gAAAAASUVORK5CYII="); }
div.usedWidgets .ui-state-highlight {
background: #EEEEEE;
border: 1px solid #DDDDDD;
width: 98%;
margin-bottom: 5px;
}
.usedWidgetsHolder { width: 60%; float: right; }
.NoWidgets {
padding: 50px; /* Make this nice and big and easily 'droppable' */
}
.usedWidgets .Widget h3 { cursor: move; }
.usedWidgets .Widget .deleteWidget { text-align: right; padding-top: 11px; margin-bottom: 3px; }
div.usedWidgets div.Widget,
div.availableWidgets div.Widget {
width: 98%;
border: 1px solid #ddd;
border-top: none;
margin-bottom: 10px;
background: #F0F3F4;
}
div.widgetDescription{
padding: 10px 0;
}
div.widgetDescription p,
div.widgetFields {
padding: 0 8px;
color: #666;
font-size: 11px;
}
p.deleteWidget {
margin: 0 0 4px;
height: 22px;
line-height: 2.2;
font-size: 12px;
}
span.widgetDelete {
padding-left: 20px;
margin-right: 8px;
float: right;
background: url(../images/delete.gif) no-repeat left center;
cursor: pointer;
}
div.usedWidgets div.Widget h3,
div.availableWidgets div.Widget h3 {
font-size: 12px;
color: #fff;
line-height: 1.8;
padding: 0 5px;
margin: 0;
}
div.usedWidgets div.Widget h3 {
cursor: move;
background: #000 url(../images/handled-bg.png) right top;
}
div.availableWidgets div.Widget h3 {
cursor: pointer;
color: #444;
padding-right: 25px;
background: #ccc url(../images/add-bg.png) right center;
}
div.availableWidgets div.Widget h3:hover {
background: #ccc url(../images/add-bg-hover.png) right center;
}
@media only screen and (max-width: 1279px) { .availableWidgetsHolder { width: 100%; float: none; margin-bottom: 20px; }
.usedWidgetsHolder { width: 100%; float: none; } }

Binary file not shown.

Before

Width:  |  Height:  |  Size: 621 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 578 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 356 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.7 KiB

106
scss/WidgetAreaEditor.scss Normal file
View File

@ -0,0 +1,106 @@
@import "settings";
// root widget area editor container
.WidgetAreaEditor {
h2 {
}
p {
margin-bottom: 15px;
}
}
// base styles for a widget
.Widget {
padding: 0 7px 7px 7px;
margin: 16px 0 16px 0;
color: #1f1f1f;
background-color: #b0bec7;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2IwYmVjNyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzkyYTViMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b0bec7), color-stop(100%, #92a5b2));
background-image: -webkit-linear-gradient(#b0bec7, #92a5b2);
background-image: -moz-linear-gradient(#b0bec7, #92a5b2);
background-image: -o-linear-gradient(#b0bec7, #92a5b2);
background-image: linear-gradient(#b0bec7, #92a5b2);
border-top: 1px solid #c2cdd4;
border-bottom: 1px solid #748d9d;
@include border-radius(3px);
h3 {
margin: 0;
padding: 0;
line-height: 40px;
text-shadow: #bfcad2 1px 1px 0;
@include transition-property(background-image);
@include transition-duration(0.2s);
@include transition-timing-function(ease-out);
}
.widgetDescription {
background: #eceff1;
padding: 5px 5px 1px 5px;
margin: 0;
@include border-radius(3px);
}
.widgetFields {
background: #eceff1;
padding: 5px;
margin: 7px 0 0 0;
@include border-radius(3px);
}
}
// container for available widgets
.availableWidgetsHolder {
width: 38%;
float: left;
}
.availableWidgets {
.Widget {
h3 {
cursor: pointer;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABR0RVh0Q3JlYXRpb24gVGltZQAxLzUvMTOqzuI/AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAA8tJREFUSImdlk1MHGUYx38zO7u4s18sC10DBItFEEttUAmaTtFTJ34c9MBc/Iw99qDRHjx6682D9lBvatJotibGaGrWg4k6mgBWuggWKA1oKcm2wLJfs7A7s+OB3XRZ2Q/4n2ae9//+/8/zJu/zvAIHQCSqB4CHAAtY0VQl22iPbdsACE2Iq8C7wGkBCpIkLQOCaZpduxLEgE+Bq5qqGAc2ikT1l4GPXE5pqzscynaHQ49LDoe/kmNaVmo1vjGzGt/w5AumG/gQ+EZTlXxDo0hUDwMXREF4buiRnlR7q/9ko6oB1rdSsblbt12WVZwEzmuqsl7TKBLVZeA7n+x2Dg/2nqyuoBlMzS7paSNXAF7QVGW7bCRWmDiBz3yy2zUy1Hf6MCYAI0N9ik92O4GPI1HdU46LFZyzDlEcGhnqU+oJpTLGYipjLDYyczhEBXitHHOUqnkQiDw5+PBOi8sZqiWwdi8xMXPzn561ewlZEIRrrT5PTy1uONSaX41vPPP3rdtfHT/Wky1X9JZPds/7vXJ/vUwTyXQO+B7Qs8a2WY/rbnF1+WT3KjAO94/ujYGjneF6Gw+Dgd7OI8CbAGIkqocFONKomgpsAwaCYDci+j3ygCgIgSs//iaLwBNOp/RvMw5504LdTjCTL5gNuwqAJDkywAkJOBH0eZLVhLV7iYmF5dVjNnhLIQtIAj8ArkQqo/w0+ZdB6fgFyA70di11drSNVuoEfZ5kfDM5LAEd+2WSSKZzNnyuqcr5Gsm+WPkTiepXNpOZ9s6Otv24XglI7bcSDHjd8c3ke5Go/k4pVASmNVV5OhLVu4DLwAggldYdbQHvHzWSuisB1xPp7CvVK50dbaOl7MpCTM8vb0ei+jkgGPR7GX60V67aNlr1TyKd9QMxCZgsmFZXjUz2wCk5bGAMcLp2vxvCNK0AcFPUVCVu2/adRm2l2rMZUipjLBZtOz1+5pRRvrBfLKysxQ9g1BQWVtbuAp/A/c7wZdrIHW1UVVvA6waeB8Y88gNSPW5uJ38nbeT6ga+hYh5FovpZhyi+/+xTxwfrCZSTadRJfr42N2dZxYvjZ05dqqwI4LJVLE5MzS7p9QT8Xrm/kcnU7JJuWcVfNFW5VI7tN8q/9cnu4GEmrGlZqekby7G0kdsCXtdUJfm/CVuBt9NGbkH/88b6+lYq1qzJ+lYq9vv1+eW0kZsAXtVUZU9bq/cKegm44HJKO93hUC4cau11t7j23LeqV5AEfKCpytVKzkHedWPAOUAB2l1Oac62oWCajwEbgA5c1FTl1/32l43+A2DVjDi0+ffsAAAAAElFTkSuQmCC');
background-position: center right;
background-repeat: no-repeat;
&:hover {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABR0RVh0Q3JlYXRpb24gVGltZQAxLzUvMTOqzuI/AAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAABANJREFUSImdlltsVFUUhr8znbZzbUO4VDPJcZqWSgfqxCalNT1tuEQOXh6UyHkQUQvEmKCxoTwY2wcSW4khEESiQIIXTKMZRGM0mMMDJHpqHILiNG0tnTYzGZwYCjV0rp3ScnxwJkxrOzPt/7bX/tf619rZe60tsAR4VK0ceASYBYKKLMXz+ei6DoBQQHAZaAdadF2/l4jHAoBgsdocgiAA+IDTwEVFlhJLFvKo2nPAsVg0crfvshrXLl96bCqZKMvmmMyWSPPmJ/ulrdutNnuZGTgEfKvI0nReIY+qVQCHZ2dmNp07/UFkyPe7O1/VAC53ve/FfftLSktNV4GDiizdWVTIo2oW4PtwKFh86miPe34FhaC9q0dziM57wNOKLE1lhAxZIsXAZ+FQsOR4d2fLckQAjnd3SuFQsBg44VE1a8ZuyOLsnU6lNhzv7pRyBRIrq0fEyuqRfGKp1JQEvJSxFaWreQjwfHTk3dTk3X9WLhZgo7TJ2/ZGh9jYstlyf3b2t4D/hrgY13ft12lp6/YnhsZufrW+SoxnKno1HAoOhwKjNbkyramtSwI/ANrDDnEmF3fi9rgjHAr+BeyEB0f38je9n1bkclwOLvR+sgZ4BcDgUbUKXdfX5KsmC1NAQid9nXLgZmDs0dmZmfLzl/osBqA+HouGClGw2O3wXyfot9rL8nYVgGQyEQPqjEDd2PDQ5HzCRmmT94Xd+6oEQbClTbPAJPAjULJ23XrpyJneBOnj13U9fuGLs6Ne7Upjdpyx4aFJd0PT40Zg9UKZ1NTWJQVB+FyRpYOLJPtM9sKjaufXujas8mpXFuLajEBkoR3/nwNmd0PTAY+qvZU23QeuK7LU5FE1B9ALNADG9H6Rf2jg2iJJjRuBP6rWuZ6fv+PVrjSms8sE4rUD70x5VG0/sMI/PMiZY+9Z5rk1zltTtc5VBviMwFWL1eZYJJM5SMSiOtAKFCei0by3DsBstpQDfoMiS7cMBkM4X1uZh+JCSGJl9UiR0Rjdua05kXmw53bsaru1BKGCsGNX2zjwITzoDF86RKczX1X+oQEz8BTQ+nc4ZMzFXbl6TdghOmuAryFrHnlUbe90KtXR+eae2lwBMsnk6yTdJ84OlppMJ3duaz6VXRFAb0lpqbe9q0fLFSAUGK3JJ9Le1aOVmkw/KbJ0KmNbaJR/Fw4FVyxnwprMlsjrHZ0+h+i8C+xWZGnyfxM2C3scovPGoaMf33G5632Firjc9b7O908EHKLTC+xSZGlOW8v1C3oWOByLRlJ9l9Xk9au/VE7cHp/z3kxmS0Tasq2/eYtstdnLjMDbiixdzOYs5V/XCuwHJGBVLBoZFAQBq83uAiYADTipyNLPC/lnhP4FKHOWW0c+c/gAAAAASUVORK5CYII=');
}
}
}
}
// container for used widgets
.usedWidgetsHolder {
width: 60%;
float: right;
}
.usedWidgets {
.Widget {
h3 {
cursor: move;
}
.deleteWidget {
text-align: right;
padding-top: 11px;
margin-bottom: 3px;
}
}
}
.noWidgets {
}
// one column layout when space is limited
@media only screen and (max-width: 1279px) {
.availableWidgetsHolder {
width: 100%;
float: none;
margin-bottom: 20px;
}
.usedWidgetsHolder {
width: 100%;
float: none;
}
}

4
scss/_settings.scss Normal file
View File

@ -0,0 +1,4 @@
@charset "UTF-8";
@import "compass/css3/border-radius";
@import "compass/css3/transition";

View File

@ -2,7 +2,7 @@
<input type="hidden" id="$Name" name="$IdxField" value="$Value" />
<div class="availableWidgetsHolder">
<h2><% _t('AVAILABLE', 'Available Widgets') %></h2>
<p><% _t('AVAILWIDGETS', 'Click a widget title below to use it on this page.') %></p>
<p class="message"><% _t('AVAILWIDGETS', 'Click a widget title below to use it on this page.') %></p>
<div class="availableWidgets" id="availableWidgets-$Name">
<% if AvailableWidgets %>
<% control AvailableWidgets %>
@ -17,7 +17,7 @@
</div>
<div class="usedWidgetsHolder">
<h2><% _t('INUSE', 'Widgets currently used') %></h2>
<p><% _t('TOSORT', 'To sort currently used widgets on this page, drag them up and down.') %></p>
<p class="message"><% _t('TOSORT', 'To sort currently used widgets on this page, drag them up and down.') %></p>
<div class="usedWidgets" id="usedWidgets-$Name">
<% if UsedWidgets %>

View File

@ -3,10 +3,12 @@
<div class="widgetDescription">
<p>$Description</p>
</div>
<% if $CMSEditor %>
<div class="widgetFields">
$CMSEditor
<input type="hidden" name="$Name[Type]" value="$ClassName" />
<input type="hidden" name="$Name[Sort]" value="$Sort" />
</div>
<p class="deleteWidget"><span class="widgetDelete"><% _t('DELETE', 'Delete') %></span></p>
<% end_if %>
<input type="hidden" name="$Name[Type]" value="$ClassName" />
<input type="hidden" name="$Name[Sort]" value="$Sort" />
<p class="deleteWidget"><span class="widgetDelete ss-ui-button"><% _t('DELETE', 'Delete') %></span></p>
</div>