.InlineForm { position: relative; &.inBubble { // ... } &.inFloating { position: absolute; left: calc(100% + 1rem); top: -0.8rem; min-width: 64vw; background: #fff; box-shadow: 0 4px 10px rgba(#000, 0.25); button { opacity: 1; &:disabled, &:disabled:hover { opacity: 0.3; } } } .form { display: flex; flex-flow: row nowrap; padding: 6px 11px; input { margin: 0 12px 0 0; padding: 0; flex: 1; border: none; min-width: 200px; display: block; &::placeholder { color: rgba(#000, 0.3); } &:focus { outline: none; } } } .linkError { padding: 6px 11px; color: red; font-size: 0.7em; position: absolute; bottom: -3rem; left: 0; right: 0; height: 0; background: #fff; box-shadow: 0 4px 10px rgba(#000, 0.25); opacity: 0; transition: height 0.3s ease-in-out, opacity 0.3s ease-in-out; &.visible { height: 32px; opacity: 1; } } }