.burst div[class^=burst-wizard-] {
.burst-settings-goals {
&__list {
display: flex;
flex-wrap: wrap;
flex-direction: column;
gap: var(--rsp-spacing-s);
margin-top: var(--rsp-spacing-s);
&__item {
width: 100%;
background-color: var(--rsp-grey-200);
border-radius: var(--rsp-border-radius);
&__fields {
display: flex;
flex-wrap: wrap;
gap: var(--rsp-spacing-xl);
padding: var(--rsp-spacing-xs) var(--rsp-spacing-l) var(--rsp-spacing-m) var(--rsp-spacing-l);
margin-top: var(--rsp-spacing-s);
& > * {
width: 100%;
}
&__warning {
padding: var(--rsp-spacing-xs) var(--rsp-spacing-s);
margin: var(--rsp-spacing-xxs) 0;
border-radius: var(--rsp-border-radius-xs);
opacity: 1;
transition: opacity 1.3s ease-in-out;
color: var(--rsp-red);
background-color: var(--rsp-red-faded);
border: 1px solid var(--rsp-red);
display: flex;
gap: var(--rsp-spacing-xs);
align-items: center;
&.hidden {
opacity: 0;
}
&.success {
color: var(--rsp-green);
background-color: var(--rsp-green-faded);
border: 1px solid var(--rsp-green);
}
&.warning {
color: var(--rsp-text-color);
background-color: var(--rsp-yellow-faded);
border: 1px solid var(--rsp-yellow);
}
}
}
details {
//padding: var(--rsp-spacing-s) var(--rsp-spacing-s);
border-radius: var(--rsp-border-radius);
border: 1px solid var(--rsp-grey-300);
summary {
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-s);
display: grid;
grid-template-columns: 26px 1fr auto auto auto;
align-items: center;
gap: var(--rsp-spacing-s);
list-style: none;
&::-webkit-details-marker {
display: none;
}
&::marker {
display: none;
}
h5 {
font-weight: 600;
display: inline-block;
}
.components-toggle-control {
display: flex;
align-items: center;
margin: 0;
.components-flex{ gap: 0 }
}
.burst-icon-chevron-down {
transition: all .25s ease-in-out;
transform: rotate(0deg);
}
}
&[open] {
summary {
padding-bottom: var(--rsp-spacing-s);
border-bottom: 1px solid var(--rsp-grey-300);
.burst-icon-chevron-down {
transform: rotate(180deg);
}
}
}
.burst-field-wrap {
padding-inline: 0;
padding: 0;
padding-top: var(--rsp-spacing-m);
}
.burst-label {
color: var(--rsp-text-color);
font-size: var(--rsp-fs-400);
font-weight: 600;
margin-bottom: var(--rsp-spacing-xs);
}
}
}
}
&__upgrade {
display: flex;
gap: var(--rsp-spacing-s);
padding: var(--rsp-spacing-s);
background-color: var(--rsp-grey-200);
border-radius: var(--rsp-border-radius);
margin-top: var(--rsp-spacing-s);
justify-content: flex-start;
align-items: center;
border: 2px solid var(--rsp-grey-300);
h5 {
font-weight: 600;
}
p {
font-size: var(--rsp-fs-200);
color: var(--rsp-text-color-light);
}
.burst-button {
margin-left: auto;
}
}
}
.burst-radio-buttons__list {
display: grid;
grid-template-columns: repeat(2, minmax(49%, 1fr));
gap: var(--rsp-spacing-s);
&__item {
input {
&[type='radio']{
opacity:0;
filter:alpha(opacity=0);
position:absolute
}
&[type="radio"]:checked + label {
background: var(--rsp-green-faded);
border: 2px solid var(--rsp-green);
margin: 0;
}
}
label {
background: var(--rsp-white);
margin: 1px;
border: 1px solid var(--rsp-input-border-color);
outline: 1px solid transparent;
padding: var(--rsp-spacing-xs);
border-radius: var(--rsp-border-radius-xs);
display: grid;
grid-template-columns: auto auto auto 1fr;
gap: var(--rsp-spacing-xs);
align-items: center;
&.burst-disabled-radio{
background:inherit;
}
.burst-icon {
width: 24px;
height: 24px;
}
h5 {
font-weight: 600;
letter-spacing: 0.3px;
line-height: 1;
}
p {
line-height: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: var(--rsp-fs-200);
color: var(--rsp-text-color-light);
}
}
}
}
.burst-class-id, .burst-hook {
display: flex;
flex-wrap: wrap;
align-content: stretch;
gap: var(--rsp-spacing-xl);
> * {
width: 100%;
}
input[type="text"] {
width: 100%;
box-sizing: border-box;
}
}
.burst-select{
&__control{
input{
outline-style: none;
box-shadow: none;
border-color: transparent;
}
}
&__menu{
}
&__custom-option{
padding: var(--rsp-spacing-xxs) var(--rsp-spacing-xs);
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--rsp-spacing-xxs);
transition: background ease 0.2s;
& > div{
display: flex;
gap: var(--rsp-spacing-xxs);
}
&:hover{
background: var(--rsp-green-faded);
}
}
&__title{
font-size: var(--rsp-fs-200);
color: var(--rsp-text-color);
}
&__subtitle{
font-size: var(--rsp-fs-100);
color: var(--rsp-text-color-light);
}
&__pageview-count{
min-width: 45px;
font-size: var(--rsp-fs-100);
color: var(--rsp-text-color-light);
}
}
.burst-click-to-edit{
h5{
min-width: 150px;
}
}
}
.MuiDialog-container .MuiPaper-rounded{
border-radius: var(--rsp-border-radius-s);
}
.burst-settings-goals__add-goal {
display:flex;
.burst-button {
margin-right:10px;
align-self: flex-start;
&.burst-inactive {
color: var(--rsp-grey-400 );
}
}
}
.burst-button-dropdown-container {
position:relative;
.burst-button {
display:flex;
.burst-icon {
margin-top: 6px;
margin-left: 5px;
}
}
.burst-button-dropdown {
//todo fix this
//@extend .burst-button;
//@extend .burst-button--secondary;
background: var(--rsp-grey-100);
color: var(--rsp-text-color-light);
border: 1px solid var(--rsp-grey-400);
width: fit-content;
font-size: var(--button-font-size);
font-weight: var(--button-font-weight);
line-height: var(--button-line-height);
letter-spacing: var(--button-letter-spacing);
transition: var(--button-transition);
min-height: var(--button-min-height);
margin: 0;
padding: var(--button-padding);
border-radius: var(--button-border-radius);
text-align: center;
cursor: pointer;
text-decoration: none;
&__row{
display:flex;
cursor:pointer;
&.burst-inactive{
color: var(--rsp-grey-400 );
}
.burst-icon {
margin-left: 5px;
margin-top:2px;
}
}
}
}