oleh/minivlat-local-ua
1
0
Fork 0
mirror of https://github.com/olehomelchenko/minivlat-local-ua.git synced 2025-12-21 13:12:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Adjust chart layout for improved responsiveness and image fitting

Browse Source
This commit is contained in:
Oleh Omelchenko
2025-01-30 10:25:46 +02:00
parent 4951b1138c
commit 6d64c97858
1 changed files with 12 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/css/styles.css
View File

@@ -96,17 +96,21 @@ form button {
}
#chart {
flex: 1;
flex: 2; /* Take 2/3 of the width */
display: flex;
justify-content: center;
align-items: center;
padding: 20px;
width: 100%; /* Ensure chart takes full width */
width: 100%;
height: 75%; /* Ensure the container takes full height */
}
#chart img {
max-width: 100%;
height: auto;
max-height: 100%;
height: 100%; /* Ensure the image fits vertically 100% */
width: 100%; /* Ensure the image spans 100% width */
object-fit: contain; /* Ensure the image fits within the container */
}
#question-block {
@@ -126,6 +130,11 @@ form button {
#chart {
margin-bottom: 0;
flex: 2; /* Ensure it takes 2/3 of the width on larger screens */
}
#question-block {
flex: 1; /* Take 1/3 of the width */
}
}