diff --git a/app/assets/javascripts/admin/components/themes-list.js.es6 b/app/assets/javascripts/admin/components/themes-list.js.es6
index 56006005886..b97ecfd9b6e 100644
--- a/app/assets/javascripts/admin/components/themes-list.js.es6
+++ b/app/assets/javascripts/admin/components/themes-list.js.es6
@@ -61,18 +61,6 @@ export default Ember.Component.extend({
}
},
- didRender() {
- this._super(...arguments);
-
- // hide scrollbar
- const $container = this.$(".themes-list-container");
- const containerNode = $container[0];
- if (containerNode) {
- const width = containerNode.offsetWidth - containerNode.clientWidth;
- $container.css("width", `calc(100% + ${width}px)`);
- }
- },
-
actions: {
changeView(newTab) {
if (newTab !== this.get("currentTab")) {
diff --git a/app/assets/javascripts/admin/templates/components/themes-list.hbs b/app/assets/javascripts/admin/templates/components/themes-list.hbs
index eff53727149..f605d21d5bb 100644
--- a/app/assets/javascripts/admin/templates/components/themes-list.hbs
+++ b/app/assets/javascripts/admin/templates/components/themes-list.hbs
@@ -37,4 +37,11 @@
{{I18n "admin.customize.theme.empty"}}
{{/if}}
-
\ No newline at end of file
+
+
+
+
+
+ {{d-button label="admin.customize.new" icon="plus" action=(route-action "showCreateModal") class="btn-primary"}}
+ {{d-button action=(route-action "importModal") icon="upload" label="admin.customize.import" class="btn-default"}}
+
diff --git a/app/assets/javascripts/admin/templates/customize-themes.hbs b/app/assets/javascripts/admin/templates/customize-themes.hbs
index 268febd4352..74186ca728c 100644
--- a/app/assets/javascripts/admin/templates/customize-themes.hbs
+++ b/app/assets/javascripts/admin/templates/customize-themes.hbs
@@ -1,12 +1,5 @@
{{#unless editingTheme}}
-
{{themes-list themes=fullThemes components=childThemes currentTab=currentTab}}
+
{{/unless}}
{{outlet}}
diff --git a/app/assets/stylesheets/common/admin/customize.scss b/app/assets/stylesheets/common/admin/customize.scss
index dcbaf0212e9..a5f26939a48 100644
--- a/app/assets/stylesheets/common/admin/customize.scss
+++ b/app/assets/stylesheets/common/admin/customize.scss
@@ -59,19 +59,6 @@
}
.admin-customize.admin-customize-themes {
- .customize-themes-header {
- border-bottom: 1px solid $primary-low;
- padding-bottom: 8px;
- display: flex;
-
- .title {
- color: $primary-medium;
- flex-grow: 1;
- h3 {
- margin-bottom: 0;
- }
- }
- }
.admin-container {
padding: 0;
}
@@ -141,6 +128,12 @@
font-size: $font-up-4;
font-weight: bold;
margin-bottom: 10px;
+ a {
+ font-size: $font-down-2;
+ }
+ .btn {
+ line-height: $line-height-small;
+ }
}
.theme-description {
@@ -217,16 +210,17 @@
}
}
.themes-list {
- border-right: 1px solid $primary-low;
- border-bottom: 1px solid $primary-low;
display: inline-block;
- overflow: hidden;
+ .create-actions {
+ margin-top: 0.5em;
+ }
}
.themes-list-header {
width: 100%;
border-bottom: 1px solid $primary-low;
-
+ border-top: 1px solid $primary-low;
+ border-right: 1px solid $primary-low;
.tab {
display: inline-block;
padding: 10px;
@@ -237,7 +231,8 @@
&.active {
font-weight: bold;
- color: $tertiary;
+ color: $secondary;
+ background: $danger;
}
&:not(.active) {
@@ -251,10 +246,18 @@
}
.themes-list-container {
- overflow-y: scroll;
+ overflow-y: auto;
box-sizing: content-box;
- max-height: 700px;
- width: 100%; /* overridden in javascript to hide scrollbar */
+ max-height: 60vh;
+ @media screen and (max-height: 1000px) {
+ max-height: 50vh;
+ }
+ @media screen and (max-height: 800px) {
+ max-height: 40vh;
+ }
+ border-right: 1px solid $primary-low;
+ border-bottom: 1px solid $primary-low;
+ width: 100%;
.themes-list-item:last-child {
border-bottom: none;
@@ -311,15 +314,12 @@
.info {
overflow: hidden;
+ display: flex;
font-weight: bold;
font-size: $font-up-1;
- .name {
- float: left;
- }
-
.icons {
- float: right;
+ margin-left: auto;
}
}
diff --git a/app/assets/stylesheets/desktop/admin_customize.scss b/app/assets/stylesheets/desktop/admin_customize.scss
index 73ef095ec10..d816db9b72a 100644
--- a/app/assets/stylesheets/desktop/admin_customize.scss
+++ b/app/assets/stylesheets/desktop/admin_customize.scss
@@ -1,16 +1,10 @@
.admin-customize {
.show-current-style {
- padding-left: 10px;
- padding-top: 10px;
- width: 70%;
+ padding-left: 2%;
+ width: 68%;
}
.themes-list {
width: 28%;
}
-
- .customize-themes-header {
- flex-direction: row;
- align-items: center;
- }
}
diff --git a/app/assets/stylesheets/mobile/admin_customize.scss b/app/assets/stylesheets/mobile/admin_customize.scss
index 76676e67448..0bacd8c6587 100644
--- a/app/assets/stylesheets/mobile/admin_customize.scss
+++ b/app/assets/stylesheets/mobile/admin_customize.scss
@@ -6,10 +6,10 @@
.themes-list {
width: 100%;
+ margin-bottom: 1em;
}
-
- .customize-themes-header {
- flex-direction: column;
- align-items: flex-start;
+ .form-horizontal.theme.settings .setting-label,
+ .admin-container .select-kit {
+ width: 100%;
}
}