ui: Fixup CSS for create pages (#9019)

ui/packages/consul-ui/app/styles/components/tabular-collection.scss

@@ -69,10 +69,10 @@ table.has-actions tr > *:nth-last-child(5):first-child ~ * {
 }
 
 /*TODO: trs only live in tables, get rid of table */
-html[data-route^='dc.acls.policies.edit'] [role='dialog'] table tr,
-html[data-route^='dc.acls.policies.edit'] table tr,
-html[data-route^='dc.acls.roles.edit'] [role='dialog'] table tr,
-html[data-route^='dc.acls.roles.edit'] main table.token-list tr {
+html[data-route^='dc.acls.policies'] [role='dialog'] table tr,
+html[data-route^='dc.acls.policies'] table tr,
+html[data-route^='dc.acls.roles'] [role='dialog'] table tr,
+html[data-route^='dc.acls.roles'] main table.token-list tr {
   @extend %tokens-minimal-row;
 }
 // this will get auto calculated later in tabular-collection.js

ui/packages/consul-ui/app/styles/layout.scss

@@ -1,8 +1,8 @@
 @import 'layouts/index';
 
 /* all forms have a margin below the header */
-html[data-route$='.create'] .app-view > header + div > *:first-child,
-html[data-route$='.edit'] .app-view > header + div > *:first-child {
+html[data-route$='create'] .app-view > header + div > *:first-child,
+html[data-route$='edit'] .app-view > header + div > *:first-child {
   margin-top: 1.8em;
 }
 /* most tabs have margin after the tab bar, unless the tab has a filter bar */
@@ -59,7 +59,8 @@ main,
 #wrapper > footer {
   @extend %content-container;
 }
-html[data-route$='.edit'] main {
+html[data-route$='create'] main,
+html[data-route$='edit'] main {
   @extend %content-container-restricted;
 }
 

ui/packages/consul-ui/app/styles/routes/dc/acls/index.scss

@@ -17,16 +17,19 @@ html[data-route^='dc.acls.index'] .filter-bar [role='radiogroup'] {
 }
 
 @media #{$--lt-wide-form} {
+  html[data-route^='dc.acls.create'] main header .actions,
   html[data-route^='dc.acls.edit'] main header .actions {
     float: none;
     display: flex;
     justify-content: space-between;
     margin-bottom: 1em;
   }
+  html[data-route^='dc.acls.create'] main header .actions .with-feedback,
   html[data-route^='dc.acls.edit'] main header .actions .with-feedback {
     position: absolute;
     right: 0;
   }
+  html[data-route^='dc.acls.create'] main header .actions .with-confirmation,
   html[data-route^='dc.acls.edit'] main header .actions .with-confirmation {
     margin-top: 0;
   }

ui/packages/consul-ui/app/styles/routes/dc/kv/index.scss

@@ -1,4 +1,4 @@
-html[data-route^='dc.kv.edit'] .type-toggle {
+html[data-route^='dc.kv'] .type-toggle {
   float: right;
   margin-bottom: 0 !important;
 }