[as='Popup'].titles #TitleForm {
@include display(flex); @include flex-direction(column);
}
[as='Popup'].titles #TitleForm > h2 {
text-align: center; margin: 12px 0; font-weight: 100;
}
[as='Popup'].titles #TitleForm > div.fieldset {
@include display(flex); @include flex-direction(column); margin: 0 5%;
}
[as='Popup'].titles #TitleForm > div.fieldset.title > input {
@include flex(1); border: 1px solid $gray-blue; border-radius: 2px; font-family: inherit; font-size: inherit;
}
[as='Popup'].titles #TitleForm div.actions {
@include flex-direction(row); @include justify-content(flex-end); @include align-items(center); margin: 12px 5%;
}
[as='Popup'].titles #TitleForm > div.actions p {
font-size: 0.8em; margin: 0 8px;
}
[as='Popup'].titles #TitleForm div.actions button {
@include transition(box-shadow 0.2s); @include flex(0 0 auto); text-transform: uppercase; font-size: 0.8em; font-weight: bold; padding: 4px 8px; border-radius: 2px; color: lighten($green, 35%); text-shadow: 0 -1px darken($green, 10%); text-decoration: none; background-color: darken($green, 5%); margin: 0; &:active { box-shadow: inset 0 0 1px 0 darken($green, 25%); }
}
[as='Popup'].titles #TitleForm ul.titles {
@include display(flex); @include flex-direction(column); border-top: 1px solid rgba($navy-blue, 0.5); box-shadow: inset 0 1px 0 0 rgba(white, 0.5); padding: 0 5%;
}
[as='Popup'].titles #TitleForm ul.titles > h3 {
margin: 12px auto; text-align: center;
}
[as='Popup'].titles #TitleForm ul.titles > li {
@include display(flex); @include align-items(center);
}
[as='Popup'].titles #TitleForm ul.titles > li > .name {
font-size: 1.4em; margin-left: 12px;
}
[as='Popup'].titles #TitleForm ul.titles > li > time {
@include flex(0 0 20%); font-size: 0.8em; font-weight: bold;
}