xorbitlab
/
tubewatch
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fill out main content, align footer with bottom 

Make the app root fill at least the full height of the viewport, and
make the main content grow to fill the empty space - aligning the footer
with the bottom of the page at all times.
This commit is contained in:
Alex Gustafsson 2025-07-30 18:24:25 +02:00
parent e83b665573
commit e8d0cc95e7
1 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
ui/src/app/app.component.sass
View File

@ -93,22 +93,22 @@ td
.d-flex.my-3 .d-flex.my-3
margin-top: 1rem margin-top: 1rem
margin-bottom: 1rem margin-bottom: 1rem
.modal.fade.show .modal.fade.show
background-color: rgba(0, 0, 0, 0.5) background-color: rgba(0, 0, 0, 0.5)
.modal-header .modal-header
border-bottom: 1px solid #eee border-bottom: 1px solid #eee
.modal-body .modal-body
textarea.form-control textarea.form-control
resize: vertical resize: vertical
.add-url .add-url
display: inline-flex display: inline-flex
align-items: center align-items: center
justify-content: center justify-content: center
.spinner-border .spinner-border
margin-right: 0.5rem margin-right: 0.5rem
@ -127,6 +127,14 @@ td
overflow: visible overflow: visible
text-overflow: ellipsis text-overflow: ellipsis
app-root
display: flex
flex-direction: column
min-height: 100vh
main
flex-grow: 1
.footer .footer
width: 100% width: 100%
padding: 10px 0 padding: 10px 0