Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • d1656298/client-project
  • d1634883/client-project
2 results
Show changes
Commits on Source (10)
Hide whitespace changes
Inline Side-by-side
src/main/resources/templates/towns/caerphilly.html
View file @ 4d74c4a5
<!DOCTYPE html>
<html lang="en">
<style>
*{
background-color: #36454F;
color: white;
}
.explore{
color: deeppink;
}
a:link{
color: red;
}
.explore:visited{
color:purple;
}
.explore:hover{
color:plum;
}
.fnd{
color: dodgerblue;
}
.shopping{
color: orangered;
}
.activities{
color: rebeccapurple;
}
.services{
color: darkseagreen;
}
.checklistFlexbox{
flex-direction: row;
display: inline-flex;
/*justify-content: space-between;*/
flex-wrap: wrap;
text-align: left;
border: 2px solid white;
grid-area: checklistFlexbox;
}
.landmarkList{
padding-right: 15px;
/*border: 2px solid black;*/
}
.landmarkProgress{
text-align: center;
font-size: larger; /*vw changes with browser size*/
color: yellow;
}
/*block types denote whether a user has unlocked the respective landmark*/
#block1{
width:15px;height:15px;background: red;border-radius:50%;padding: 0; margin: 0px;height: 18px; width:18px;
}
#block2{
width:15px;height:15px;background: red;border-radius:50%;padding: 0; margin: 0px;height: 18px;width:18px;
}
#block3{
width:15px;height:15px;background: green;border-radius:50%;padding: 0; margin: 0px;height: 18px;width:18px;
}
#block4{
width:15px;height:15px;background: red;border-radius:50%;padding: 0; margin: 0px;height: 18px;width:18px;
}
#block5{
width:15px;height:15px;background: green;border-radius:50%;padding: 0; margin: 0px;height: 18px;width:18px;
}
.landmarkList, .checkList{
list-style-type: none;
}
.townName{
grid-area: title1;
}
.trailHeader{
grid-area: title2;
}
[BadgeStickerProgress]{
grid-area: BadgeStickerProgress;
}
.landmarkTitle{
grid-area:landmarkTitle
}
.container{
display:grid;
grid-template-columns: 50% 50%;
grid-template-rows: auto;
grid-template-areas:
"title1 title1"
"title2 title2"
"BadgeStickerProgress ."
"landmarkTitle ."
"checklistFlexbox .";
}
.checkmark .uncollected{ /*taken from https://www.w3schools.com/css/css_tooltip.asp*/
visibility: hidden;
width: 120px;
background-color: red;
color: whitesmoke;
text-align: center;
padding: 5px 0;
border-radius: 6px;
/*top: -5px;*/
/*left: 105%;*/
top: 5px;
left: 105%
}
.checkmark:hover .uncollected{
visibility: visible;
}
.checkmark .collected{ /*taken from https://www.w3schools.com/css/css_tooltip.asp*/
visibility: hidden;
width: 120px;
background-color: green;
color: whitesmoke;
text-align: center;
padding: 5px 0;
border-radius: 6px;
top: 0px;
left: 105%;
/*background-color: whitesmoke;*/
/*color: green;*/
}
.checkmark:hover .collected{
visibility: visible;
}
</style>
<head>
<meta charset="UTF-8">
<title>Caerphilly</title>
</head>
<body>
<h1> Welcome to the town of Caerphilly.</h1>
<main>
<div class="container">
<h1 class="townName"> Welcome to the town of Caerphilly.</h1>
<h2 class="trailHeader"> Welcome to the trail of trail-ness!</h2>
<section name="BadgeStickerProgress"> Sticker Pictures and stuff go here</section>
<h2 class="landmarkTitle">Caerphilly Landmark Progress:</h2>
<div class="checklistFlexbox">
<div><h2 style="padding-left: 3px">Badge Progress:</h2>
<div class="landmarkProgress"> <b class="landmarkProgress">2/5</b> </div>
<br>
<div class="landmarkProgress">
<b class="landmarkProgress" >3 to Go!!</b></div></p>
</div>
<li class="checkList">
<ul class="checkmark"><div id="block1"> </div> <span class="uncollected">Uncollected</span></ul>
<ul class="checkmark"><div id="block2"> </div><span class="uncollected">Uncollected</span></ul>
<ul class="checkmark"><div id="block3"> </div><span class="collected">Collected</span></ul>
<ul class="checkmark"><div id="block4"> </div><span class="uncollected">Uncollected</span></ul>
<ul class="checkmark"><div id="block5"> </div><span class="collected">Collected</span></ul>
</li>
<li name="landmarkList"class="landmarkList">
<ul><span class="shopping">Landmark 1 </span>
<span ><a href="../test.html" class="explore">- Explore!</a></span></ul>
<hr style="height:0px; visibility:hidden;" />
<ul><span class="services">Landmark 2 </span>
<span class="explore">- Explore!</span></ul> <hr style="height:0px; visibility:hidden;" />
<ul><span class="activities">Landmark 3 </span>
<span class="explore">- Explore!</span></ul> <hr style="height:0px; visibility:hidden;" />
<ul><span class="shopping">Landmark 4 </span>
<span class="explore">- Explore!</span></ul> <hr style="height:0px; visibility:hidden;" />
<ul><span class="fnd">Landmark 5 </span>
<span class="explore">- Explore!</span></ul>
</li>
</div>
</div>
</main>
</body>
</html>
\ No newline at end of file
src/main/resources/templates/towns/templates.server/Templating.html 0 → 100644
View file @ 4d74c4a5
<header th:fragment="headerBlock">
<br>Header Block<br>
</header>
<footer th:fragment="footerBlock">
<br><b>VZTA</b><br>
<br>Near Me Now LTD<br>
<br>Britania House<br>
<br>Caerphilly Business Park<br>
<br>Caerphilly<br>
<br>CF83 3GG<br>
<br>(C) VZTA 2022<br>
<br><b>Follow Us</b><br>
<br>Facebook Twitter Instagram LinkedIn<br>
<br>Privacy Policy Terms and Conditions<br>
</footer>
\ No newline at end of file