extern/mediacms
1
0
Fork 0
mirror of https://github.com/mediacms-io/mediacms.git synced 2024-11-21 15:53:21 +01:00
Code Issues Packages Projects Releases Wiki Activity

arrow css changes

Browse Source
This commit is contained in:
aleensd 2024-11-20 10:03:15 +02:00
parent 49280c9854
commit fe2d55f079
2 changed files with 20 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
frontend/src/static/js/components/media-page/MediaPage.scss
View File

@ -531,14 +531,6 @@
} }
} }
// .viewer-image-container img {
// cursor: pointer;
// width: 100%;
// max-width: 600px;
// display: block;
// margin: 0 auto;
// }
.modal-overlay { .modal-overlay {
position: fixed; position: fixed;
top: 0; top: 0;
@ -566,31 +558,37 @@
width: auto; width: auto;
height: auto; height: auto;
max-width: 100%; /* Ensure image doesn't exceed container width */ max-width: 100%; /* Ensure image doesn't exceed container width */
max-height: 90vh; max-height: 90vh;
border-radius: 0; border-radius: 0;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
transition: all 0.5s ease-in-out; transition: transform 60s ease-in-out, opacity 60 ease-in-out;
} }
.arrow { .arrow {
background: none;
position: absolute; position: absolute;
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
border: none; border: none;
color: rgb(48, 47, 47); color: white;
font-size: 2rem; font-size: 2rem;
background-color: rgba(0, 0, 0, 0.2);
cursor: pointer; cursor: pointer;
padding: 10px; padding: 10px;
border-radius: 50%; border-radius: 50%;
z-index: 1000; z-index: 1000;
transition: all 0.5s ease-in-out; transition: background-color 0.2s ease, transform 0.2s ease;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
} }
// .arrow:hover { .arrow:hover {
// background: #292928 background: rgba(92, 78, 78, 0.6);
// } transform: translateY(-50%) scale(1.1);
}
.arrow.left { .arrow.left {
left: 10px; left: 10px;
@ -602,13 +600,13 @@
.dots { .dots {
position: fixed; /* Make the dots container fixed to always be under the image */ position: fixed; /* Make the dots container fixed to always be under the image */
bottom: 10%; bottom: 10%;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
display: flex; display: flex;
gap: 10px; gap: 10px;
justify-content: center; justify-content: center;
z-index: 1000; z-index: 1000;
} }
.dot { .dot {
@ -628,8 +626,6 @@
background: rgba(255, 255, 255, 0.8); background: rgba(255, 255, 255, 0.8);
} }
.viewer-container .player-container { .viewer-container .player-container {
@media screen and (min-width: 480px) { @media screen and (min-width: 480px) {
border-radius: 10px; border-radius: 10px;
@ -637,7 +633,6 @@
} }
.viewer-container .player-container.audio-player-container { .viewer-container .player-container.audio-player-container {
@media screen and (min-width: 480px) { @media screen and (min-width: 480px) {
padding-top: 0.75 * 56.25%; padding-top: 0.75 * 56.25%;
} }

2
static/css/media.css
View File

File diff suppressed because one or more lines are too long