.cx-vui-repeater {
&__actions {
display: flex;
align-items: center;
}
&__tip {
color: $color__text;
margin: 0 0 0 20px;
.rtl & {
margin: 0 20px 0 0;
}
}
.cx-vui-collapse__content > & {
margin-bottom: 25px;
}
}
.cx-vui-repeater-item {
&__handle {
cursor: n-resize;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
margin: -12px 0 -10px -16px;
.rtl & {
margin: -12px -16px -10px 0;
}
svg {
line {
stroke: $color__border-off-panel;
}
}
}
&__heading {
display: flex;
border-bottom: 1px solid $color__border-in-panel;
padding: 18px 20px 16px;
align-items: center;
justify-content: space-between;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
&--is-collpased {
border-bottom: none;
}
&-start {
display: flex;
align-items: center;
cursor: pointer;
}
&-end {
display: flex;
align-items: center;
}
}
&__title,
&__subtitle {
font-size: 15px;
line-height: 17px;
}
&__title {
font-weight: 500;
color: $color__accent;
margin: 0 10px 0 0;
.rtl & {
margin: 0 0 0 10px;
}
}
&__subtitle {
font-style: italic;
color: $color__text;
}
&__collapse {
margin: 0 8px 0 0;
.rtl & {
margin: 0 0 0 8px;
}
&--is-collpased {
margin: 0 8px 4px 0;
transform: rotate( -90deg );
.rtl & {
margin: 0 0 4px 8px;
}
}
path {
fill: $color__accent;
}
}
&__content {
&--is-collpased {
display: none;
}
}
&__copy,
&__clean {
cursor: pointer;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
margin: 0 0 0 10px;
position: relative;
.rtl & {
margin: 0 10px 0 0;
}
.cx-vui-tooltip {
width: 80px;
}
path {
transition: all 150ms linear;
fill: $color__text;
}
&:hover {
path {
fill: $color__accent;
}
}
}
&__confrim-del,
&__cancel-del {
text-decoration: underline;
}
&__confrim-del {
color: $color__error;
}
}