diff --git a/app/assets/javascripts/admin/templates/permalinks.hbs b/app/assets/javascripts/admin/templates/permalinks.hbs
index 068d1afdcaf..4dd43005997 100644
--- a/app/assets/javascripts/admin/templates/permalinks.hbs
+++ b/app/assets/javascripts/admin/templates/permalinks.hbs
@@ -1,5 +1,7 @@
-
{{i18n 'admin.permalink.title'}}
-
+
+
{{i18n 'admin.permalink.title'}}
+
+
{{text-field value=filter class="url-input" placeholderKey="admin.permalink.form.filter" autocorrect="off" autocapitalize="off"}}
{{permalink-form action="recordAdded"}}
diff --git a/app/assets/stylesheets/common/admin/customize.scss b/app/assets/stylesheets/common/admin/customize.scss
index ce73260b585..9c8cadc6640 100644
--- a/app/assets/stylesheets/common/admin/customize.scss
+++ b/app/assets/stylesheets/common/admin/customize.scss
@@ -574,19 +574,38 @@
.external_url,
.post {
text-overflow: ellipsis;
- white-space: nowrap;
+ }
+
+ &.grid tr.admin-list-item {
+ grid-template-columns: unset;
+ }
+}
+
+.permalink-search {
+ text-align: left;
+ @media screen and (min-width: map-get($breakpoints, tablet)) {
+ text-align: right;
}
}
.permalink-form {
+ align-items: flex-start;
display: flex;
- align-items: center;
+ flex-direction: column;
+ flex-wrap: wrap;
+ @media screen and (min-width: map-get($breakpoints, tablet)) {
+ align-items: center;
+ flex-direction: row;
+ }
.select-kit {
width: 150px;
}
input {
- margin: 0 5px;
+ margin: 5px 0;
+ @media screen and (min-width: map-get($breakpoints, tablet)) {
+ margin: 0 5px;
+ }
}
}