litvinovg/vivo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Modified style modal window and added close button.

Browse source
This commit is contained in:
Svetlana Rastegina 2021-04-27 15:30:55 +02:00 • committed by Georgy Litvinov
parent 7c3955dd67
commit a93063a517
3 changed files with 91 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

84
webapp/src/main/webapp/themes/iph/css/iph.css
View file

@ -3429,12 +3429,88 @@ label.switch >.collapseTextControl >img {
.modal-content {
background-color: #fefefe;
margin: auto;
padding: 20px;
padding: 30px 30px 15px 30px;
border: 1px solid #888;
width: 80%;
width: 60%;
}
.modal-content >label {
display: flex;
flex-direction: row;
font-size: 1.2rem;
font-family: "Roboto";
align-items: baseline;
margin-bottom: 15px;
}
#expandSettingsCB {
-moz-appearance: none;
}
#expandSettingsCB[type="checkbox"] {
border: 1px solid #8B4513;
width: 14px;
height: 14px;
margin-left: 8px;
}
#expandSettingsCB[type="checkbox"]:checked {
background-color: #EAD6A2;
background-image: url(../images/check-icon.svg);
background-repeat: no-repeat;
background-position: center center;
outline: none;
background-size: 12px 12px;
}
#metadataExpandSettingsCB {
-moz-appearance: none;
}
#metadataExpandSettingsCB[type="checkbox"] {
border: 1px solid #8B4513;
width: 14px;
height: 14px;
margin-left: 8px;
}
#metadataExpandSettingsCB[type="checkbox"]:checked {
background-color: #EAD6A2;
background-image: url(../images/check-icon.svg);
background-repeat: no-repeat;
background-position: center center;
outline: none;
background-size: 12px 12px;
}
#titleSettings {
font-size: 1.4rem;
font-family: "Roboto";
padding-bottom: 8px;
width: 80%;
}
#userViewSettings {
border: none;
cursor: pointer;
background: none;
padding-top: 3px;
padding-right: 0px;
padding-left: 4px;
}
.modalWrapper {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
width: 100%;
border-bottom: 1px solid #8B4513;
margin-bottom: 15px;
justify-content: space-between;
}
#closeModalWindow {
color: #8B4513;
width: 20%;
text-align: right;
font-size: 3rem;
font-family: "IPH Astra Serif";
}
#closeModalWindow:hover,
#closeModalWindow:focus {
color: black;
text-decoration: none;
cursor: pointer;
}
/* -------------------------------------------------> */
/* FONTS --------------------------------> */
/* -------------------------------------------------> */

4
webapp/src/main/webapp/themes/iph/js/collapsible_elements.js
View file

@ -8,10 +8,12 @@ function showUserSettingsModal() {
modalElement.style.display = 'block';
}
}
function hideUserSettingsModal() {
window.onclick = function(event) {
var modalElement = document.getElementById("userSettingsModal");
if (event.target == modalElement) {
var closeElement = document.getElementById("closeModalWindow");
if (event.target == modalElement || event.target == closeElement) {
modalElement.style.display = 'none';
}
}

12
webapp/src/main/webapp/themes/iph/templates/text-lib.ftl
View file

@ -236,17 +236,21 @@
</#macro>
<#macro userSettingsModal>
<button id="userViewSettings">
<img onclick="javascript:showUserSettingsModal();" src="${urls.base}/themes/iph/images/print.svg">
<button id="userViewSettings">
<img onclick="javascript:showUserSettingsModal();" src="${urls.base}/themes/iph/images/settings.svg">
</button>
<div id="userSettingsModal" class="modal" style="display:none;">
<div class="modal-content">
<div class="modalWrapper">
<div id="titleSettings">Выберите настройки:</div>
<span id="closeModalWindow">&times;</span>
</div>
<label>
<div>раскрывать документ</div>
<div>Всегда раскрывать документ при открытии</div>
<input id="expandSettingsCB" type="checkbox" onclick="switchExpandSettings('expandSettingsCB','switchExpand');">
</label>
<label>
<div>раскрывать метаданные</div>
<div>Всегда раскрывать метаданные при открытии</div>
<input id="metadataExpandSettingsCB" type="checkbox" onclick="switchExpandSettings('metadataExpandSettingsCB','metadataExpandSetting');">
</label>
</div>