diff options
author | sowgro <tpoke.ferrari@gmail.com> | 2025-04-05 16:51:58 -0400 |
---|---|---|
committer | sowgro <tpoke.ferrari@gmail.com> | 2025-04-05 16:51:58 -0400 |
commit | 2f37b1de28399a361dc272b51ad624ac8902a562 (patch) | |
tree | 31a344c8b88b7b0388899bceca976f2ab6bcfc1c /ufund-ui/src/app/components/need-page/need-page.component.css | |
parent | 80492e8f6f88bff8035e27b814cc9eacbee40c65 (diff) | |
download | JellySolutions-2f37b1de28399a361dc272b51ad624ac8902a562.tar.gz JellySolutions-2f37b1de28399a361dc272b51ad624ac8902a562.tar.bz2 JellySolutions-2f37b1de28399a361dc272b51ad624ac8902a562.zip |
Make need-page image work on all screen sizes
Diffstat (limited to 'ufund-ui/src/app/components/need-page/need-page.component.css')
-rw-r--r-- | ufund-ui/src/app/components/need-page/need-page.component.css | 12 |
1 files changed, 8 insertions, 4 deletions
diff --git a/ufund-ui/src/app/components/need-page/need-page.component.css b/ufund-ui/src/app/components/need-page/need-page.component.css index 79d3fb3..6ca1350 100644 --- a/ufund-ui/src/app/components/need-page/need-page.component.css +++ b/ufund-ui/src/app/components/need-page/need-page.component.css @@ -4,12 +4,13 @@ } #box { - padding-top: 7.5%; + /*padding-top: 7.5%;*/ display: flex; flex-direction: column; width: 800px; justify-content: start; gap: 10px; + padding: 0 10px; } .needName { @@ -25,14 +26,17 @@ .need-image { - width: 55%; + width: calc(100% + 40px); height: 40%; - position: absolute; + /*position: absolute;*/ left: 22.5%; aspect-ratio: 16/9; object-fit: cover; - mask-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,.2) 50%, rgba(255,255,255,.1) 90%, transparent 100%); + mask-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,.2) 80%, rgba(255,255,255,.1) 90%, transparent 100%); border-radius: 10px; + margin-left: -20px; + margin-right: -20px; + margin-bottom: -80px; } .urgent { |