Files
awx/awx/ui/static/js/setup-menu/setup-item.block.less
2015-05-28 16:04:27 -04:00

89 lines
1.7 KiB
Plaintext

/** @define SetupItem */
@import 'shared/branding/colors.less';
.SetupItem {
@icon-small-size: 2.4rem;
@icon-large-size: 3.4rem;
&--aside {
padding-bottom: @vertical-basis / 2;
}
@vertical-basis: 1.4rem;
padding: @vertical-basis 0;
color: black;
flex: 1 0 100%;
transition: background-color 0.15s ease-in-out;
background-color: white;
&:hover, &:focus, &:active {
color: black;
}
&--hoverable {
&:hover {
background-color: lighten(@ansible-red, 28%);
}
}
&-icon {
// height: 28px;
&--aside {
align-self: flex-start;
}
// For some reason, credentials
// icon is taking up more space
// than it should; need to adjust
// it manually to line it up with
// others
&--credentials {
width: 4.3rem;
margin-left: -0.8rem;
}
flex: none; // do not let the flex container adjust this width!
width: @icon-large-size;
align-self: center;
}
&--noIcon {
margin-left: @icon-large-size + 1.4rem; // 1.4rem comes from Media-figure margin
}
&--button {
border: 0;
text-align: left;
outline: none;
.SetupItem-icon {
// width: 100%;
}
}
&-title {
&--aside {
font-size: 1.4rem;
font-weight: bold;
}
font-size: 2.8rem;
padding-bottom: 0.4rem;
margin: 0;
}
&-description {
&--aside {
font-size: 1rem;
font-style: italic;
}
font-family: merriweather;
font-weight: lighter;
color: black;
font-size: 1.4rem;
margin: 0;
}
}