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

layout btn

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

26
templates/title.html
Unescape Escape View File

@ -13,14 +13,15 @@
<h1>{{ page.name }} &#8629;</h1> <h1>{{ page.name }} &#8629;</h1>
<div class="viewnav"> <!-- <div class="viewnav">
<div class="collapsible2 viewbtn">&#9634;</div> <div class="collapsible2 viewbtn">&#9634;</div>
<div class="content2"> <div class="content2"> -->
<p><button class="btn active" onclick="myFunction()">&#9635;</button></p> <div class="header" id="myHeader">
<p><button class="btnov active" onclick="myFunction2()">&#9580;&#9580;</button></p> <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> -->
<div id="body">{{ body|safe }}</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> </script>
</body> </body>
</html> </html>

Write Preview
Loading…
Cancel
Save