webhooks form and single view

stable
Xavier Julián 2015-01-21 14:16:39 +01:00 committed by David Barragán Merino
parent a0d93abff4
commit 8c25f0bad1
2 changed files with 57 additions and 8 deletions

View File

@ -19,10 +19,8 @@ block content
section.webhooks-table.basic-table
div.table-header
div.row
div.webhook-service
span Name
div.webhook-url
span URL
div.webhook-service Name
div.webhook-url URL
div.webhook-options
div.table-body
form.row
@ -40,11 +38,12 @@ block content
span Slack
div.webhook-url
span http://slack.kjrw3543m/nwdlkw4m535/ffm
a(href="", title="Test history") Test history
a(href="", title="Test history") (See test history)
div.webhook-options
div.webhook-options-wrapper
a.icon.icon-floppy(href="", title="Save Webhook")
a.icon.icon-edit(href="", title="Edit Webhook")
a.icon.icon-cancel(href="", title="Cancel Webhook")
a.icon.icon-delete(href="", title="Delete Webhook")
//
form

View File

@ -1,4 +1,26 @@
.admin-webhooks {
.webhooks-table {
.row {
padding: .5rem 0;
}
.row:hover {
.webhook-options-wrapper {
opacity: 1;
transition: opacity .2s linear;
}
}
}
.table-header {
@extend %bold;
border-bottom: 1px solid $gray-light;
}
.table-body {
.webhook-service {
color: $gray;
}
}
.webhooks-options {
margin-bottom: 1rem;
text-align: right;
@ -16,12 +38,40 @@
.webhook-url {
flex-basis: 400px;
flex-grow: 8;
span {
@include ellipsis($width: 65%);
color: $gray-light;
display: inline-block;
vertical-align: middle;
}
a {
color: $green-taiga;
margin-left: .5rem;
&:hover {
color: $fresh-taiga;
}
}
}
.webhook-options {
flex-basis: 100px;
flex-grow: 0;
min-width: 100px;
text-align: center;
a {
color: $gray-light;
margin-right: .5rem;
transition: color .2s linear;
vertical-align: middle;
&:hover {
color: $green-taiga;
transition: color .2s linear;
}
}
}
.webhook-options-wrapper {
opacity: 0;
transition: opacity .3s linear;
}
.webhook-url-inputs {
display: flex;