taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Basic custom field styles

stable
Xavier Julián 2015-01-30 15:17:20 +01:00 committed by David Barragán Merino
parent d95f1c474a
commit e2696d090e
2 changed files with 48 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
app/partials/includes/modules/admin/admin-us-extras.jade
View File

@ -5,14 +5,20 @@ section.custom-fields-table.basic-table
div.custom-description Description div.custom-description Description
div.custom-options div.custom-options
div.table-body div.table-body
div.row div.row.single-custom-field
div.custom-name div.custom-name Name
div.custom-description Description div.custom-description Description
div.custom-options 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 form.row
fieldset.custom-name fieldset.custom-name
input(type="text") input(type="text", placeholder="Set your custom field name")
fieldset.custom-description Description fieldset.custom-description
input(type="text") input(type="text", placeholder="Set your custom field description")
fieldset.custom-options 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")

37
app/styles/modules/admin/admin-custom-fields.scss
View File

@ -1,3 +1,40 @@
.custom-fields-table { .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;
}
} }