forked from jsnbuchanan/crowd-funder-for-time-pwa
refactor: migrate dialog styles from scoped CSS to Tailwind utilities
- Remove scoped CSS styles for .dialog-overlay and .dialog from AdmitPendingMembersDialog.vue - Remove scoped CSS overflow style from FeedFilters.vue dialog - Update Tailwind .dialog utility class to include max-height and overflow-y-auto - Consolidate dialog styling into reusable Tailwind components for consistency
This commit is contained in:
@@ -38,7 +38,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dialog {
|
.dialog {
|
||||||
@apply bg-white p-4 rounded-lg w-full max-w-lg;
|
@apply bg-white px-4 py-6 rounded-lg w-full max-w-lg max-h-[90%] overflow-y-auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Markdown content styling to restore list elements */
|
/* Markdown content styling to restore list elements */
|
||||||
|
|||||||
@@ -348,29 +348,3 @@ export default class AdmitPendingMembersDialog extends Vue {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
.dialog-overlay {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
background-color: rgba(0, 0, 0, 0.5);
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
z-index: 1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dialog {
|
|
||||||
background: white;
|
|
||||||
border-radius: 8px;
|
|
||||||
padding: 24px;
|
|
||||||
max-width: 500px;
|
|
||||||
width: 90%;
|
|
||||||
max-height: 80vh;
|
|
||||||
overflow-y: auto;
|
|
||||||
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
@@ -210,9 +210,3 @@ export default class FeedFilters extends Vue {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
|
||||||
#dialogFeedFilters.dialog-overlay {
|
|
||||||
overflow: scroll;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|||||||
Reference in New Issue
Block a user