packages/ui/lib/components/UserPluginsItem/styles.scss
@import '../../common.scss';
.user_plugins_item {
position: relative;
display: flex;
align-items: flex-start;
flex-flow: row;
width: 100%;
margin-top: 1em;
padding: 1em;
color: $white;
border: 1px solid $background2;
background: rgba($background2, 0.35);
@include roundCorners;
&.error {
border: 3px solid $red;
}
span.link {
color: rgba($white, 0.6);
cursor: pointer;
&:hover,
&:active,
&:focus {
color: $white;
}
}
label {
color: $white;
font-weight: bold;
line-height: 2em;
margin-right: 0.5em;
}
.plugin_icon {
position: relative;
display: flex;
width: 4em;
min-width: 4em;
height: 4em;
min-height: 4em;
margin: 1em;
@include center;
img {
width: 100%;
}
}
.plugin_info {
display: flex;
flex-flow: column;
width: 100%;
color: rgba($white, 0.6);
}
.plugin_name {
color: $white;
font-size: 1.5em;
line-height: 1.5em;
}
.plugin_footer {
display: flex;
flex-flow: row;
justify-content: space-between;
align-items: flex-end;
}
.error_message {
color: $red;
font-size: 1.25em;
font-weight: bold;
line-height: 1.5em;
margin-top: 1em;
}
}