diff --git a/akvo/rsr/static/scripts-src/project-editor.js b/akvo/rsr/static/scripts-src/project-editor.js index 1d38c03eb6..22b89ac080 100644 --- a/akvo/rsr/static/scripts-src/project-editor.js +++ b/akvo/rsr/static/scripts-src/project-editor.js @@ -1506,12 +1506,23 @@ function addPartial(partialName, partialContainer) { // Check if there is a third level if (hierarchyList[1].length > 1) { - var childChildContainer = childContainer.querySelector('.parent'); + var childChildContainers = childContainer.querySelectorAll('.parent'); var childRelatedObjCount = document.querySelectorAll('.' + hierarchyList[1][1] + '-item').length; - updatePartialIDs(childChildContainer, [childId, 'new-' + childRelatedObjCount.toString()].join('_')); + for (var i = 0; i < childChildContainers.length; i++) { + updatePartialIDs(childChildContainers[i], [childId, 'new-' + childRelatedObjCount.toString()].join('_')); + + // Check if there is a fourth level + if (hierarchyList[1].length > 2) { + var childChildChildContainers = childChildContainers[i].querySelectorAll('.parent'); + var childChildRelatedObjCount = document.querySelectorAll('.' + hierarchyList[1][2] + '-item').length; + for (var j = 0; j < childChildChildContainers.length; j++) { + updatePartialIDs(childChildChildContainers[j], [childId, 'new-' + childRelatedObjCount.toString(), 'new-' + childChildRelatedObjCount.toString()].join('_')); + } + } + } } - } else if (hierarchyList[0] === 2 || hierarchyList[0] === 3) { - // Second or third level, fetch the ID from the parent item and add the new ID to it + } else if (hierarchyList[0] > 1) { + // Second, third or fourth level: fetch the ID from the parent item and add the new ID to it parentContainer = findAncestorByClass(partialContainer, 'parent'); parentID = parentContainer.getAttribute('id').split('.')[1]; newID = 'new-' + document.querySelectorAll('.' + partialName + '-item').length; @@ -1533,9 +1544,20 @@ function addPartial(partialName, partialContainer) { // Check if there is a third level (only possible on level 2) if (hierarchyList[1].length > 0) { - childContainer = partial.querySelector('.parent'); + var childContainers = partial.querySelectorAll('.parent'); relatedObjCount = document.querySelectorAll('.' + hierarchyList[1][0] + '-item').length; - updatePartialIDs(childContainer, [newID, 'new-' + relatedObjCount.toString()].join('_')); + for (var k = 0; k < childContainers.length; k++) { + updatePartialIDs(childContainers[k], [newID, 'new-' + relatedObjCount.toString()].join('_')); + + // Check if there is a fourth level + if (hierarchyList[1].length > 1) { + var childOfChildContainers = childContainers[k].querySelectorAll('.parent'); + var childOfRelatedObjCount = document.querySelectorAll('.' + hierarchyList[1][1] + '-item').length; + for (var l = 0; l < childOfChildContainers.length; l++) { + updatePartialIDs(childOfChildContainers[l], [newID, 'new-' + relatedObjCount.toString(), 'new-' + childOfRelatedObjCount.toString()].join('_')); + } + } + } } } diff --git a/akvo/rsr/static/scripts-src/project-editor.jsx b/akvo/rsr/static/scripts-src/project-editor.jsx index cc9d92c9be..46e0dec2ab 100644 --- a/akvo/rsr/static/scripts-src/project-editor.jsx +++ b/akvo/rsr/static/scripts-src/project-editor.jsx @@ -1506,12 +1506,23 @@ function addPartial(partialName, partialContainer) { // Check if there is a third level if (hierarchyList[1].length > 1) { - var childChildContainer = childContainer.querySelector('.parent'); + var childChildContainers = childContainer.querySelectorAll('.parent'); var childRelatedObjCount = document.querySelectorAll('.' + hierarchyList[1][1] + '-item').length; - updatePartialIDs(childChildContainer, [childId, 'new-' + childRelatedObjCount.toString()].join('_')); + for (var i = 0; i < childChildContainers.length; i++) { + updatePartialIDs(childChildContainers[i], [childId, 'new-' + childRelatedObjCount.toString()].join('_')); + + // Check if there is a fourth level + if (hierarchyList[1].length > 2) { + var childChildChildContainers = childChildContainers[i].querySelectorAll('.parent'); + var childChildRelatedObjCount = document.querySelectorAll('.' + hierarchyList[1][2] + '-item').length; + for (var j = 0; j < childChildChildContainers.length; j++) { + updatePartialIDs(childChildChildContainers[j], [childId, 'new-' + childRelatedObjCount.toString(), 'new-' + childChildRelatedObjCount.toString()].join('_')); + } + } + } } - } else if (hierarchyList[0] === 2 || hierarchyList[0] === 3) { - // Second or third level, fetch the ID from the parent item and add the new ID to it + } else if (hierarchyList[0] > 1) { + // Second, third or fourth level: fetch the ID from the parent item and add the new ID to it parentContainer = findAncestorByClass(partialContainer, 'parent'); parentID = parentContainer.getAttribute('id').split('.')[1]; newID = 'new-' + document.querySelectorAll('.' + partialName + '-item').length; @@ -1533,9 +1544,20 @@ function addPartial(partialName, partialContainer) { // Check if there is a third level (only possible on level 2) if (hierarchyList[1].length > 0) { - childContainer = partial.querySelector('.parent'); + var childContainers = partial.querySelectorAll('.parent'); relatedObjCount = document.querySelectorAll('.' + hierarchyList[1][0] + '-item').length; - updatePartialIDs(childContainer, [newID, 'new-' + relatedObjCount.toString()].join('_')); + for (var k = 0; k < childContainers.length; k++) { + updatePartialIDs(childContainers[k], [newID, 'new-' + relatedObjCount.toString()].join('_')); + + // Check if there is a fourth level + if (hierarchyList[1].length > 1) { + var childOfChildContainers = childContainers[k].querySelectorAll('.parent'); + var childOfRelatedObjCount = document.querySelectorAll('.' + hierarchyList[1][1] + '-item').length; + for (var l = 0; l < childOfChildContainers.length; l++) { + updatePartialIDs(childOfChildContainers[l], [newID, 'new-' + relatedObjCount.toString(), 'new-' + childOfRelatedObjCount.toString()].join('_')); + } + } + } } } diff --git a/akvo/rsr/static/styles-src/library.css b/akvo/rsr/static/styles-src/library.css index 848c8bd781..e5d11375e6 100755 --- a/akvo/rsr/static/styles-src/library.css +++ b/akvo/rsr/static/styles-src/library.css @@ -28,4 +28,4 @@ /* Media Queries ========================================================================== */ /* Placeholder - ========================================================================== */ + ========================================================================== */ \ No newline at end of file diff --git a/akvo/rsr/static/styles-src/main.css b/akvo/rsr/static/styles-src/main.css index cbd2def93c..ea8acc3a29 100755 --- a/akvo/rsr/static/styles-src/main.css +++ b/akvo/rsr/static/styles-src/main.css @@ -44,10 +44,10 @@ body { height: 100%; color: #394c50; text-rendering: optimizelegibility; - font-family: "Poppins", "Questrial", "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-family: 'Poppins', 'Questrial', 'Lato', "Helvetica Neue", Helvetica, Arial, sans-serif; padding-top: 75px; - font-size: 24px; - font-size: 1.5rem; + font-size: 22px; + font-size: 1.375rem; line-height: 1.5; } @media (max-width: 900px) { body { @@ -65,21 +65,14 @@ h1, h2, h3, h4, h5, h6, p, ul, ol { margin-top: 0; margin-bottom: 1rem; } -h1, -h2, -h3, -h4, -h5, -h6 { - font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; +h1, h2, h3, h4, h5, h6 { + font-family: 'Montserrat', "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: normal; color: #2c2a74; margin-bottom: .5rem; line-height: 1.1; } -a, -a:link, -a:visited { +a, a:link, a:visited { outline: none; color: #00aaff; text-decoration: none; @@ -88,13 +81,9 @@ a:visited { -o-transition: color 0.2s linear; -webkit-transition: color 0.2s linear; transition: color 0.2s linear; } - a:link, - a:link:link, - a:visited:link { + a:link, a:link:link, a:visited:link { -webkit-tap-highlight-color: #fcd700; } - a:hover, - a:link:hover, - a:visited:hover { + a:hover, a:link:hover, a:visited:hover { color: #ff5500; } /****************** Miscellanous Typography ********************/ @@ -124,7 +113,7 @@ time { color: #de8929; } em { - font-family: "Baskerville", "Goudy Old Style", "Palatino", "Book Antiqua", Georgia, serif; + font-family: 'Baskerville', "Goudy Old Style", "Palatino", "Book Antiqua", Georgia, serif; font-size: 1.2em; margin: 0 5px 0em 0em; font-style: italic; } @@ -183,8 +172,7 @@ div.morePartners { -webkit-transition: all 0.1s linear; transition: all 0.1s linear; } -a.btn-primary, -button.btn-primary { +a.btn-primary, button.btn-primary { border: 1px solid #00aaff; color: white; background: #00aaff; @@ -192,8 +180,7 @@ button.btn-primary { -o-transition: all 0.1s linear; -webkit-transition: all 0.1s linear; transition: all 0.1s linear; } - a.btn-primary:hover, - button.btn-primary:hover { + a.btn-primary:hover, button.btn-primary:hover { color: white; background: #ff5500; border: 1px solid #ff5500; } @@ -203,24 +190,20 @@ button.btn-primary { color: rgba(0, 167, 157, 0.7); text-align: left; } -.btn-group button, -.form-group button { +.btn-group button, .form-group button { -moz-border-radius: 5px; -o-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } /* Bootstrap style for typeahead dropdown, to be included in CSS file */ -.tt-input, -.tt-hint { +.tt-input, .tt-hint { -moz-border-radius: 5px 0 0 5px; -o-border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; } -.input-group-addon:not(:first-child):not(:last-child), -.input-group-btn:not(:first-child):not(:last-child), -.input-group .form-control:not(:first-child):not(:last-child) { +.input-group-addon:not(:first-child):not(:last-child), .input-group-btn:not(:first-child):not(:last-child), .input-group .form-control:not(:first-child):not(:last-child) { -moz-border-radius: 5px 0 0 5px; -o-border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; @@ -263,8 +246,7 @@ span.twitter-typeahead .tt-suggestion > p { color: rgba(0, 0, 0, 0.7); white-space: nowrap; } -span.twitter-typeahead .tt-suggestion > p:hover, -span.twitter-typeahead .tt-suggestion > p:focus { +span.twitter-typeahead .tt-suggestion > p:hover, span.twitter-typeahead .tt-suggestion > p:focus { color: #ffffff; text-decoration: none; outline: 0; @@ -299,16 +281,13 @@ dl.dl-horizontal dt { font-weight: bold; } dl.dl-horizontal dt.funders { margin-top: 5px; } - dl.dl-horizontal dd.totalFinance { margin-top: 30px; font-weight: bold; } - dl.dl-horizontal dd.funders { margin-top: 5px; } dl.dl-horizontal dd.funders span.iati-activity-id { font-style: italic; } - dl.dl-horizontal.org_statistics_table dd { text-align: right; } @@ -494,7 +473,7 @@ nav.navbar-fixed-top { -webkit-box-shadow: rgba(0, 0, 0, 0.17255) 0px 6px 12px 0px; } nav.navbar-fixed-top .navbar-nav.navbar-right li .langDropdown .dropdown-menu a { color: #00aaff; - font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-family: 'Montserrat', "Helvetica Neue", Helvetica, Arial, sans-serif; border: thin solid transparent; } nav.navbar-fixed-top .navbar-nav.navbar-right li .langDropdown .dropdown-menu a:hover { color: #ff5500; } @@ -505,14 +484,13 @@ nav.navbar-fixed-top { -moz-border-radius: 3px; -o-border-radius: 3px; -webkit-border-radius: 3px; - border-radius: 3px; } } - @media only screen and (max-width: 768px) and (max-width: 1024px) { - nav.navbar-fixed-top .navbar-nav.navbar-right li .langDropdown .dropdown-menu a.active { - background: rgba(255, 85, 0, 0.1); } } + border-radius: 3px; } + @media only screen and (max-width: 1024px) { + nav.navbar-fixed-top .navbar-nav.navbar-right li .langDropdown .dropdown-menu a.active { + background: rgba(255, 85, 0, 0.1); } } } .navbar .active { color: #2A6297; } - .navbar .container { /* nav menu overflows to two lines in spanish and french unless container width is increased slightly just above the threshold for switching to dropdown */ } @@ -529,8 +507,7 @@ nav.navbar-fixed-top { @media only screen and (min-width: 768px) and (max-width: 1024px) { .navbar-header { float: none; } - .navbar-left, - .navbar-right { + .navbar-left, .navbar-right { float: none !important; } .navbar-toggle { display: block; } @@ -624,25 +601,19 @@ nav.navbar-fixed-top { #createProject:hover { background: #2c2a74; } -.indicator-period-list.parentProject .relatedInfo, -.indicator-period-list.childProject .relatedInfo { +.indicator-period-list.parentProject .relatedInfo, .indicator-period-list.childProject .relatedInfo { color: #2c2a74; } - -.indicator-period-list.parentProject .relatedInfoProjectTitle, -.indicator-period-list.childProject .relatedInfoProjectTitle { +.indicator-period-list.parentProject .relatedInfoProjectTitle, .indicator-period-list.childProject .relatedInfoProjectTitle { display: none; margin-top: 15px; } - .indicator-period-list.parentProject .relatedInfoProjectTitle + .indicator-periods-title, - .indicator-period-list.childProject .relatedInfoProjectTitle + .indicator-periods-title { + .indicator-period-list.parentProject .relatedInfoProjectTitle + .indicator-periods-title, .indicator-period-list.childProject .relatedInfoProjectTitle + .indicator-periods-title { margin-top: 15px; } - .indicator-period-list thead tr { background-color: rgba(32, 32, 36, 0.05); border-bottom: none; } .indicator-period-list thead tr th { padding-top: 15px; padding-bottom: 15px; } - .indicator-period-list tbody.indicator-period { border: none; } .indicator-period-list tbody.indicator-period tr { @@ -658,70 +629,40 @@ nav.navbar-fixed-top { .indicator-period-list tbody.indicator-period tr td.actions-td .btn-default:hover { background: #2c2a74; } -.myProjectList thead tr, -#updates thead tr, -#user_table thead tr { +.myProjectList thead tr, #updates thead tr, #user_table thead tr { background-color: rgba(32, 32, 36, 0.05); border-bottom: none; } - .myProjectList thead tr th, - #updates thead tr th, - #user_table thead tr th { + .myProjectList thead tr th, #updates thead tr th, #user_table thead tr th { padding-top: 15px; padding-bottom: 15px; } - -.myProjectList tbody tr, -#updates tbody tr, -#user_table tbody tr { +.myProjectList tbody tr, #updates tbody tr, #user_table tbody tr { background: white !important; } - .myProjectList tbody tr.notPublished, - #updates tbody tr.notPublished, - #user_table tbody tr.notPublished { + .myProjectList tbody tr.notPublished, #updates tbody tr.notPublished, #user_table tbody tr.notPublished { background: rgba(217, 83, 79, 0.1) !important; } - .myProjectList tbody tr.isPrivate, - #updates tbody tr.isPrivate, - #user_table tbody tr.isPrivate { + .myProjectList tbody tr.isPrivate, #updates tbody tr.isPrivate, #user_table tbody tr.isPrivate { background: rgba(240, 173, 78, 0.1) !important; } - .myProjectList tbody tr td, - #updates tbody tr td, - #user_table tbody tr td { + .myProjectList tbody tr td, #updates tbody tr td, #user_table tbody tr td { padding-top: 30px; padding-bottom: 30px; border: none; } - -.myProjectList div.projectListMenu ul, -#updates div.projectListMenu ul, -#user_table div.projectListMenu ul { +.myProjectList div.projectListMenu ul, #updates div.projectListMenu ul, #user_table div.projectListMenu ul { margin-top: -10px; } - .myProjectList div.projectListMenu ul li, - #updates div.projectListMenu ul li, - #user_table div.projectListMenu ul li { + .myProjectList div.projectListMenu ul li, #updates div.projectListMenu ul li, #user_table div.projectListMenu ul li { display: inline-block; } @media only screen and (max-width: 992px) { - .myProjectList div.projectListMenu ul li, - #updates div.projectListMenu ul li, - #user_table div.projectListMenu ul li { + .myProjectList div.projectListMenu ul li, #updates div.projectListMenu ul li, #user_table div.projectListMenu ul li { display: block; } } - .myProjectList div.projectListMenu ul li a:last-child, - #updates div.projectListMenu ul li a:last-child, - #user_table div.projectListMenu ul li a:last-child { + .myProjectList div.projectListMenu ul li a:last-child, #updates div.projectListMenu ul li a:last-child, #user_table div.projectListMenu ul li a:last-child { margin-right: 0; } - -.myProjectList a:last-child, -#updates a:last-child, -#user_table a:last-child { +.myProjectList a:last-child, #updates a:last-child, #user_table a:last-child { margin-right: 0; } - -.myProjectList a.addUpdate.disabled, -#updates a.addUpdate.disabled, -#user_table a.addUpdate.disabled { +.myProjectList a.addUpdate.disabled, #updates a.addUpdate.disabled, #user_table a.addUpdate.disabled { background-color: #AB9F9F; color: #E9E9E9; pointer-events: initial; cursor: not-allowed; border: none; } - .myProjectList a.addUpdate.disabled:hover, - #updates a.addUpdate.disabled:hover, - #user_table a.addUpdate.disabled:hover { + .myProjectList a.addUpdate.disabled:hover, #updates a.addUpdate.disabled:hover, #user_table a.addUpdate.disabled:hover { text-decoration: none; } div.paginationWrap { @@ -747,7 +688,6 @@ div.paginationWrap { #profile .usrAvatar { background-color: rgba(32, 32, 36, 0); padding: 10px 0 10px 0; } - #profile .btn { background: #202024; color: white; @@ -763,7 +703,6 @@ div.paginationWrap { .locationTab .table { margin-bottom: 25px; } - .table.locationTab { overflow: hidden; overflow-x: scroll; @@ -782,7 +721,6 @@ div.paginationWrap { @media only screen and (max-width: 768px) { .table-responsive { border: none; } } - .table-responsive .media { width: 39%; } .table-responsive .media > a { @@ -1017,8 +955,7 @@ h4.detailedInfo { border-radius: 3px; margin-bottom: 15px; } @media only screen and (max-width: 768px) { - .paginationWrap .pagination li a, - .paginationWrap .pagination li span { + .paginationWrap .pagination li a, .paginationWrap .pagination li span { padding: 10px 16px; font-size: 18px; } } .paginationWrap .sortList { @@ -1172,12 +1109,10 @@ h4.detailedInfo { .main-list li dl.dl-horizontal dd { margin-left: 0px; display: block; } } - .main-list .excerpt { overflow: hidden; text-overflow: ellipsis; white-space: normal; } - .main-list.projects ul li { border: thin solid rgba(44, 42, 116, 0); -moz-transition: all 0.2s ease-in; @@ -1208,7 +1143,6 @@ h4.detailedInfo { margin-top: 1em; } } .main-list.projects ul li .donateButton .totalBudgetLabel { width: initial; } - .main-list.updates ul li { border: thin solid rgba(0, 167, 157, 0); -moz-transition: all 0.2s ease-in; @@ -1241,7 +1175,6 @@ h4.detailedInfo { list-style-type: initial; margin: initial; padding: initial; } - .main-list.organisations ul li { border: thin solid rgba(238, 49, 36, 0); -moz-transition: all 0.2s ease-in; @@ -1274,7 +1207,7 @@ h4.detailedInfo { .main-list.organisations ul li img { filter: gray; -webkit-filter: grayscale(100%); - filter: url("data:image/svg+xml;utf8,#grayscale"); + filter: url("data:image/svg+xml;utf8,#grayscale"); filter: grayscale(100%); transition: all 0.2s ease-in; } .main-list.organisations ul li:hover img { @@ -1342,8 +1275,7 @@ header.projectHeader { text-transform: uppercase; font-size: 0.875em; font-weight: bold; } - header.projectHeader .shareBlock .btn, - header.projectHeader .shareBlock img { + header.projectHeader .shareBlock .btn, header.projectHeader .shareBlock img { display: inline-block; margin: 10px 3px 3px 3px; } @@ -1374,10 +1306,8 @@ header.projectHeader { .project-tab.summary { margin-top: -20px; } - .project-tab.partners { margin-top: 60px; } - .project-tab.updates .updateAsset:first-child { margin-top: 25px; } @@ -1461,7 +1391,7 @@ div.projectTopRow { width: 80%; filter: gray; -webkit-filter: grayscale(100%); - filter: url("data:image/svg+xml;utf8,#grayscale"); + filter: url("data:image/svg+xml;utf8,#grayscale"); filter: grayscale(100%); transition: all 0.2s ease-in; margin: inherit; } @@ -1629,8 +1559,7 @@ div.textBlock { .projectFinancial .budgetItem { margin-top: 12px; width: 60%; } - .projectFinancial .budgetItem:nth-child(1), - .projectFinancial .budgetItem:nth-child(2) { + .projectFinancial .budgetItem:nth-child(1), .projectFinancial .budgetItem:nth-child(2) { margin-top: 0; } /* Project hierarchy */ @@ -1646,9 +1575,7 @@ div.textBlock { -webkit-border-radius: 5px; border-radius: 5px; } -.project-hierarchy-window:hover, -.project-hierarchy-window._jsPlumb_source_hover, -.project-hierarchy-window._jsPlumb_target_hover { +.project-hierarchy-window:hover, .project-hierarchy-window._jsPlumb_source_hover, .project-hierarchy-window._jsPlumb_target_hover { border: 1px solid orange; color: orange; } @@ -1712,8 +1639,7 @@ ul.typeahead-selector { padding-left: 6px; padding-top: 4px; padding-bottom: 4px; } - ul.typeahead-selector li:hover, - ul.typeahead-selector li.hover { + ul.typeahead-selector li:hover, ul.typeahead-selector li.hover { font-weight: bold; cursor: pointer; } ul.typeahead-selector li a { @@ -1725,12 +1651,10 @@ ul.typeahead-selector { /* Organisation Page */ .organisationDetail .organisationHeader { background: rgba(32, 32, 36, 0.05); } - .organisationDetail .orgDescr { background-color: rgba(244, 116, 107, 0); } .organisationDetail .orgDescr p { padding-left: 20px; } - .organisationDetail h1 { margin-top: 0; margin-bottom: 20px; @@ -1741,26 +1665,20 @@ ul.typeahead-selector { .organisationDetail h1 i { font-size: 0.75em; top: -5px; } - .organisationDetail .orgLogo { padding: 10px 0; } .organisationDetail .orgLogo img { width: 35%; margin-left: 5px; } - .organisationDetail .orgDetails { background: rgba(255, 255, 255, 0.45); -moz-border-radius: 5px; -o-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } - -.organisationDetail .orgUrl, -.organisationDetail .orgIati, -.organisationDetail .orgEmail { +.organisationDetail .orgUrl, .organisationDetail .orgIati, .organisationDetail .orgEmail { display: block; padding-bottom: 0.75em; } - @media only screen and (max-width: 768px) { .organisationDetail .orgDetails > h4 { padding-top: 0.75em; } } @@ -1770,8 +1688,7 @@ ul.typeahead-selector { max-width: 325px; margin-right: auto; margin-left: auto; } - .organisationInfo dd, - .organisationInfo dt { + .organisationInfo dd, .organisationInfo dt { display: inline-block; } .organisationInfo dt { width: 49%; @@ -1784,7 +1701,6 @@ ul.typeahead-selector { .updateMain h2 { color: #00a79d; margin-top: 0; } - .updateMain .asideUpList .row { padding: 15px 0; } .updateMain .asideUpList .row:nth-of-type(2n+1) { @@ -1802,9 +1718,7 @@ ul.typeahead-selector { width: 95%; max-width: 450px; text-align: justify; } - .projectDonate .paymentOption, - .projectDonate .donateTitle, - .projectDonate h3 { + .projectDonate .paymentOption, .projectDonate .donateTitle, .projectDonate h3 { text-align: center; } } .projectDonate .donateButton { margin-bottom: 2em; } @@ -1825,10 +1739,10 @@ ul.typeahead-selector { clear: both; } .projectDonate .paymentSystemInfo { background-color: #f2f0e6; } - -@media only screen and (min-width: 768px) and (max-width: 992px) { - .projectDonate h3 { - font-size: 1.3em; } } + @media only screen and (min-width: 768px) { + @media only screen and (max-width: 992px) { + .projectDonate h3 { + font-size: 1.3em; } } } @media only screen and (max-width: 768px) { .projectDonate .paymentOption { margin-top: 3em; } @@ -1846,10 +1760,8 @@ ul.typeahead-selector { /* Financial details page */ section.projectFinancial .currentFunders dl > dd { text-align: right; } - section.projectFinancial .donationBreak { display: none; } - @media only screen and (max-width: 768px) { section.projectFinancial { width: 95%; @@ -1858,22 +1770,21 @@ section.projectFinancial .donationBreak { margin-right: auto; } section.projectFinancial .dl-horizontal dt { float: left; } } - -@media only screen and (max-width: 992px) and (min-width: 768px) { - section.projectFinancial .dl-horizontal dt { - width: initial; } - section.projectFinancial .donationBreak { - display: initial; - clear: both; } - section.projectFinancial .currentFunders dd.donation { - float: right; } - section.projectFinancial .currentFunders dt.donation { - clear: both; } } +@media only screen and (max-width: 992px) { + @media only screen and (min-width: 768px) { + section.projectFinancial .dl-horizontal dt { + width: initial; } + section.projectFinancial .donationBreak { + display: initial; + clear: both; } + section.projectFinancial .currentFunders dd.donation { + float: right; } + section.projectFinancial .currentFunders dt.donation { + clear: both; } } } /* Project Partners details page */ section.projectPartners .title { margin-bottom: 1em; } - section.projectPartners .row { margin-left: 0; margin-right: 0; @@ -1884,9 +1795,7 @@ section.projectPartners .row { -o-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } - section.projectPartners .row h2, - section.projectPartners .row h3, - section.projectPartners .row h4 { + section.projectPartners .row h2, section.projectPartners .row h3, section.projectPartners .row h4 { margin-top: 0; } section.projectPartners .row img { max-height: 120px; @@ -1903,15 +1812,13 @@ section.projectPartners .row { section.projectPartners .row .fa { font-size: 1.3em; color: #2c2a74; } - section.projectPartners .row a.org-link:hover i, - section.projectPartners .row a.org-link:hover h2 { + section.projectPartners .row a.org-link:hover i, section.projectPartners .row a.org-link:hover h2 { color: #ff5500; } section.projectPartners .row ul { margin: 0; padding: 0; } section.projectPartners .row li { list-style: none; } - @media only screen and (max-width: 768px) { section.projectPartners .container { padding-left: 0; @@ -1943,13 +1850,11 @@ dd.currencyAmount { .projectReport td.edit-buttons, .projectReport td.empty { /*flex: 1 0 90%; text-align: center;*/ } } - @media only screen and (max-width: 768px) { .projectReport { max-width: 95%; margin-left: auto; margin-right: auto; } } - .projectReport table { color: rgba(32, 32, 36, 0.7); } .projectReport table th { @@ -1964,21 +1869,19 @@ dd.currencyAmount { border: 2px solid white; } .projectReport table.table-bordered td, .projectReport table.table-bordered th { border: 2px solid white; } - .projectReport h4 { margin: 50px 0 10px 0; } - @media only screen and (min-width: 992px) { .projectReport table { table-layout: auto; } .projectReport table th { - word-break: break-word; } } - @media only screen and (min-width: 992px) and (max-width: 1200px) { - .projectReport table th { - width: 90px; } } - @media only screen and (min-width: 992px) and (min-width: 1200px) { - .projectReport table th { - width: 120px; } } + word-break: break-word; } + @media only screen and (max-width: 1200px) { + .projectReport table th { + width: 90px; } } + @media only screen and (min-width: 1200px) { + .projectReport table th { + width: 120px; } } } /* Project update page */ .updateText { @@ -2003,20 +1906,11 @@ a.addUpdateBtn { /* Google translation bar styles */ body.translationBarActive .nav { padding-top: 39px; } - body.translationBarActive .navbar-brand { margin-top: 39px; } - -body.translationBarActive article, -body.translationBarActive .updateMain, -body.translationBarActive .organisationDetail, -body.translationBarActive #map { +body.translationBarActive article, body.translationBarActive .updateMain, body.translationBarActive .organisationDetail, body.translationBarActive #map { padding-top: 39px; } - -body.translationBarActive div.skiptranslate ~ article, -body.translationBarActive div.skiptranslate ~ .updateMain, -body.translationBarActive div.skiptranslate ~ .organisationDetail, -body.translationBarActive div.skiptranslate ~ #map { +body.translationBarActive div.skiptranslate ~ article, body.translationBarActive div.skiptranslate ~ .updateMain, body.translationBarActive div.skiptranslate ~ .organisationDetail, body.translationBarActive div.skiptranslate ~ #map { padding-top: 0px; } /* Cookie */ @@ -2042,13 +1936,10 @@ body.translationBarActive div.skiptranslate ~ #map { /* Project Admin */ .progress .progress-bar[data-completion='empty'] { background: #d9534f; } - .progress .progress-bar[data-completion='incomplete'] { background: #f0ad4e; } - .progress .progress-bar[data-completion='complete'] { background: #5cb85c; } - .progress .progress-bar .progress-percentage { display: none; } @@ -2058,31 +1949,23 @@ body.translationBarActive div.skiptranslate ~ #map { padding: 0 15px 15px 15px; } .formProgress .panel-heading:hover { background: rgba(92, 184, 92, 0.1); } - .formProgress .progress .progress-bar .progress-percentage { display: initial; } - .formProgress .progress-and-publish { top: 20px; } - .formProgress .redLegenda { background: #d9534f; color: #d9534f; } - .formProgress .orangeLegenda { background: #f0ad4e; color: #f0ad4e; } - .formProgress .greenLegenda { background: #5cb85c; color: #5cb85c; } - .formProgress .mandatoryIndicator { color: #d9534f; } - .formProgress .published { color: #5cb85c; } - .formProgress .notPublished { color: #e31b23; } @@ -2092,7 +1975,6 @@ body.translationBarActive div.skiptranslate ~ #map { padding: 0 15px 15px 15px; } .formOverviewInfo .panel-heading:hover { background: rgba(114, 205, 255, 0.1); } - .formOverviewInfo label { color: rgba(44, 42, 116, 0.5); } @@ -2101,7 +1983,6 @@ body.translationBarActive div.skiptranslate ~ #map { text-transform: uppercase; font-size: 1.5em; display: block; } - .projectEdit .myPanel { overflow: hidden; line-height: 25px; @@ -2112,7 +1993,7 @@ body.translationBarActive div.skiptranslate ~ #map { display: block; overflow: hidden; box-sizing: border-box; - transition: all 0.5s linear; + transition: all .5s linear; padding: 5px 15px; margin: 0 auto; -moz-border-radius: 5px; @@ -2124,10 +2005,8 @@ body.translationBarActive div.skiptranslate ~ #map { overflow: auto; background: rgba(253, 242, 232, 0); box-shadow: 0 0 15px rgba(44, 42, 116, 0.2); } - .projectEdit input[type='radio'] { display: none; } - .projectEdit .formStep { position: relative; } .projectEdit .formStep > div > label { @@ -2159,16 +2038,11 @@ body.translationBarActive div.skiptranslate ~ #map { padding-top: 10px; } .projectEdit .formStep span.tab { padding-left: 5em; } - .projectEdit .borderBottom { padding-bottom: 10px; border-bottom: 1px solid rgba(44, 42, 116, 0); } - -.projectEdit *, -.projectEdit *:before, -.projectEdit *:after { +.projectEdit *, .projectEdit *:before, .projectEdit *:after { box-sizing: border-box; } - .projectEdit .control { position: relative; padding-top: 23px; @@ -2180,22 +2054,16 @@ body.translationBarActive div.skiptranslate ~ #map { padding-left: 10px; } .projectEdit .control:last-child { border: 0; } - .projectEdit .control-label { min-width: 90%; } - .projectEdit a.btn { margin-top: 23px; } .projectEdit a.btn.btn-link { margin-top: 0; } - -.projectEdit .col-md-4 a.btn.btn-link, -.projectEdit .col-md-3 a.btn.btn-link { +.projectEdit .col-md-4 a.btn.btn-link, .projectEdit .col-md-3 a.btn.btn-link { margin-top: 23px; } - .projectEdit .add-object-link { top: 8px; } - .projectEdit hr { border: none; height: 1px; @@ -2203,49 +2071,21 @@ body.translationBarActive div.skiptranslate ~ #map { /* old IE */ background-color: rgba(44, 42, 116, 0.3); /* Modern Browsers */ } - -.projectEdit input + label, -.projectEdit input + span + label, -.projectEdit input + ul + label, -.projectEdit textarea + label, -.projectEdit textarea + span + label, -.projectEdit textarea + ul + label, -.projectEdit select + label, -.projectEdit select + span + label, -.projectEdit select + ul + label, -.projectEdit div.input-group + label, -.projectEdit div.input-group + span + label, -.projectEdit div.input-group + ul + label { +.projectEdit input + label, .projectEdit input + span + label, .projectEdit input + ul + label, .projectEdit textarea + label, .projectEdit textarea + span + label, .projectEdit textarea + ul + label, .projectEdit select + label, .projectEdit select + span + label, .projectEdit select + ul + label, .projectEdit div.input-group + label, .projectEdit div.input-group + span + label, .projectEdit div.input-group + ul + label { position: absolute; top: -20px; transition: top 0.7s ease, opacity 0.7s ease; opacity: 1; font-size: 13px; font-weight: 600; } - -.projectEdit input:focus + label, -.projectEdit input:focus + span + label, -.projectEdit input:focus + ul + label, -.projectEdit textarea:focus + label, -.projectEdit textarea:focus + span + label, -.projectEdit textarea:focus + ul + label, -.projectEdit select:focus + label, -.projectEdit select:focus + span + label, -.projectEdit select:focus + ul + label, -.projectEdit div.input-group:focus + label, -.projectEdit div.input-group:focus + span + label, -.projectEdit div.input-group:focus + ul + label { +.projectEdit input:focus + label, .projectEdit input:focus + span + label, .projectEdit input:focus + ul + label, .projectEdit textarea:focus + label, .projectEdit textarea:focus + span + label, .projectEdit textarea:focus + ul + label, .projectEdit select:focus + label, .projectEdit select:focus + span + label, .projectEdit select:focus + ul + label, .projectEdit div.input-group:focus + label, .projectEdit div.input-group:focus + span + label, .projectEdit div.input-group:focus + ul + label { color: #2c2a74; } - .projectEdit .delete-related-object { color: #d9534f; } - .projectEdit .delete-photo-button { color: #d9534f; } - .projectEdit .delete-document { color: #d9534f; } - .projectEdit .info-icon { padding-left: 0.5em; cursor: pointer; @@ -2253,62 +2093,48 @@ body.translationBarActive div.skiptranslate ~ #map { font-size: 120%; } .projectEdit .info-icon.activated { color: rgba(44, 42, 116, 0.3); } - .projectEdit .mandatory, .projectEdit .mandatory-block { color: #d9534f; font-size: 125%; margin-left: 4px; margin-right: -4px; } - .projectEdit .mandatory-block { font-size: 90%; margin-left: 0px; margin-right: 0px; } - .projectEdit label.progress-bar[aria-valuenow="0"] { background: #d9534f; color: #d9534f; } - .projectEdit label.progress-bar[aria-valuenow="10"] { background: #d9534f; color: white; } - .projectEdit label.progress-bar[aria-valuenow="20"] { background: #d9534f; color: white; } - .projectEdit label.progress-bar[aria-valuenow="30"] { background: #d9534f; color: white; } - .projectEdit label.progress-bar[aria-valuenow="40"] { background: #f0ad4e; color: white; } - .projectEdit label.progress-bar[aria-valuenow="50"] { background: #f0ad4e; color: white; } - .projectEdit label.progress-bar[aria-valuenow="60"] { background: #f0ad4e; color: white; } - .projectEdit label.progress-bar[aria-valuenow="70"] { background: #5cb85c; color: white; } - .projectEdit label.progress-bar[aria-valuenow="80"] { background: #5cb85c; color: white; } - .projectEdit label.progress-bar[aria-valuenow="90"] { background: #5cb85c; color: white; } - .projectEdit label.progress-bar[aria-valuenow="100"] { background: #5cb85c; color: white; } - .projectEdit div.parent { background: rgba(240, 173, 78, 0.15); -webkit-border-radius: 10px; @@ -2320,7 +2146,6 @@ body.translationBarActive div.skiptranslate ~ #map { margin-top: 10px; margin-bottom: 10px; transition: background 0.1s linear; } - .projectEdit div.partial-header { font-family: 'Montserrat', "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: normal; @@ -2329,13 +2154,10 @@ body.translationBarActive div.skiptranslate ~ #map { margin-top: 10px; margin-bottom: 10px; cursor: pointer; } - .projectEdit .save-message { text-align: center; } - .projectEdit .save-button { text-align: right; } - .projectEdit .toggle-help { font-size: 0.9em; color: rgba(44, 42, 116, 0.5); } @@ -2374,8 +2196,7 @@ body.translationBarActive div.skiptranslate ~ #map { padding: 0.5em; margin: 0 1em; color: #00aaff; } - .tab-menu a:hover, - .tab-menu a.selected { + .tab-menu a:hover, .tab-menu a.selected { border-bottom: 3px solid #646363; color: #646363; } .tab-menu a:active { @@ -2445,165 +2266,55 @@ article { display: flex; padding-left: 0; } -.baseline, -.periodValues { +.baseline, .periodValues { padding: 2em 0; position: relative; width: 100%; margin-bottom: 55px; font-size: 115%; } - .baseline .baseline-value, - .baseline .baseline-year, - .baseline .period-target, - .baseline .period-actual, - .baseline .period-target-comment, - .periodValues .baseline-value, - .periodValues .baseline-year, - .periodValues .period-target, - .periodValues .period-actual, - .periodValues .period-target-comment { + .baseline .baseline-value, .baseline .baseline-year, .baseline .period-target, .baseline .period-actual, .baseline .period-target-comment, .periodValues .baseline-value, .periodValues .baseline-year, .periodValues .period-target, .periodValues .period-actual, .periodValues .period-target-comment { display: inline-block !important; padding: 0 0 10px 15px; } - .baseline .baseline-value > span:first-child, - .baseline .baseline-year > span:first-child, - .baseline .period-target > span:first-child, - .baseline .period-actual > span:first-child, - .baseline .period-target-comment > span:first-child, - .periodValues .baseline-value > span:first-child, - .periodValues .baseline-year > span:first-child, - .periodValues .period-target > span:first-child, - .periodValues .period-actual > span:first-child, - .periodValues .period-target-comment > span:first-child { + .baseline .baseline-value > span:first-child, .baseline .baseline-year > span:first-child, .baseline .period-target > span:first-child, .baseline .period-actual > span:first-child, .baseline .period-target-comment > span:first-child, .periodValues .baseline-value > span:first-child, .periodValues .baseline-year > span:first-child, .periodValues .period-target > span:first-child, .periodValues .period-actual > span:first-child, .periodValues .period-target-comment > span:first-child { color: rgba(32, 32, 36, 0.7); display: block; } - .baseline .baseline-value > span:first-child span, - .baseline .baseline-year > span:first-child span, - .baseline .period-target > span:first-child span, - .baseline .period-actual > span:first-child span, - .baseline .period-target-comment > span:first-child span, - .periodValues .baseline-value > span:first-child span, - .periodValues .baseline-year > span:first-child span, - .periodValues .period-target > span:first-child span, - .periodValues .period-actual > span:first-child span, - .periodValues .period-target-comment > span:first-child span { + .baseline .baseline-value > span:first-child span, .baseline .baseline-year > span:first-child span, .baseline .period-target > span:first-child span, .baseline .period-actual > span:first-child span, .baseline .period-target-comment > span:first-child span, .periodValues .baseline-value > span:first-child span, .periodValues .baseline-year > span:first-child span, .periodValues .period-target > span:first-child span, .periodValues .period-actual > span:first-child span, .periodValues .period-target-comment > span:first-child span { display: inline; } - .baseline .baseline-value span:nth-child(2n), - .baseline .baseline-value .actualValueSpan, - .baseline .baseline-year span:nth-child(2n), - .baseline .baseline-year .actualValueSpan, - .baseline .period-target span:nth-child(2n), - .baseline .period-target .actualValueSpan, - .baseline .period-actual span:nth-child(2n), - .baseline .period-actual .actualValueSpan, - .baseline .period-target-comment span:nth-child(2n), - .baseline .period-target-comment .actualValueSpan, - .periodValues .baseline-value span:nth-child(2n), - .periodValues .baseline-value .actualValueSpan, - .periodValues .baseline-year span:nth-child(2n), - .periodValues .baseline-year .actualValueSpan, - .periodValues .period-target span:nth-child(2n), - .periodValues .period-target .actualValueSpan, - .periodValues .period-actual span:nth-child(2n), - .periodValues .period-actual .actualValueSpan, - .periodValues .period-target-comment span:nth-child(2n), .periodValues .period-target-comment .actualValueSpan { + .baseline .baseline-value span:nth-child(2n), .baseline .baseline-value .actualValueSpan, .baseline .baseline-year span:nth-child(2n), .baseline .baseline-year .actualValueSpan, .baseline .period-target span:nth-child(2n), .baseline .period-target .actualValueSpan, .baseline .period-actual span:nth-child(2n), .baseline .period-actual .actualValueSpan, .baseline .period-target-comment span:nth-child(2n), .baseline .period-target-comment .actualValueSpan, .periodValues .baseline-value span:nth-child(2n), .periodValues .baseline-value .actualValueSpan, .periodValues .baseline-year span:nth-child(2n), .periodValues .baseline-year .actualValueSpan, .periodValues .period-target span:nth-child(2n), .periodValues .period-target .actualValueSpan, .periodValues .period-actual span:nth-child(2n), .periodValues .period-actual .actualValueSpan, .periodValues .period-target-comment span:nth-child(2n), .periodValues .period-target-comment .actualValueSpan { display: block; - font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-family: 'Montserrat', "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 400; font-size: 90%; color: rgba(44, 42, 116, 0.9); } - .baseline .baseline-value span:nth-child(2n) span, - .baseline .baseline-value .actualValueSpan span, - .baseline .baseline-year span:nth-child(2n) span, - .baseline .baseline-year .actualValueSpan span, - .baseline .period-target span:nth-child(2n) span, - .baseline .period-target .actualValueSpan span, - .baseline .period-actual span:nth-child(2n) span, - .baseline .period-actual .actualValueSpan span, - .baseline .period-target-comment span:nth-child(2n) span, - .baseline .period-target-comment .actualValueSpan span, - .periodValues .baseline-value span:nth-child(2n) span, - .periodValues .baseline-value .actualValueSpan span, - .periodValues .baseline-year span:nth-child(2n) span, - .periodValues .baseline-year .actualValueSpan span, - .periodValues .period-target span:nth-child(2n) span, - .periodValues .period-target .actualValueSpan span, - .periodValues .period-actual span:nth-child(2n) span, - .periodValues .period-actual .actualValueSpan span, - .periodValues .period-target-comment span:nth-child(2n) span, .periodValues .period-target-comment .actualValueSpan span { + .baseline .baseline-value span:nth-child(2n) span, .baseline .baseline-value .actualValueSpan span, .baseline .baseline-year span:nth-child(2n) span, .baseline .baseline-year .actualValueSpan span, .baseline .period-target span:nth-child(2n) span, .baseline .period-target .actualValueSpan span, .baseline .period-actual span:nth-child(2n) span, .baseline .period-actual .actualValueSpan span, .baseline .period-target-comment span:nth-child(2n) span, .baseline .period-target-comment .actualValueSpan span, .periodValues .baseline-value span:nth-child(2n) span, .periodValues .baseline-value .actualValueSpan span, .periodValues .baseline-year span:nth-child(2n) span, .periodValues .baseline-year .actualValueSpan span, .periodValues .period-target span:nth-child(2n) span, .periodValues .period-target .actualValueSpan span, .periodValues .period-actual span:nth-child(2n) span, .periodValues .period-actual .actualValueSpan span, .periodValues .period-target-comment span:nth-child(2n) span, .periodValues .period-target-comment .actualValueSpan span { display: inline; } - .baseline .baseline-value span:nth-child(2n) span:nth-child(1), - .baseline .baseline-value .actualValueSpan span:nth-child(1), - .baseline .baseline-year span:nth-child(2n) span:nth-child(1), - .baseline .baseline-year .actualValueSpan span:nth-child(1), - .baseline .period-target span:nth-child(2n) span:nth-child(1), - .baseline .period-target .actualValueSpan span:nth-child(1), - .baseline .period-actual span:nth-child(2n) span:nth-child(1), - .baseline .period-actual .actualValueSpan span:nth-child(1), - .baseline .period-target-comment span:nth-child(2n) span:nth-child(1), - .baseline .period-target-comment .actualValueSpan span:nth-child(1), - .periodValues .baseline-value span:nth-child(2n) span:nth-child(1), - .periodValues .baseline-value .actualValueSpan span:nth-child(1), - .periodValues .baseline-year span:nth-child(2n) span:nth-child(1), - .periodValues .baseline-year .actualValueSpan span:nth-child(1), - .periodValues .period-target span:nth-child(2n) span:nth-child(1), - .periodValues .period-target .actualValueSpan span:nth-child(1), - .periodValues .period-actual span:nth-child(2n) span:nth-child(1), - .periodValues .period-actual .actualValueSpan span:nth-child(1), - .periodValues .period-target-comment span:nth-child(2n) span:nth-child(1), .periodValues .period-target-comment .actualValueSpan span:nth-child(1) { + .baseline .baseline-value span:nth-child(2n) span:nth-child(1), .baseline .baseline-value .actualValueSpan span:nth-child(1), .baseline .baseline-year span:nth-child(2n) span:nth-child(1), .baseline .baseline-year .actualValueSpan span:nth-child(1), .baseline .period-target span:nth-child(2n) span:nth-child(1), .baseline .period-target .actualValueSpan span:nth-child(1), .baseline .period-actual span:nth-child(2n) span:nth-child(1), .baseline .period-actual .actualValueSpan span:nth-child(1), .baseline .period-target-comment span:nth-child(2n) span:nth-child(1), .baseline .period-target-comment .actualValueSpan span:nth-child(1), .periodValues .baseline-value span:nth-child(2n) span:nth-child(1), .periodValues .baseline-value .actualValueSpan span:nth-child(1), .periodValues .baseline-year span:nth-child(2n) span:nth-child(1), .periodValues .baseline-year .actualValueSpan span:nth-child(1), .periodValues .period-target span:nth-child(2n) span:nth-child(1), .periodValues .period-target .actualValueSpan span:nth-child(1), .periodValues .period-actual span:nth-child(2n) span:nth-child(1), .periodValues .period-actual .actualValueSpan span:nth-child(1), .periodValues .period-target-comment span:nth-child(2n) span:nth-child(1), .periodValues .period-target-comment .actualValueSpan span:nth-child(1) { margin-left: 10px; } - .baseline .period-target-comment span:nth-child(2n), - .periodValues .period-target-comment span:nth-child(2n) { + .baseline .period-target-comment span:nth-child(2n), .periodValues .period-target-comment span:nth-child(2n) { font-weight: 400; } - .baseline .baseline-value, - .baseline .period-target, - .periodValues .baseline-value, - .periodValues .period-target { + .baseline .baseline-value, .baseline .period-target, .periodValues .baseline-value, .periodValues .period-target { width: 50%; float: left; } - .baseline .baseline-year, - .baseline .period-actual, - .periodValues .baseline-year, - .periodValues .period-actual { + .baseline .baseline-year, .baseline .period-actual, .periodValues .baseline-year, .periodValues .period-actual { width: 50%; float: right; color: rgba(32, 32, 36, 0.6); position: relative; } - .baseline .baseline-year span, - .baseline .period-actual span, - .periodValues .baseline-year span, - .periodValues .period-actual span { + .baseline .baseline-year span, .baseline .period-actual span, .periodValues .baseline-year span, .periodValues .period-actual span { font-weight: 700; } - .baseline .baseline-year span:nth-child(1), - .baseline .period-actual span:nth-child(1), - .periodValues .baseline-year span:nth-child(1), - .periodValues .period-actual span:nth-child(1) { + .baseline .baseline-year span:nth-child(1), .baseline .period-actual span:nth-child(1), .periodValues .baseline-year span:nth-child(1), .periodValues .period-actual span:nth-child(1) { display: inline-block; margin-right: 10px; } - .baseline .baseline-year span:nth-child(4), - .baseline .period-actual span:nth-child(4), - .periodValues .baseline-year span:nth-child(4), - .periodValues .period-actual span:nth-child(4) { + .baseline .baseline-year span:nth-child(4), .baseline .period-actual span:nth-child(4), .periodValues .baseline-year span:nth-child(4), .periodValues .period-actual span:nth-child(4) { display: block; font-weight: 700; } - .baseline .baseline-year span.actualValueSpan, - .baseline .period-actual span.actualValueSpan, - .periodValues .baseline-year span.actualValueSpan, - .periodValues .period-actual span.actualValueSpan { + .baseline .baseline-year span.actualValueSpan, .baseline .period-actual span.actualValueSpan, .periodValues .baseline-year span.actualValueSpan, .periodValues .period-actual span.actualValueSpan { display: block; } - .baseline .baseline-year span.actualValueSpan span:nth-child(1), - .baseline .period-actual span.actualValueSpan span:nth-child(1), - .periodValues .baseline-year span.actualValueSpan span:nth-child(1), - .periodValues .period-actual span.actualValueSpan span:nth-child(1) { + .baseline .baseline-year span.actualValueSpan span:nth-child(1), .baseline .period-actual span.actualValueSpan span:nth-child(1), .periodValues .baseline-year span.actualValueSpan span:nth-child(1), .periodValues .period-actual span.actualValueSpan span:nth-child(1) { margin-right: 0; } - .baseline .baseline-year span.actualValueSpan span, - .baseline .period-actual span.actualValueSpan span, - .periodValues .baseline-year span.actualValueSpan span, - .periodValues .period-actual span.actualValueSpan span { + .baseline .baseline-year span.actualValueSpan span, .baseline .period-actual span.actualValueSpan span, .periodValues .baseline-year span.actualValueSpan span, .periodValues .period-actual span.actualValueSpan span { display: inline; } - .baseline .baseline-year .badge, - .baseline .period-actual .badge, - .periodValues .baseline-year .badge, - .periodValues .period-actual .badge { + .baseline .baseline-year .badge, .baseline .period-actual .badge, .periodValues .baseline-year .badge, .periodValues .period-actual .badge { background-color: #202024; -moz-transition: all 0.1s linear; -o-transition: all 0.1s linear; @@ -2615,17 +2326,11 @@ article { -o-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; - font-family: "Baskerville", "Goudy Old Style", "Palatino", "Book Antiqua", Georgia, serif; } - .baseline .baseline-year .badge:hover, - .baseline .period-actual .badge:hover, - .periodValues .baseline-year .badge:hover, - .periodValues .period-actual .badge:hover { + font-family: 'Baskerville', "Goudy Old Style", "Palatino", "Book Antiqua", Georgia, serif; } + .baseline .baseline-year .badge:hover, .baseline .period-actual .badge:hover, .periodValues .baseline-year .badge:hover, .periodValues .period-actual .badge:hover { background-color: #2c2a74; cursor: pointer; } - .baseline .baseline-year .result-tooltip, - .baseline .period-actual .result-tooltip, - .periodValues .baseline-year .result-tooltip, - .periodValues .period-actual .result-tooltip { + .baseline .baseline-year .result-tooltip, .baseline .period-actual .result-tooltip, .periodValues .baseline-year .result-tooltip, .periodValues .period-actual .result-tooltip { clear: both; position: absolute; top: 35px; @@ -2637,33 +2342,20 @@ article { -o-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } - .baseline .baseline-year .result-tooltip .tooltip-inner, - .baseline .period-actual .result-tooltip .tooltip-inner, - .periodValues .baseline-year .result-tooltip .tooltip-inner, - .periodValues .period-actual .result-tooltip .tooltip-inner { + .baseline .baseline-year .result-tooltip .tooltip-inner, .baseline .period-actual .result-tooltip .tooltip-inner, .periodValues .baseline-year .result-tooltip .tooltip-inner, .periodValues .period-actual .result-tooltip .tooltip-inner { background: white; color: #202024; -moz-box-shadow: 1px 1px 2px rgba(32, 32, 36, 0.5); -o-box-shadow: 1px 1px 2px rgba(32, 32, 36, 0.5); -webkit-box-shadow: 1px 1px 2px rgba(32, 32, 36, 0.5); box-shadow: 1px 1px 2px rgba(32, 32, 36, 0.5); } - .baseline .baseline-year .result-tooltip .tooltip-arrow, - .baseline .period-actual .result-tooltip .tooltip-arrow, - .periodValues .baseline-year .result-tooltip .tooltip-arrow, - .periodValues .period-actual .result-tooltip .tooltip-arrow { + .baseline .baseline-year .result-tooltip .tooltip-arrow, .baseline .period-actual .result-tooltip .tooltip-arrow, .periodValues .baseline-year .result-tooltip .tooltip-arrow, .periodValues .period-actual .result-tooltip .tooltip-arrow { position: absolute; background: white; border: 1px solid rgba(153, 153, 153, 0.8); left: 68px; top: -2px; } - .baseline .baseline-year .result-tooltip .tooltip-arrow:after, - .baseline .baseline-year .result-tooltip .tooltip-arrow:before, - .baseline .period-actual .result-tooltip .tooltip-arrow:after, - .baseline .period-actual .result-tooltip .tooltip-arrow:before, - .periodValues .baseline-year .result-tooltip .tooltip-arrow:after, - .periodValues .baseline-year .result-tooltip .tooltip-arrow:before, - .periodValues .period-actual .result-tooltip .tooltip-arrow:after, - .periodValues .period-actual .result-tooltip .tooltip-arrow:before { + .baseline .baseline-year .result-tooltip .tooltip-arrow:after, .baseline .baseline-year .result-tooltip .tooltip-arrow:before, .baseline .period-actual .result-tooltip .tooltip-arrow:after, .baseline .period-actual .result-tooltip .tooltip-arrow:before, .periodValues .baseline-year .result-tooltip .tooltip-arrow:after, .periodValues .baseline-year .result-tooltip .tooltip-arrow:before, .periodValues .period-actual .result-tooltip .tooltip-arrow:after, .periodValues .period-actual .result-tooltip .tooltip-arrow:before { bottom: 100%; left: 50%; border: solid transparent; @@ -2672,24 +2364,17 @@ article { width: 0; position: absolute; pointer-events: none; } - .baseline .baseline-year .result-tooltip .tooltip-arrow:after, - .baseline .period-actual .result-tooltip .tooltip-arrow:after, - .periodValues .baseline-year .result-tooltip .tooltip-arrow:after, - .periodValues .period-actual .result-tooltip .tooltip-arrow:after { + .baseline .baseline-year .result-tooltip .tooltip-arrow:after, .baseline .period-actual .result-tooltip .tooltip-arrow:after, .periodValues .baseline-year .result-tooltip .tooltip-arrow:after, .periodValues .period-actual .result-tooltip .tooltip-arrow:after { border-color: rgba(136, 183, 213, 0); border-bottom-color: rgba(153, 153, 153, 0.5); border-width: 7px; margin-left: -7px; } - .baseline .baseline-year .result-tooltip .tooltip-arrow:before, - .baseline .period-actual .result-tooltip .tooltip-arrow:before, - .periodValues .baseline-year .result-tooltip .tooltip-arrow:before, - .periodValues .period-actual .result-tooltip .tooltip-arrow:before { + .baseline .baseline-year .result-tooltip .tooltip-arrow:before, .baseline .period-actual .result-tooltip .tooltip-arrow:before, .periodValues .baseline-year .result-tooltip .tooltip-arrow:before, .periodValues .period-actual .result-tooltip .tooltip-arrow:before { border-color: rgba(194, 225, 245, 0); border-bottom-color: rgba(153, 153, 153, 0.5); border-width: 8px; margin-left: -8px; } - .baseline .period-target-comment, - .periodValues .period-target-comment { + .baseline .period-target-comment, .periodValues .period-target-comment { width: 100%; float: left; padding: 0 0 40px 15px; } @@ -2928,8 +2613,7 @@ article { color: silver; } .indicator-container .indicator-group .table thead tr { background-color: #ececec; } - .indicator-container .indicator-group .table tr, - .indicator-container .indicator-group .table td { + .indicator-container .indicator-group .table tr, .indicator-container .indicator-group .table td { border: none; color: #acacac; } .indicator-container .indicator-group .table tr { @@ -2944,10 +2628,7 @@ article { margin-right: 1.4em; } .indicator-container .indicator-group .table td { vertical-align: middle; } - .indicator-container .indicator-group .table td.period-td, - .indicator-container .indicator-group .table td.actual-td, - .indicator-container .indicator-group .table td.target-td, - .indicator-container .indicator-group .table td.actions-td { + .indicator-container .indicator-group .table td.period-td, .indicator-container .indicator-group .table td.actual-td, .indicator-container .indicator-group .table td.target-td, .indicator-container .indicator-group .table td.actions-td { white-space: nowrap; } .indicator-container .indicator-group .table td.target-td { font-weight: bold; } @@ -2997,8 +2678,7 @@ article { height: 100%; margin-left: 50px; margin-right: 15px; } - .indicator-bar-display-container .indicator-bar, - .indicator-bar-display-container .indicator-bar-progress-amount { + .indicator-bar-display-container .indicator-bar, .indicator-bar-display-container .indicator-bar-progress-amount { position: absolute; top: 38px; bottom: 24px; @@ -3055,7 +2735,6 @@ article { font-weight: normal; color: #515050; vertical-align: bottom; } - .indicator-bar-progress-complete-container .indicator-bar-progress-text { padding-left: 15px; font-size: 1.1em; @@ -3193,8 +2872,7 @@ article { border-radius: 2px; text-align: center; } -label.imageUpload input[type="file"], -label.fileUpload input[type="file"] { +label.imageUpload input[type="file"], label.fileUpload input[type="file"] { position: fixed; top: -1000px; } @@ -3326,7 +3004,6 @@ label.fileUpload input[type="file"] { background-color: #D1E6D1; } .update-dialog-container.pending-new-update .update-entry-container:first-child { border-left: none; } - .update-dialog-container td { padding: 8px 2em; } .update-dialog-container td .update-entry-container { @@ -3406,8 +3083,7 @@ label.fileUpload input[type="file"] { position: absolute; top: -5px; left: 45px; } - .update-dialog-container td .update-entry-container .indicator-bar-display-container .indicator-bar, - .update-dialog-container td .update-entry-container .indicator-bar-display-container .indicator-bar-progress-amount { + .update-dialog-container td .update-entry-container .indicator-bar-display-container .indicator-bar, .update-dialog-container td .update-entry-container .indicator-bar-display-container .indicator-bar-progress-amount { position: absolute; top: 38px; bottom: 24px; @@ -3574,8 +3250,7 @@ label.fileUpload input[type="file"] { opacity: 0.5; } .update-dialog-container td .update-entry-container .edit-slider .change-indicator.negative { background-color: red; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal { height: 5px; border: 0; background-color: rgba(255, 255, 255, 0); @@ -3586,15 +3261,13 @@ label.fileUpload input[type="file"] { -webkit-border-radius: 4px; border-radius: 4px; box-shadow: none; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-origin, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-origin { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-origin, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-origin { background-color: rgba(255, 255, 255, 0); -moz-border-radius: 4px; -o-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle { position: relative; width: 28px; height: 28px; @@ -3605,8 +3278,7 @@ label.fileUpload input[type="file"] { box-shadow: none; top: -7px; color: white; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:after, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:after { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:after, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:after { display: block; content: '|||'; color: white; @@ -3619,17 +3291,13 @@ label.fileUpload input[type="file"] { background-color: transparent; top: 0; left: -1px; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:before, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:before { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:before, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:before { display: none; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:hover, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:hover { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:hover, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:hover { background-color: #009ceb; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:active, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:active { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle:active, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle:active { background-color: #de8929; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle .handle-label, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle .handle-label { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle .handle-label, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle .handle-label { position: absolute; top: -32px; background-color: #007ab8; @@ -3637,8 +3305,7 @@ label.fileUpload input[type="file"] { width: 44px; left: -8px; text-align: center; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle .handle-label:after, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle .handle-label:after { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle .handle-label:after, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle .handle-label:after { content: ''; height: 0px; width: 0px; @@ -3648,8 +3315,7 @@ label.fileUpload input[type="file"] { border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #007ab8; } - .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle .handle-change-label, - .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle .handle-change-label { + .update-dialog-container td .update-entry-container .edit-slider .noUi-base .noUi-handle .handle-change-label, .update-dialog-container td .update-entry-container .edit-slider.noUi-horizontal .noUi-handle .handle-change-label { position: absolute; width: 42px; text-align: center; @@ -3729,22 +3395,16 @@ div.active .addOrg { .modalContainer .orgModal .modalContents .inputContainer { margin-top: 2.75em; margin-bottom: 1em; } - .modalContainer .orgModal .modalContents .inputContainer input + label, - .modalContainer .orgModal .modalContents .inputContainer select + label, - .modalContainer .orgModal .modalContents .inputContainer textarea + label { + .modalContainer .orgModal .modalContents .inputContainer input + label, .modalContainer .orgModal .modalContents .inputContainer select + label, .modalContainer .orgModal .modalContents .inputContainer textarea + label { position: absolute; top: -25px; transition: top 0.7s ease, opacity 0.7s ease; opacity: 0; font-size: 13px; font-weight: 600; } - .modalContainer .orgModal .modalContents .inputContainer input:valid + label, - .modalContainer .orgModal .modalContents .inputContainer select:valid + label, - .modalContainer .orgModal .modalContents .inputContainer textarea:valid + label { + .modalContainer .orgModal .modalContents .inputContainer input:valid + label, .modalContainer .orgModal .modalContents .inputContainer select:valid + label, .modalContainer .orgModal .modalContents .inputContainer textarea:valid + label { opacity: 1; } - .modalContainer .orgModal .modalContents .inputContainer input:focus + label, - .modalContainer .orgModal .modalContents .inputContainer select:focus + label, - .modalContainer .orgModal .modalContents .inputContainer textarea:focus + label { + .modalContainer .orgModal .modalContents .inputContainer input:focus + label, .modalContainer .orgModal .modalContents .inputContainer select:focus + label, .modalContainer .orgModal .modalContents .inputContainer textarea:focus + label { color: #2c2a74; } .modalContainer .orgModal .controls { position: absolute; @@ -3822,7 +3482,7 @@ div#my-reports { -o-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; - font-family: "Baskerville", "Goudy Old Style", "Palatino", "Book Antiqua", Georgia, serif; } + font-family: 'Baskerville', "Goudy Old Style", "Palatino", "Book Antiqua", Georgia, serif; } .period-td .badge:hover { background-color: #2c2a74; cursor: pointer; } @@ -3850,8 +3510,7 @@ div#my-reports { border: 1px solid rgba(153, 153, 153, 0.8); right: 8px; top: -2px; } - .period-td .result-tooltip .tooltip-arrow:after, - .period-td .result-tooltip .tooltip-arrow:before { + .period-td .result-tooltip .tooltip-arrow:after, .period-td .result-tooltip .tooltip-arrow:before { bottom: 100%; left: 50%; border: solid transparent; @@ -3873,12 +3532,9 @@ div#my-reports { .iatiCheck span.noCheck { color: #202024; } - .iatiCheck span.success { color: #5cb85c; } - .iatiCheck span.warning { color: #de8929; } - .iatiCheck span.error { color: #ee3124; } diff --git a/akvo/rsr/static/styles-src/main.scss b/akvo/rsr/static/styles-src/main.scss index a7c2536df5..b3d27f2305 100755 --- a/akvo/rsr/static/styles-src/main.scss +++ b/akvo/rsr/static/styles-src/main.scss @@ -18,7 +18,7 @@ body { text-rendering: optimizelegibility; font-family: $bodyFont; padding-top: 75px; - @include font-size(24px); + @include font-size(22px); line-height: 1.5; @media (max-width: 900px) { @include font-size(20px); diff --git a/akvo/templates/myrsr/project_editor/project_editor.html b/akvo/templates/myrsr/project_editor/project_editor.html index a28691f163..31bc09ddac 100644 --- a/akvo/templates/myrsr/project_editor/project_editor.html +++ b/akvo/templates/myrsr/project_editor/project_editor.html @@ -97,7 +97,7 @@

{% trans 'Project Editor' %} {% include "myrsr/project_editor/related_objects/result_input.html" with result='Result.'|add:project_id_string %} - + diff --git a/akvo/templates/myrsr/project_editor/related_objects/indicator_input.html b/akvo/templates/myrsr/project_editor/related_objects/indicator_input.html index 75e6bb8a2b..44b19965e3 100644 --- a/akvo/templates/myrsr/project_editor/related_objects/indicator_input.html +++ b/akvo/templates/myrsr/project_editor/related_objects/indicator_input.html @@ -30,7 +30,7 @@
{% trans 'Indicator references' %}
{% for reference in indicator.references.all %} {% include "myrsr/project_editor/related_objects/indicator_reference_input.html" %} {% empty %} - {% with indicator_id_string=indicator.pk|default:"new-0"|stringformat:"s" %} + {% with result_id_string=indicator.result.pk|default:"new-0"|stringformat:"s" indicator_id_string=indicator.pk|default:"new-0"|stringformat:"s" %} {% include "myrsr/project_editor/related_objects/indicator_reference_input.html" with reference='IndicatorReference.'|add:project_id_string|add:'_'|add:result_id_string|add:'_'|add:indicator_id_string %} {% endwith %} {% endfor %} @@ -55,7 +55,7 @@
{% trans 'Indicator references' %}
{% trans 'Indicator periods' %}
- {% with indicator_id_string=indicator.pk|default:"new-0"|stringformat:"s" %} + {% with result_id_string=indicator.result.pk|default:"new-0"|stringformat:"s" indicator_id_string=indicator.pk|default:"new-0"|stringformat:"s" %} {% for period in indicator.periods.all %} {% include "myrsr/project_editor/related_objects/indicator_period_input.html" %} {% empty %}