chris/bpb-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix modal mobile size

Browse Source
This commit is contained in:
chris 2025-02-20 11:35:21 -05:00
parent 58a3275a49
commit 664c95820f
5 changed files with 62 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
gallery/centerpiece/index.html
View File

@ -18,7 +18,7 @@
<link rel="stylesheet" href="../../style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.gallery {
.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 15px;
@ -49,21 +49,24 @@
color: #4a4a4a;
font-family: 'Autour One', cursive;
}
.modal{
--bulma-modal-content-width: unset;
--bulma-modal-content-height: unset;
.modal{
--bulma-modal-content-width: 95vw;
--bulma-modal-content-height: 95vh;
}
.modal-image {
max-width: 110%; /* Slightly larger max-width */
max-height: 98vh; /* Slightly larger max-height */
max-width: 90vw;
max-height: 90vh;
display: block;
margin: 0 auto;
border-radius: 10px;
max-width: 90vw;
overflow: clip;
}
.modal-content {
overflow-y: auto;
overflow-y: none;
max-height: 95vh;
background-color: transparent !important;
}
@ -72,6 +75,10 @@
font-family: 'Autour One', cursive;
background-color: transparent !important;
}
.modal-card-body{
max-width: fit-content !important;
overflow: clip !important;
}
</style>
</head>
<body>

21
gallery/centerpiece/updateGallery.sh
View File

@ -33,7 +33,7 @@ cat > "$OUTPUT_FILE" <<EOL
<link rel="stylesheet" href="../../style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.gallery {
.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 15px;
@ -64,21 +64,24 @@ cat > "$OUTPUT_FILE" <<EOL
color: #4a4a4a;
font-family: 'Autour One', cursive;
}
.modal{
--bulma-modal-content-width: unset;
--bulma-modal-content-height: unset;
.modal{
--bulma-modal-content-width: 95vw;
--bulma-modal-content-height: 95vh;
}
.modal-image {
max-width: 110%; /* Slightly larger max-width */
max-height: 98vh; /* Slightly larger max-height */
max-width: 90vw;
max-height: 90vh;
display: block;
margin: 0 auto;
border-radius: 10px;
max-width: 90vw;
overflow: clip;
}
.modal-content {
overflow-y: auto;
overflow-y: none;
max-height: 95vh;
background-color: transparent !important;
}
@ -87,6 +90,10 @@ cat > "$OUTPUT_FILE" <<EOL
font-family: 'Autour One', cursive;
background-color: transparent !important;
}
.modal-card-body{
max-width: fit-content !important;
overflow: clip !important;
}
</style>
</head>
<body>

18
gallery/classic/updateGallery.sh
View File

@ -33,7 +33,7 @@ cat > "$OUTPUT_FILE" <<EOL
<link rel="stylesheet" href="../../style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.gallery {
.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 15px;
@ -65,21 +65,23 @@ cat > "$OUTPUT_FILE" <<EOL
font-family: 'Autour One', cursive;
}
.modal{
--bulma-modal-content-width: unset;
--bulma-modal-content-height: unset;
.modal{
--bulma-modal-content-width: 95vw;
--bulma-modal-content-height: 95vh;
}
.modal-image {
max-width: 90%;
max-width: 90vw;
max-height: 90vh;
display: block;
margin: 0 auto;
border-radius: 10px;
max-width: 90vw;
overflow: clip;
}
.modal-content {
overflow-y: auto;
overflow-y: none;
max-height: 95vh;
background-color: transparent !important;
}
@ -88,6 +90,10 @@ cat > "$OUTPUT_FILE" <<EOL
font-family: 'Autour One', cursive;
background-color: transparent !important;
}
.modal-card-body{
max-width: fit-content !important;
overflow: clip !important;
}
</style>
</head>
<body>

17
gallery/organic/updateGallery.sh
View File

@ -33,7 +33,7 @@ cat > "$OUTPUT_FILE" <<EOL
<link rel="stylesheet" href="../../style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<style>
.gallery {
.gallery {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 15px;
@ -64,21 +64,24 @@ cat > "$OUTPUT_FILE" <<EOL
color: #4a4a4a;
font-family: 'Autour One', cursive;
}
.modal{
--bulma-modal-content-width: unset;
--bulma-modal-content-height: unset;
--bulma-modal-content-width: 95vw;
--bulma-modal-content-height: 95vh;
}
.modal-image {
max-width: 90%;
max-width: 90vw;
max-height: 90vh;
display: block;
margin: 0 auto;
border-radius: 10px;
max-width: 90vw;
overflow: clip;
}
.modal-content {
overflow-y: auto;
overflow-y: none;
max-height: 95vh;
background-color: transparent !important;
}
@ -87,6 +90,10 @@ cat > "$OUTPUT_FILE" <<EOL
font-family: 'Autour One', cursive;
background-color: transparent !important;
}
.modal-card-body{
max-width: fit-content !important;
overflow: clip !important;
}
</style>
</head>
<body>

14
gallery/sculpture/updateGallery.sh
View File

@ -66,20 +66,22 @@ cat > "$OUTPUT_FILE" <<EOL
}
.modal{
--bulma-modal-content-width: unset;
--bulma-modal-content-height: unset;
--bulma-modal-content-width: 95vw;
--bulma-modal-content-height: 95vh;
}
.modal-image {
max-width: 90%;
max-width: 90vw;
max-height: 90vh;
display: block;
margin: 0 auto;
border-radius: 10px;
max-width: 90vw;
overflow: clip;
}
.modal-content {
overflow-y: auto;
overflow-y: none;
max-height: 95vh;
background-color: transparent !important;
}
@ -88,6 +90,10 @@ cat > "$OUTPUT_FILE" <<EOL
font-family: 'Autour One', cursive;
background-color: transparent !important;
}
.modal-card-body{
max-width: fit-content !important;
overflow: clip !important;
}
</style>
</head>
<body>