You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
When having a very long a-class-body in the ADialog the dialog overflows in height.
Example
<script setup lang="ts">
import { ref } from'vue'const isDialogShown =ref(false)
</script>
<template>
<ADialogv-model="isDialogShown"title="Dialog title"
>
<divclass="a-card-body">
<span>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin egestas leo in pretium condimentum. Nullam consectetur nunc nec tempus malesuada. Morbi vel nulla magna. In sagittis tellus quis urna tempus lobortis. Aenean fringilla id ipsum id hendrerit. Integer porta vehicula velit, at aliquam ipsum auctor nec. Cras eu diam dignissim, elementum lacus at, aliquet velit. Proin efficitur, dolor sed mollis placerat, mi ligula imperdiet mauris, sed sodales lorem sem at felis.
Nullam porttitor ipsum id lorem placerat, non consequat nisi dapibus. Sed eu eros eu felis convallis hendrerit. Fusce tempus aliquam metus sit amet placerat. Quisque tempus sollicitudin nisi id mattis. Maecenas porta accumsan urna at auctor. Donec id ex malesuada neque posuere aliquet quis molestie augue. Aliquam volutpat luctus eros, ut sollicitudin ex venenatis quis. Curabitur lobortis massa a ultricies auctor.
Vivamus interdum pretium justo ac tristique. Proin lobortis pretium velit, nec pretium dolor. Vestibulum facilisis placerat ante quis vulputate. Quisque efficitur nisi vitae egestas finibus. Vivamus eu fringilla dui. Vivamus et dapibus turpis. Donec ullamcorper nisi erat, vel faucibus urna iaculis in. Suspendisse potenti. Vestibulum tincidunt in metus vitae porta. Nullam nec viverra dui. Proin vel bibendum odio. Cras nec est in sapien tempus fringilla vitae sit amet ante. Sed mauris turpis, semper laoreet nibh at, mattis tincidunt nibh. Phasellus ullamcorper arcu at enim condimentum molestie. Sed at molestie augue. Ut non justo quis mi semper consectetur eget a orci.
Sed ac ultrices erat. Donec mollis posuere fermentum. Vestibulum accumsan fermentum quam at consequat. Vestibulum viverra eros nec diam viverra pulvinar. Duis congue odio vitae arcu feugiat elementum. Sed vitae odio velit. Nullam eget augue euismod, facilisis massa eget, suscipit quam. Cras pulvinar urna a aliquam porttitor. Cras sed iaculis sem, sit amet accumsan ligula. Praesent gravida mauris ut nisi semper, non dictum diam imperdiet. Fusce feugiat neque et pretium molestie. Aliquam imperdiet libero a tortor volutpat, id fermentum velit blandit. Nullam tristique ante eu diam aliquet aliquet. Vestibulum efficitur, libero nec vehicula interdum, justo felis volutpat justo, a feugiat est leo at metus. In efficitur pellentesque nisi eget vestibulum. Quisque nec fermentum mauris.
Vestibulum a scelerisque metus. Quisque non augue at lectus tempor eleifend. Aliquam ullamcorper erat vel nulla molestie blandit. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent in porttitor quam. Nulla et massa sed risus fermentum feugiat. Aliquam porta congue enim. Nullam auctor fringilla leo non ornare. Duis ut lacinia massa. Vestibulum posuere felis a libero vulputate pretium.
Curabitur tortor felis, fermentum at nulla eu, auctor blandit velit. Etiam vel leo vel risus tempus fermentum. Nullam faucibus ornare eros sit amet dapibus. Nulla sem purus, luctus sit amet semper vel, mattis eget nisl. Mauris auctor lacinia dui, vel vulputate nisi aliquet quis. Vestibulum semper vulputate dapibus. Nam facilisis, nunc eu maximus porta, arcu sem euismod ante, sit amet condimentum odio mauris vel diam. Sed in suscipit tellus. Integer porta molestie nibh, et congue ex finibus sed. Aliquam erat volutpat. Curabitur non finibus est. Nulla at diam eget metus finibus vestibulum.
Curabitur egestas eget justo eu tristique. Phasellus ligula magna, pellentesque a lacus eu, accumsan bibendum nunc. Curabitur tincidunt cursus sem ac viverra. Vestibulum laoreet elementum neque, vel hendrerit arcu facilisis at. Nullam tellus magna, tristique ut blandit sed, posuere convallis dui. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Maecenas fermentum risus quis sem ornare, vel aliquet nisl pharetra. Aliquam dignissim nunc ac elementum pharetra. In libero lacus, tincidunt ac suscipit sed, lacinia at nulla. Nunc non sem diam.
Aliquam vitae suscipit orci. Maecenas tristique et purus vel vestibulum. Phasellus egestas sodales libero, sed varius ligula. Praesent tortor ante, dictum et facilisis vel, rutrum at dolor. Nullam sollicitudin urna eu neque elementum, ut lobortis odio porta. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Curabitur interdum facilisis ante, eget luctus mi cursus non.
Mauris a bibendum nisi, eu sagittis orci. Mauris vitae odio purus. Duis mattis nisl dictum tellus malesuada bibendum. Suspendisse ligula nunc, volutpat vel sodales a, tempus quis arcu. Pellentesque vel nibh congue, vehicula odio et, fermentum metus. Mauris velit erat, lobortis id aliquam in, tincidunt vitae elit. Nam sem urna, maximus efficitur interdum ut, dignissim vel sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas non tortor ac lorem euismod sollicitudin non eu nisl. In egestas leo sit amet neque imperdiet, tristique tristique ligula aliquam. Proin vel libero facilisis sapien malesuada euismod. Nam in sapien sed ex posuere feugiat vitae vel purus. Quisque non ultrices est.
Aenean ligula quam, sollicitudin non tempus in, condimentum sit amet leo. Morbi hendrerit dolor ut malesuada facilisis. Mauris non sapien ante. Integer varius tellus lacinia accumsan vestibulum. Quisque id augue elit. Etiam lobortis efficitur turpis at dictum. Vestibulum eget tellus vel orci egestas fringilla at eget est. Nullam lacinia ipsum magna, vel luctus sapien condimentum ullamcorper. Sed posuere arcu neque, luctus egestas augue euismod eget. Sed condimentum scelerisque tellus, vel rhoncus massa tincidunt ut. Nulla ullamcorper eros ut nibh condimentum, sed ultricies nulla tincidunt. In non magna nec tellus lobortis mollis ac ut ante. Donec lobortis, nunc eu aliquet luctus, lorem felis efficitur nunc, eu condimentum lectus mauris nec ligula. Sed nisl enim, tempor et dui vitae, commodo ornare lacus.
Donec eget commodo felis. Donec quis auctor arcu. In mattis luctus aliquam. Donec est diam, euismod vitae rhoncus in, ultrices a nisl. Sed tempus, magna non elementum venenatis, justo justo faucibus dui, sit amet mattis odio magna at neque. Cras volutpat porttitor ligula vitae accumsan. Suspendisse ac ipsum pharetra, vestibulum nibh ut, cursus nibh. Sed quis libero sed ipsum porta congue vel congue tortor. Suspendisse quam ipsum, tempor sit amet iaculis eget, elementum a purus. Proin consequat ipsum ac mi dignissim, eu auctor ipsum condimentum. Integer porttitor iaculis magna. Mauris congue lorem non purus tristique varius. Sed lorem magna, hendrerit quis leo nec, varius laoreet odio. Sed at aliquam quam.
Morbi venenatis tristique ex eu vestibulum. Integer tincidunt mollis urna et suscipit. Aenean malesuada eu metus eu viverra. Curabitur at turpis elit. Nullam eleifend blandit feugiat. Fusce mattis rutrum arcu, vel molestie tellus luctus et. Sed cursus lectus sodales eros scelerisque, a efficitur ipsum viverra. Aenean dapibus tempus purus mattis malesuada. Integer quis condimentum orci, vitae venenatis purus. Sed et pellentesque ipsum, eu semper odio.
In semper enim vel nibh ultrices cursus. Donec imperdiet auctor neque, et lacinia metus faucibus eget. Phasellus hendrerit fermentum mauris eget imperdiet. Duis a auctor velit. Cras faucibus, urna eget venenatis ullamcorper, lorem odio fermentum turpis, a maximus orci nibh et leo. In id mauris imperdiet arcu fringilla lobortis in non nulla. In hac habitasse platea dictumst. Nunc maximus velit a nibh tempor hendrerit. Donec ac odio eu augue convallis convallis. Nulla fringilla augue non turpis luctus, eget pulvinar lorem molestie. Mauris ut velit vitae dui consequat interdum id id nunc. Nulla pretium magna nunc, hendrerit fermentum leo ullamcorper ac. Vestibulum lobortis blandit arcu, at tincidunt diam volutpat eget.
Suspendisse bibendum volutpat nulla ac ornare. Phasellus et dolor id velit feugiat laoreet ac scelerisque felis. Curabitur non tempus ex. Donec vestibulum quam non odio vulputate, quis aliquet urna luctus. Praesent imperdiet tincidunt hendrerit. Nullam scelerisque quam arcu, vitae aliquam velit rutrum non. Cras feugiat odio eu velit convallis semper.
Quisque pharetra, dui sed eleifend aliquet, metus odio ullamcorper ante, eu suscipit elit augue nec tortor. Sed rhoncus est id pulvinar faucibus. Mauris ultricies, ipsum ac dignissim vestibulum, erat magna suscipit velit, ac facilisis dolor elit in orci. Cras iaculis erat quis rhoncus interdum. Ut quis velit in dui dictum laoreet sit amet sit amet orci. Mauris eget diam nec ipsum bibendum fermentum. Pellentesque congue mauris in sapien volutpat convallis. Suspendisse eget leo venenatis, interdum ante non, efficitur augue. Sed ullamcorper magna non tortor pulvinar, non blandit diam sodales. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec placerat a metus a elementum.
Mauris a felis lobortis, vehicula dolor id, fermentum nunc. Nulla non tempus risus, vitae hendrerit risus. Suspendisse non sapien at ligula scelerisque cursus. Suspendisse potenti. Duis nec suscipit mauris. Ut mattis nibh eu velit tristique, id fringilla urna tempus. Vivamus sit amet ligula imperdiet, auctor ante vel, hendrerit ex. Donec vulputate diam sit amet consectetur tristique. Nulla magna nisi, cursus sed aliquam nec, gravida sit amet odio.
Ut rutrum tellus a quam dignissim fringilla. Nulla convallis justo quis magna porta, id fermentum nunc consequat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Duis eget dui nibh. Sed sapien nulla, dignissim quis dui lacinia, pharetra lobortis mi. Phasellus nec congue dolor. Phasellus vitae lacus gravida, laoreet lectus sed, vehicula odio. In scelerisque id massa at rutrum. Nulla hendrerit orci sed velit tincidunt consectetur. Sed in volutpat sapien, nec bibendum elit. Vivamus semper, ante tempor laoreet viverra, sapien leo bibendum ex, non eleifend velit nisi et lectus. Etiam sollicitudin nisi sed justo pulvinar, et iaculis felis ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Sed venenatis volutpat lacus eget elementum. Donec in blandit nulla. Maecenas nec porta neque.
Nullam mattis vitae sapien vel facilisis. Nam in ex id leo ultrices sollicitudin. Vivamus nec sapien id elit faucibus sodales. Maecenas finibus placerat est non cursus. Fusce non vulputate leo. Maecenas in ante id eros ornare pellentesque a eget turpis. Curabitur tempor lacinia urna ut pulvinar. Mauris in tempor ligula. Aliquam at accumsan tortor. Mauris ullamcorper arcu ut massa tincidunt euismod. Ut quis ligula at lacus tincidunt faucibus. Aenean at lectus ante. Donec fermentum lacus id nisl venenatis, id pharetra ipsum venenatis.
Donec placerat nibh non augue tempus venenatis. Nullam at neque vitae velit eleifend posuere ut in neque. Aliquam tellus justo, maximus bibendum scelerisque sed, dignissim eget lacus. Proin auctor nibh risus, nec congue nulla lobortis sed. Nam malesuada quis velit eget volutpat. Aenean gravida sodales massa. In hac habitasse platea dictumst. Nam placerat ultricies posuere. Quisque risus tellus, placerat et dui at, gravida mattis velit. Nam vehicula, ipsum ut mollis ullamcorper, nibh ligula fringilla nunc, sit amet congue elit dolor sed dolor. Sed suscipit lacus eu aliquam lobortis. In ultricies dolor in sagittis porta. Quisque id finibus elit.
Proin varius erat ut neque viverra, vel rhoncus felis finibus. Aenean condimentum ultricies augue, nec tincidunt orci pellentesque vitae. Nulla lobortis est eget aliquam tempor. In facilisis eget diam in aliquam. Aliquam laoreet quam in congue posuere. Curabitur elementum consectetur leo, sit amet mattis turpis rhoncus ut. Morbi eget tincidunt felis.
</span>
<ABtnvariant="light"class="text-sm"@click="isDialogShown = false"
>
Close
</ABtn>
</div>
</ADialog>
<ABtn@click="isDialogShown = true">
Show dialog
</ABtn>
</template>
When having a very long
a-class-body
in theADialog
the dialog overflows in height.Example
Codesandbox
The text was updated successfully, but these errors were encountered: