Basic custom field styles
parent
d95f1c474a
commit
e2696d090e
|
@ -5,14 +5,20 @@ section.custom-fields-table.basic-table
|
|||
div.custom-description Description
|
||||
div.custom-options
|
||||
div.table-body
|
||||
div.row
|
||||
div.custom-name
|
||||
div.row.single-custom-field
|
||||
div.custom-name Name
|
||||
div.custom-description Description
|
||||
div.custom-options
|
||||
div.custom-options-wrapper
|
||||
a.edit-webhook.icon.icon-edit(href="", title="Edit Custom Field")
|
||||
a.delete-webhook.icon.icon-delete(href="", title="Delete Custom Field")
|
||||
form.row
|
||||
fieldset.custom-name
|
||||
input(type="text")
|
||||
fieldset.custom-description Description
|
||||
input(type="text")
|
||||
input(type="text", placeholder="Set your custom field name")
|
||||
fieldset.custom-description
|
||||
input(type="text", placeholder="Set your custom field description")
|
||||
fieldset.custom-options
|
||||
div.custom-options-wrapper
|
||||
a.edit-webhook.icon.icon-floppy(href="", title="Save Custom Field")
|
||||
a.delete-webhook.icon.icon-delete(href="", title="Delete Custom Field")
|
||||
|
||||
|
|
|
@ -1,3 +1,40 @@
|
|||
.custom-fields-table {
|
||||
.row {
|
||||
border-bottom: 0;
|
||||
padding: .5rem 0;
|
||||
&:hover {
|
||||
.custom-options-wrapper {
|
||||
opacity: 1;
|
||||
transition: opacity .2s linear;
|
||||
}
|
||||
}
|
||||
}
|
||||
.table-header {
|
||||
@extend %bold;
|
||||
border-bottom: 1px solid $gray-light;
|
||||
}
|
||||
.single-custom-field {
|
||||
border-bottom: 1px solid $whitish;
|
||||
color: $gray;
|
||||
}
|
||||
.custom-name,
|
||||
.custom-description {
|
||||
color: $gray;
|
||||
margin-right: .5rem;
|
||||
}
|
||||
.custom-name {
|
||||
flex-grow: 1;
|
||||
}
|
||||
.custom-description {
|
||||
flex-grow: 2;
|
||||
}
|
||||
.custom-options {
|
||||
flex-basis: 200px;
|
||||
flex-grow: 0;
|
||||
}
|
||||
.custom-options-wrapper {
|
||||
opacity: 0;
|
||||
transition: opacity .3s linear;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue