feat: restyle unauthenticated screens #1103
|
@ -1,6 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="message" :class="variant">
|
<div class="message-wrapper">
|
||||||
<slot/>
|
<div class="message" :class="variant">
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -14,6 +16,12 @@ defineProps({
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
.message-wrapper {
|
||||||
|
border-radius: $radius;
|
||||||
|
background: var(--white);
|
||||||
|
overflow: hidden;
|
||||||
konrad marked this conversation as resolved
|
|||||||
|
}
|
||||||
|
|
||||||
.message {
|
.message {
|
||||||
padding: .75rem 1rem;
|
padding: .75rem 1rem;
|
||||||
border-radius: $radius;
|
border-radius: $radius;
|
||||||
|
|
Reference in New Issue
Block a user
I don't get the need for the new wrapper.
What's the
overflow
for?That's because the message background is transparent. When I put the message on something with a background, it would shine through. The overlay puts a white background behind it so the message background color is always the same.
I just realized I don't need the overflow so I just removed it.