Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Aiccra dev responsive #2493

Merged
merged 26 commits into from
Feb 20, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
26 commits
Select commit Hold shift + click to select a range
b5c70fb
A2-72 Responsive tab-content
MetalPrime Feb 1, 2024
01c04c9
A2-71 Update in infTableItems & tab-content
MetalPrime Feb 1, 2024
b3b7f12
A2-64 Update superadminBlock
MetalPrime Feb 1, 2024
205c5ea
A2-65 Update in header icons & format document
MetalPrime Feb 1, 2024
cc9786e
A2-66 Update responsive menuContext mainMenu
MetalPrime Feb 1, 2024
b69757e
A2-68 Update responsive sectionMap
MetalPrime Feb 1, 2024
a3450fd
A2-73 update size of screen allowing not extra size
MetalPrime Feb 1, 2024
6544031
A2-69 Update timeline visualization
MetalPrime Feb 2, 2024
566a820
A2-67 Update in phases visualization
MetalPrime Feb 2, 2024
8598693
A2-70 update containerItems
MetalPrime Feb 2, 2024
ee7627b
A2-48 - General Updates
MetalPrime Feb 2, 2024
c19b85d
A2-100 -Responsive subMainMenu
MetalPrime Feb 5, 2024
7ae8862
A2-101 - Responsive Submit button
MetalPrime Feb 5, 2024
ad81119
A2-104 - Innovation table
MetalPrime Feb 6, 2024
9a2ca8c
A2-104 - Deliverables Table - Update Download Button
MetalPrime Feb 6, 2024
0297be6
A2-104 - Contributions to Performance Indicators Table
MetalPrime Feb 6, 2024
86eddf9
A2-104 - Update OICR & MELAS Table
MetalPrime Feb 6, 2024
200aa61
A2-101 - Revert changes in button - commented
MetalPrime Feb 7, 2024
0d13e98
A2-70 - update Container for Mobile 440px
MetalPrime Feb 14, 2024
e183242
A2-70 - update Container for Table device
MetalPrime Feb 14, 2024
15c0896
A2-100 update subheader for tablet version need revision
MetalPrime Feb 14, 2024
1c6c090
A2-67 Update in phases visualization tablet
MetalPrime Feb 14, 2024
99d2c14
A2-68 - update map for tablet
MetalPrime Feb 15, 2024
b75024f
A2-72 tablet responsive tab-content
MetalPrime Feb 15, 2024
7a11a06
A2-73 - Responsive Buttons update
MetalPrime Feb 20, 2024
23afa2d
A2-48 - General Updates based on Comments
MetalPrime Feb 20, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
]
/]
[#assign customCSS = [
"${baseUrlMedia}/css/home/dashboard.css?20230313",
"${baseUrlMedia}/css/home/dashboard.css?20240201",
"${baseUrlCdn}/global/css/customDataTable.css",
"${baseUrlCdn}/global/css/impactGraphic.css",
"https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -185,7 +185,7 @@
<label for="checkbox">Responsible person</label>
</div>
</div>
<div class="currentDeliverables">
<div class="currentDeliverables table-responsive">
[@deliverableList.deliverablesList deliverables=(currentDeliverableList)![] canValidate=true canEdit=candit isReportingActive=reportingActive namespace="/clusters" defaultAction="${(crpSession)!}/deliverable" projectID=projectID/]
</div>
[#--
Expand Down Expand Up @@ -223,7 +223,7 @@
<label for="checkbox">Responsible person</label>
</div>
</div>
<div class="previousDeliverables">
<div class="previousDeliverables table-responsive">
[@deliverableList.deliverablesList deliverables=(project.getPreviousDeliverables(actualPhase) + previousSharedDeliverableList)![] canValidate=true canEdit=candit isReportingActive=reportingActive namespace="/projects" defaultAction="${(crpSession)!}/deliverable" currentTable=false projectID=projectID/]
</div>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@
[#include "/WEB-INF/crp/views/projects/messages-projects.ftl" /]

<h3 class="headTitle">[@s.text name="projectContributionsCrpList.title" /]</h3>
<div id="projectContributionsCrpList" class="borderBox">
<div id="projectContributionsCrpList" class="borderBox table-responsive">
[#-- Your project contributes to the flagships --]
<div class="form-group">
<p>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@

[#-- Innovations List --]
<h3 class="headTitle">[@s.text name="projectInnovations" /]</h3>
<div class="simpleBox">
<div class="simpleBox table-responsive">
[@innovationsTableMacro list=(projectInnovations)![] /]
</div>

Expand All @@ -57,7 +57,7 @@
[#-- Previous Innovations List --]
<br />
<h3 class="headTitle">Previous [@s.text name="projectInnovations" /]</h3>
<div class="simpleBox">
<div class="simpleBox table-responsive">
[@innovationsTableMacro list=(projectOldInnovations)![] currentTable=false/]
</div>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@

[#-- Studies list --]
<h3 class="headTitle">[@s.text name="projectStudies.studiesTitle" /] <br /><small>[@s.text name="projectStudies.studiesSubTitle" /]</small></h3>
<div id="caseStudiesBlock" class="simpleBox">
<div id="caseStudiesBlock" class="simpleBox table-responsive">
[@tableList list=(projectStudies)![] /]
</div>
[#-- Add a new --]
Expand All @@ -85,7 +85,7 @@

[#-- OLD Studies list --]
<h3 class="headTitle">[@s.text name="projectStudies.studiesTitleOldFormat" /]</h3>
<div id="caseStudiesBlock" class="simpleBox">
<div id="caseStudiesBlock" class="simpleBox table-responsive">
[@tableList list=(projectOldStudies)![] previousTable=true /]
</div>

Expand Down
123 changes: 119 additions & 4 deletions marlo-web/src/main/webapp/crp/css/home/dashboard.css
Original file line number Diff line number Diff line change
Expand Up @@ -241,6 +241,7 @@ span.timelineControl:hover {
}

.timeline{
position: static;
margin: 30px 0;
display: flex;
justify-content: center;
Expand Down Expand Up @@ -485,6 +486,7 @@ span.timelineControl:hover {

.containerMapsection{
display: flex;
position: relative;
}

.borderMap{
Expand Down Expand Up @@ -728,7 +730,6 @@ span.timelineControl:hover {

.containerItems {
flex-wrap: wrap;
width: 100%;
display: table-cell;
text-align: center;
margin-left: 4px;
Expand Down Expand Up @@ -804,13 +805,18 @@ span.timelineControl:hover {
.tableItemsTitle{
font-size: 1.1em;
}

.itemsTablet{
width: 45%;
}
}

@media (max-width:750px){
@media (max-width:768px){

.containerItems {
display: flex;
justify-content: center;
justify-content: start;
margin-left: 0%;
}

.sectionItems {
Expand All @@ -825,7 +831,6 @@ span.timelineControl:hover {

.itemsTablet {
height: 80px;
width: 80px;
margin: 10px;
}

Expand All @@ -849,8 +854,116 @@ span.timelineControl:hover {
table.dataTable {
font-size: 0.7em;
}

/*************** sectionMap ********************/
.containerTextMap{
margin: 10px 20px 25px 20px;
}
.containerTextMap .titleMap{
font-size: 1.35rem;
}

.containerTextMap .textMap{
font-size: 1.1rem;
}
.containerImgMap{
min-width: 17%;
display:flex;
flex-direction: column;
justify-content: center;
}

.containerImgMap img{
width: 100%;
}
}

@media only screen and (max-width:440px){

#dashboardContent{
display: contents;
}

.containerTabletItems{
height: 100%;
}

/**************** Content Items Table **************/

.sectionItems{
margin-left: 0%;
}

.containerItems{
justify-content: center;

}

.itemsTablet{
padding-top: 1rem;
width: 40%;
}

.containerTabletItems #dashboardContent{
width: 100%;
width: -moz-available;
width: -webkit-fill-available;
width: fill-available;
}

.tab-content{
width: auto;
}

.iconSearch{
margin-left: 0;
right: 5%;
}

/*************** sectionMap ********************/

.containerTextMap .titleMap{
font-size: 1.15em;
}

.containerTextMap .textMap{
font-size: 0.95rem;
}

.containerImgMap{
display: block;
position: absolute;
right: 10%;
top: 0;
width: 100%;
text-align: right;
}

.containerImgMap img{
width: 8%;
}

/*************** timeline ********************/

.timeline{
position: relative;
}

.timelineAlert{
bottom: 8px;
top: auto !important;
right: auto;
}

.buttonRightTimeline{
right: 0;
}

.buttonLeftTimeline{
left: 0;
}

}

/* Add styles to the table */
.dataTables_wrapper {
Expand Down Expand Up @@ -879,3 +992,5 @@ span.timelineControl:hover {
#guide-button{
display: block;
}


Original file line number Diff line number Diff line change
Expand Up @@ -1157,3 +1157,10 @@ div.fieldFocus-deliverable {
left: 610px;
}
}

@media (max-width:440px){
.containerShowHide{
position: static;
}
}

21 changes: 21 additions & 0 deletions marlo-web/src/main/webapp/crp/js/home/dashboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -466,6 +466,27 @@ divDataTables_length.css("bottom", "8px");
divDataTables_length.css("margin-left", "43%");
divDataTables_length.css("z-index", "1");

var windowWidth = $(window).width();


if (windowWidth < 768) {
divDataTables_length.css({
"left": "30vw",
"bottom": "0",
"margin-top": "4rem",
"margin-left": "0"
})
}

if (windowWidth < 440) {
divDataTables_length.css({
"left": "18vw",
"bottom": "0",
"margin-top": "32px",
"margin-left": "0"
})
}

$('a#impact[data-toggle="tab"]').on('shown.bs.tab', function(e) {
e.target // newly activated tab
e.relatedTarget // previous active tab
Expand Down
Loading
Loading