@mixin ripple($color, $bg:"#ffffff00") { background-position: center; &:hover{ transition: background 0.4s; background: unquote($bg) radial-gradient(circle, transparent 1%, $color 1%) center/15000%; } &:active{ background-color: #00000033; background-size: 100%; transition: background 0s; } } @mixin inlinedInputWithSubmit() { form { display: flex; background: white; border-radius: 2px; box-shadow: 2px 2px 10px rgba(0,0,0,0.1); input { padding: 15px 20px; border-bottom: 0; margin: 0; height: inherit!important; } button { width: inherit; padding: 0 10px; .component_icon { height: 25px; } } } }