btcpayserver/BTCPayServer/wwwroot/main/wizard.css
Dennis Reimann bb4a28ecd8 Refactor Authorize UI
Closes #2902.
2022-06-29 15:36:54 +02:00

120 lines
2.1 KiB
CSS

body {
color: var(--btcpay-wizard-text);
background-color: var(--btcpay-wizard-bg);
}
#wizard-navbar {
display: flex;
align-items: center;
justify-content: space-between;
}
@media (max-width: 575px) {
#wizard-navbar {
margin-top: -35px;
}
}
@media (min-width: 576px) {
#wizard-navbar {
position: absolute;
top: 0;
left: 0;
right: 0;
padding: 24px;
}
}
#wizard-navbar a,
#wizard-navbar button {
position: relative;
color: var(--btcpay-body-text);
display: inline-flex;
justify-content: center;
align-items: center;
width: 56px;
height: 56px;
border-radius: 50%;
border: none;
background: none;
}
#wizard-navbar a::after,
#wizard-navbar button::after {
position: absolute;
top: 0;
left: 0;
z-index: -1;
content: "";
width: 100%;
height: 100%;
border-radius: 50%;
transition: background-color .2s, transform .2s;
background-color: transparent;
}
#wizard-navbar a svg.icon,
#wizard-navbar button svg.icon{
width: 19px;
height: 16px;
}
#wizard-navbar a:hover::after,
#wizard-navbar button:hover::after{
background-color: var(--btcpay-body-bg-hover);
}
#wizard-navbar a:active::after,
#wizard-navbar button:active::after {
transform: scale(.825);
}
#wizard-navbar .cancel {
margin-left: auto;
}
.list-group-item {
display: flex;
padding: 0;
}
.list-group-item.hide-when-js {
display: flex !important;
}
.list-group-item:active,
.list-group-item.active {
background-color: transparent;
}
.list-group-item .image {
display: flex;
flex: 0 0 90px;
align-items: center;
justify-content: center;
padding: 1.5rem;
}
.list-group-item .image .icon {
width: 32px;
height: 32px;
}
.list-group-item .content {
flex: 1;
padding: 1.5rem;
}
.list-group-item .content small {
font-size: 90%;
text-transform: uppercase;
white-space: nowrap;
}
.list-group-item .image + .content {
padding-left: .5rem;
}
.list-group-item .icon-caret-right {
margin-right: 1.5rem;
}