diff --git a/ui/js/component/publishForm/view.jsx b/ui/js/component/publishForm/view.jsx index 16323f28a..3a2416644 100644 --- a/ui/js/component/publishForm/view.jsx +++ b/ui/js/component/publishForm/view.jsx @@ -542,7 +542,6 @@ class PublishForm extends React.PureComponent {
{ diff --git a/ui/scss/component/_file-selector.scss b/ui/scss/component/_file-selector.scss index 31dc20d81..8172da203 100644 --- a/ui/scss/component/_file-selector.scss +++ b/ui/scss/component/_file-selector.scss @@ -1,3 +1,8 @@ +.form-field--file, +.form-field--directory { + width: 100%; +} + .file-selector { display: flex; } @@ -11,4 +16,8 @@ .file-selector__path { font-size: 14px; + flex-grow: 2; + .input-copyable { + width: 100%; + } } diff --git a/ui/scss/component/_form-field.scss b/ui/scss/component/_form-field.scss index 8fc120787..0021efe86 100644 --- a/ui/scss/component/_form-field.scss +++ b/ui/scss/component/_form-field.scss @@ -27,19 +27,22 @@ input[type="text"].input-copyable { background: var(--input-bg); - border-bottom: var(--input-border-size) solid var(--input-border-color); color: var(--input-color); line-height: 1; padding-top: $spacing-vertical * 1/3; padding-bottom: $spacing-vertical * 1/3; - width: var(--input-width); padding-left: 5px; padding-right: 5px; width: 100%; - &:focus { - border-color: var(--color-primary); - background: none !important; - } +} + +input[readonly] { + border-bottom: 1px dashed var(--input-border-color) !important; +} + +input[readonly]:focus { + background: var(--input-bg) !important; + border-bottom: 1px dashed var(--input-border-color !important); } .form-field { @@ -81,9 +84,6 @@ input[type="text"].input-copyable { -webkit-appearance: none; background: var(--input-bg); color: var(--input-color); - &[readonly] { - background-color: var(--input-bg); - } } input[type="text"],