XPUB
/
special-issue-11-wiki2html
24
1
Fork 1
Code Issues Pull Requests Releases Wiki Activity

layout btn

Browse Source
master
Sandra 4 years ago
parent 211fdfc986
commit 44258c5185
2 changed files with 141 additions and 140 deletions
Show Stats Download Patch File Download Diff File

255
static/title.css
Unescape Escape View File

@ -4,35 +4,35 @@ body {
}
.grid-container {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 10px;
position: absolute;
top: 25%;
width: 82%;
height: auto;
left: 7%;
text-align: : center;
z-index: 5;
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 10px;
position: absolute;
top: 25%;
width: 82%;
height: auto;
left: 7%;
text-align: : center;
z-index: 5;
}
.grid-container > div {
position: relative;
text-align: center;
z-index: 5;
position: relative;
text-align: center;
z-index: 5;
}
.thumbborder {
position: relative;
max-width: 100%;
max-height: 100%;
position: relative;
max-width: 100%;
max-height: 100%;
}
/*links*/
/*a:link {
a:link {
text-decoration: none;
color: #371F10;
}
@ -43,58 +43,58 @@ a:visited {
}
a:hover {
text-decoration: none;
color: blue;
}*/
text-decoration: none;
color: blue;
}
h1 {
/*position: fixed;
right:0%;
top:5%;
text-align: right;
background-color: rgba(11,239,235,0.7);
padding: 3px 35px 3px 10px;
z-index: 10;
font-size: 27px;
color: #371F10;*/
/*position: fixed;
right:0%;
top:5%;
text-align: right;
background-color: rgba(11,239,235,0.7);
padding: 3px 35px 3px 10px;
z-index: 10;
font-size: 27px;
color: #371F10;*/
max-width: 90%;
}
h2{
position: fixed;
right: 0%;
top: 15%;
text-align: left;
background-color: rgba(11,239,235,0.7);
padding: 3px 35px 3px 10px;
z-index: 10;
font-size: 20px;
position: fixed;
right: 0%;
top: 15%;
text-align: left;
background-color: rgba(11,239,235,0.7);
padding: 3px 35px 3px 10px;
z-index: 10;
font-size: 20px;
color: #371F10;
}
.viewnav {
position: fixed;
bottom: 1%;
right: 1%;
background-color: transparent;
width: 5%;
z-index: 9;
/*.viewnav {
position: fixed;
bottom: 1%;
right: 1%;
background-color: transparent;
width: 5%;
z-index: 9;
}
.collapsible2 {
background-color: transparent;
color: #371F10;
cursor: pointer;
padding: 0px;
width: 100%;
height: auto;
border: none;
text-align: center;
outline: none;
font-size: 40px;
z-index: 10;
margin-top: 0px;
color: #371F10;
cursor: pointer;
padding: 0px;
width: 100%;
height: auto;
border: none;
text-align: center;
outline: none;
font-size: 40px;
z-index: 10;
margin-top: 0px;
}
.collapsible2:hover {
@ -113,58 +113,63 @@ h2{
z-index: 10;
text-align: center;
bottom: 100%;
}
}*/
/* Grid buttons */
/*.header {
position: absolute;
text-align: center;
padding: 32px;
top: 30%;
right: 0%;
z-index: 9;
width: auto;
height: auto;
background-color: pink;
}*/
.header {
position: fixed;
/* text-align: center;*/
bottom: 0%;
right: 0%;
z-index: 9;
width: 110px;
height: 50px;
background-color: white;
color: #371F10;
}
p {
display: inline-block;
position: relative;
display: inline-block;
/*position: relative;*/
color: #371F10;
}
.btnov {
position: fixed;
display: inline;
right: 0px;
bottom:0px;
border: none;
outline: none;
width: 110px;
width: 50px;
height: 50px;
text-align: center;
padding: 0px 0px;
/* padding: 5px 5px;*/
background-color: transparent;
cursor: pointer;
font-size: 20px;
margin-right: 5px;
z-index: 9;
color: #371F10;
margin-bottom: 3px;
}
.btn {
position: fixed;
display: inline;
right: 60px;
bottom:0px;
border: none;
outline: none;
width: 110px;
width: 50px;
height: 50px;
text-align: center;
padding: 0px 0px;
background-color: transparent;
cursor: pointer;
font-size: 30px;
margin-right: 5px;
z-index: 9;
color: #371F10;
}
.btn:hover {
@ -176,25 +181,33 @@ p {
color:rgba(11,239,235);
}
.btnov:hover {
color:rgba(11,239,235);
/* color: blue;*/
}
.btnov:active {
color:rgba(11,239,235);
}
.metadata{
position: fixed;
top: 25%;
right: 0%;
background-color: transparent;
width: 60%;
z-index: 10;
opacity: 1;
text-align: right;
/*align-items: right;
align-content: right;*/
position: fixed;
top: 25%;
right: 0%;
background-color: transparent;
width: 60%;
z-index: 10;
opacity: 1;
text-align: right;
/*align-items: right;
align-content: right;*/
}
.collapsible {
display: inline-block;
right:0%;
display: inline-block;
right:0%;
background-color: white;
color: #371F10;
cursor: pointer;
@ -211,8 +224,8 @@ p {
}
.active, .collapsible:hover {
color: blue;
color: #371F10;
background-color:rgba(11,239,235);
}
.content {
@ -232,29 +245,29 @@ p {
}
a.content:link {
color:white;
color:white;
}
.metadata_organization {
/*font-size: 14px;*/
/*font-size: 14px;*/
}
.fbtn {
font-style: italic;
font-style: italic;
}
.smw-template-furtherresults {
display: none;
display: none;
}
/*
.orglink {
position: fixed;
top: 30%;
left: 0%;
background-color: white;
z-index: 10;
font-size: 30px;
padding: 0px 5px 0px 5px;
position: fixed;
top: 30%;
left: 0%;
background-color: white;
z-index: 10;
font-size: 30px;
padding: 0px 5px 0px 5px;
}
.orglink .htext {
@ -278,13 +291,13 @@ a.content:link {
}
.timelinelink {
position: fixed;
top: 20%;
left: 0%;
background-color: white;
z-index: 10;
font-size: 30px;
padding: 0px 5px 0px 5px;
position: fixed;
top: 20%;
left: 0%;
background-color: white;
z-index: 10;
font-size: 30px;
padding: 0px 5px 0px 5px;
}
.timelinelink .htext {
@ -308,13 +321,13 @@ a.content:link {
}
.indexlink {
position: fixed;
top:10%;
left:0%;
background-color: white;
z-index: 10;
font-size: 30px;
padding: 0px 5px 0px 5px;
position: fixed;
top:10%;
left:0%;
background-color: white;
z-index: 10;
font-size: 30px;
padding: 0px 5px 0px 5px;
}
.indexlink .htext {

26
templates/title.html
Unescape Escape View File

@ -13,14 +13,15 @@
<h1>{{ page.name }} &#8629;</h1>
<div class="viewnav">
<!-- <div class="viewnav">
<div class="collapsible2 viewbtn">&#9634;</div>
<div class="content2">
<p><button class="btn active" onclick="myFunction()">&#9635;</button></p>
<p><button class="btnov active" onclick="myFunction2()">&#9580;&#9580;</button></p>
<div class="content2"> -->
<div class="header" id="myHeader">
<p><button class="btn clicked" onclick="myFunction()">&#9635;</button></p>
<p><button class="btnov clicked" onclick="myFunction2()">&#9580;&#9580;</button></p>
</div>
</div>
<div>
<!-- </div>
<div> -->
<div id="body">{{ body|safe }}</div>
@ -40,20 +41,7 @@ for (i = 0; i < coll.length; i++) {
});
}
var coll = document.getElementsByClassName("collapsible2");
var i;
for (i = 0; i < coll.length; i++) {
coll[i].addEventListener("click", function() {
this.classList.toggle("active");
var content = this.nextElementSibling;
if (content.style.maxHeight){
content.style.maxHeight = null;
} else {
content.style.maxHeight = content.scrollHeight + "px";
}
});
}
</script>
</body>
</html>

Write Preview
Loading…
Cancel
Save