.text-ellipsis { text-overflow: ellipsis; max-width: 100%; word-break: break-all; overflow: hidden; display: inline-block; } .clickable { cursor: pointer; } .boxed-shadow { background: $white; box-shadow: $dark-lavender 0 0 10px; } .is-boxed { border: 1px solid #ddd; padding: 1em; margin: 1em 0; } .nobold { font-weight: normal; } .hidden { display: none; } .padded { padding: 1em; } .marged { margin: 1em; } .marged-right { margin-right: 1em; } .marged-v { margin-top: 1em; margin-bottom: 1em; } .marged-auto { margin: 0 auto; } .fixed-box { box-sizing: border-box; position: fixed; top: 0; left: 0; width: 100%; z-index: 10; } .rounded-block { border-radius: 8px; background: $d-blue30; padding: 1em; margin-bottom: 1rem; hr { margin: 0.5em -1em; background: $rules; } .go-to-step, .custom-action { @extend .clickable; padding: 1.5em; border-radius: 0.25em; } } .has-no-background { background-color: transparent; } .has-no-outline, .has-no-border { border: none; } .has-no-padding { padding: 0; } // filters made with https://codepen.io/sosuke/pen/Pjoqqp .is-filtered-icon-primary { filter: invert(48%) sepia(68%) saturate(6489%) hue-rotate(233deg) brightness(89%) contrast(81%); } .is-filtered-icon-YES { filter: invert(43%) sepia(49%) saturate(633%) hue-rotate(97deg) brightness(84%) contrast(99%); } .is-filtered-icon-MAYBE { filter: invert(35%) sepia(83%) saturate(423%) hue-rotate(5deg) brightness(95%) contrast(89%); } .is-filtered-icon-NO { filter: invert(21%) sepia(89%) saturate(2445%) hue-rotate(334deg) brightness(85%) contrast(104%); } .is-large-button { width: 100%; display: block; } .has-no-padd-left { padding-left: 0; } .has-background-icon-left { padding-left: 44px; &:hover { color: $secondary_color; } } .has-background-icon-right { padding-right: 44px; background-position: right; &:hover { color: $secondary_color; } } // icone bg .has-background-transparent { background-color: transparent; } .has-background-answer-YES { background: url('/assets/icons/advanced/yes.svg') no-repeat 28px center; } .has-background-answer-MAYBE { background: url('/assets/icons/advanced/maybe.svg') no-repeat 28px center; } .has-background-answer-NO { background: url('/assets/icons/advanced/no.svg') no-repeat 28px center; } .has-background-link-icon { background: url('/assets/icons/link.svg') no-repeat 16px center; } .has-background-edit { background: url('/assets/icons/edit.svg') no-repeat 16px center; } .has-background-plus { background: url('/assets/icons/plus-circle.svg') no-repeat 16px center; } .has-background-trash { background: url('/assets/icons/trash-2.svg') no-repeat 16px center; } .has-background-menu { background: url('/assets/icons/menu.svg') no-repeat 16px center; } .has-background-close { background: url('/assets/icons/x.svg') no-repeat 16px center; } .has-background-arrow-down-circle { background: url('/assets/icons/arrow-down-circle.svg') no-repeat 16px center; } .is-block { display: block; } .has-nopadbottom { padding-bottom: 0; }