summaryrefslogtreecommitdiff
path: root/rannak/mangud/uliopilane
diff options
context:
space:
mode:
Diffstat (limited to 'rannak/mangud/uliopilane')
-rw-r--r--rannak/mangud/uliopilane/ajatelg/index.html47
-rw-r--r--rannak/mangud/uliopilane/ajatelg/styles.css39
-rw-r--r--rannak/mangud/uliopilane/tSark/index.html49
-rw-r--r--rannak/mangud/uliopilane/tSark/style.css28
-rw-r--r--rannak/mangud/uliopilane/utlused/css/utlused.css29
-rw-r--r--rannak/mangud/uliopilane/utlused/index.html51
6 files changed, 232 insertions, 11 deletions
diff --git a/rannak/mangud/uliopilane/ajatelg/index.html b/rannak/mangud/uliopilane/ajatelg/index.html
index 156d28d..d1855b7 100644
--- a/rannak/mangud/uliopilane/ajatelg/index.html
+++ b/rannak/mangud/uliopilane/ajatelg/index.html
@@ -11,6 +11,13 @@
<body class="text-white">
+
+ <!-- Button trigger modal -->
+ <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
+ Sissejuhatus
+ </button>
+
+
<div class="text-center text-white align-items-center pb-5 pealkiri">
<h1 class="pb-1 pt-2">Ajatelg</h1>
<p>Pane Sündumsed ajateljel õigsse järjekorda</p>
@@ -24,6 +31,43 @@
</div>
+
+ <!-- Modal -->
+ <div class="modal fade text-black" id="myModal" tabindex="-10" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+
+ <div class="modal-header">
+ <h5 class="modal-title" id="myModalLabel">Sissejuhatav info Ajatelje Mängule</h5>
+ <button type="button" class="closeModalButton" data-bs-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">&times;</span>
+ </button>
+ </div>
+
+ <div class="modal-body">
+ Odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ Arcu non odio euismod lacinia at quis risus sed vulputate odio. Nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ <br/>
+ Odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ Arcu non odio euismod lacinia at quis risus sed vulputate odio. Nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ <br/>
+ odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ arcu non odio euismod lacinia at quis risus sed vulputate odio. nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ </div>
+
+ </div>
+ </div>
+ </div>
+
+
+
+
<!-- Main stuff -->
<div class="row">
@@ -175,8 +219,7 @@
</div>
-
- </div>
+ </div> <!-- Row -->
<script src="script.js"></script>
diff --git a/rannak/mangud/uliopilane/ajatelg/styles.css b/rannak/mangud/uliopilane/ajatelg/styles.css
index 5966c9b..2585bc4 100644
--- a/rannak/mangud/uliopilane/ajatelg/styles.css
+++ b/rannak/mangud/uliopilane/ajatelg/styles.css
@@ -4,8 +4,8 @@ html {
}
* {
- margin: 0 !important;
- padding: 0 !important;
+ margin: 0;
+ padding: 0;
box-sizing: border-box !important;
}
@@ -37,6 +37,32 @@ button:disabled{
cursor: not-allowed;
}
+/* Modal Stuff */
+
+.closeModalButton {
+ border-radius: 50px;
+}
+
+.modalButton{
+ position: absolute;
+ top: 0;
+ right: 0;
+ padding: 6px;
+ padding: 9px 25px;
+ background-color: rgba(0,136,169,1) !important;
+ border: none !important;
+ border-radius: 50px !important;
+ cursor: pointer !important;
+ transition: all 0.3 ease 0 !important;
+ margin: 3% !important;
+ font-size: 1.4rem !important;
+}
+
+.modalButton:hover{
+ background-color: rgba(0,136,169,0.8) !important;
+}
+
+
/* Left side Part */
@@ -63,6 +89,11 @@ button:disabled{
/* Timeline css part*/
+.timelineWrapper{
+ padding: 0 !important;
+ margin: 0 !important;
+}
+
.timelineContainer {
min-height: 100vh;
width: 100%;
@@ -85,10 +116,10 @@ button:disabled{
}
.timeline ul li {
- padding: 20px;
+ padding: 7px;
background-color: #1e1f22;
color: white;
- margin-bottom: 20px;
+ margin-bottom: 15px;
}
.timeline ul li:last-child {
diff --git a/rannak/mangud/uliopilane/tSark/index.html b/rannak/mangud/uliopilane/tSark/index.html
index 382c382..dc2aafb 100644
--- a/rannak/mangud/uliopilane/tSark/index.html
+++ b/rannak/mangud/uliopilane/tSark/index.html
@@ -3,16 +3,14 @@
<title>Särgi Kujundus</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="style.css" rel="stylesheet"/>
- <!--
+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
- -->
</head>
<body>
<div class="containeraa">
-
<!-- Tshirt SVG -->
<svg viewBox="0 0 512 512">
<g transform="translate(0,448)">
@@ -23,6 +21,45 @@
+ <!-- Modal -->
+ <div class="modal fade text-black" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+
+ <div class="modal-header">
+ <h5 class="modal-title" id="myModalLabel">Sissejuhatav info Kuulsuste Mängule</h5>
+ <button type="button" class="closeModalButton" data-bs-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">&times;</span>
+ </button>
+ </div>
+
+ <div class="modal-body">
+ Odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ Arcu non odio euismod lacinia at quis risus sed vulputate odio. Nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ <br/>
+ Odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ Arcu non odio euismod lacinia at quis risus sed vulputate odio. Nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ <br/>
+ odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ arcu non odio euismod lacinia at quis risus sed vulputate odio. nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ </div>
+
+ </div>
+ </div>
+ </div>
+
+
+
+
+
+
+
<!-- Side panel stuff-->
<div class="side">
@@ -38,6 +75,12 @@
<button class="checkMoveOn">Kontrolli, kas särk valmis</button>
<button class="moveOn" disabled>Liigu Edasi</button>
+ <!-- Button trigger modal -->
+ <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
+ Sissejuhatus
+ </button>
+
+
<div class="messageBox">
</div>
</div>
diff --git a/rannak/mangud/uliopilane/tSark/style.css b/rannak/mangud/uliopilane/tSark/style.css
index 0bac36a..99f5fd8 100644
--- a/rannak/mangud/uliopilane/tSark/style.css
+++ b/rannak/mangud/uliopilane/tSark/style.css
@@ -1,5 +1,5 @@
body{
- background-color: #E3D4AD;
+ background-color: #fffcc9 !important;
box-sizing: border-box;
margin: 0;
padding: 0;
@@ -18,7 +18,7 @@ body{
width: 50%;
height: 100vh;
text-align: center;
- background-color: #D3BC8D;
+ background-color: #B3B07B;
}
@@ -54,6 +54,30 @@ button:disabled{
+/* Modal Stuff */
+
+.closeModalButton {
+ border-radius: 50px;
+}
+
+.modalButton{
+ padding: 5px !important;
+ margin-left: 60px !important;
+ background-color: rgba(0,136,169,1) !important;
+ border: none !important;
+ border-radius: 50px !important;
+ cursor: pointer !important;
+ transition: all 0.3 ease 0 !important;
+ font-size: 1.1rem !important;
+}
+
+.modalButton:hover{
+ background-color: rgba(0,136,169,0.8) !important;
+}
+
+
+
+
/* Svg stuff*/
svg {
diff --git a/rannak/mangud/uliopilane/utlused/css/utlused.css b/rannak/mangud/uliopilane/utlused/css/utlused.css
index e7c5277..b479b87 100644
--- a/rannak/mangud/uliopilane/utlused/css/utlused.css
+++ b/rannak/mangud/uliopilane/utlused/css/utlused.css
@@ -32,6 +32,35 @@ button:disabled{
opacity: 0.5;
}
+
+/* Modal Stuff */
+
+
+.closeModalButton {
+ border-radius: 50px;
+}
+
+.modalButton{
+ position: absolute;
+ top: 0;
+ right: 0;
+ padding: 25px !important;
+ background-color: rgba(0,136,169,1) !important;
+ border: none !important;
+ border-radius: 50px !important;
+ cursor: pointer !important;
+ transition: all 0.3 ease 0 !important;
+ margin: 3% !important;
+ font-size: 1.2rem !important;
+}
+
+.modalButton:hover{
+ background-color: rgba(0,136,169,0.8) !important;
+}
+
+
+
+
/* later added stuff here */
.wrapper {
diff --git a/rannak/mangud/uliopilane/utlused/index.html b/rannak/mangud/uliopilane/utlused/index.html
index 510c62d..6436bdd 100644
--- a/rannak/mangud/uliopilane/utlused/index.html
+++ b/rannak/mangud/uliopilane/utlused/index.html
@@ -14,6 +14,53 @@
</head>
<body class="bg-dark">
+
+
+
+ <!-- Button trigger modal -->
+ <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
+ Sissejuhatus
+ </button>
+
+
+ <!-- Modal -->
+
+ <div class="modal fade text-black" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+
+ <div class="modal-header">
+ <h5 class="modal-title" id="myModalLabel">Sissejuhatav info Kuulsate Ütluste Mängule</h5>
+ <button type="button" class="closeModalButton" data-bs-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">&times;</span>
+ </button>
+ </div>
+
+ <div class="modal-body">
+ Odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ Arcu non odio euismod lacinia at quis risus sed vulputate odio. Nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ <br/>
+ Odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ Arcu non odio euismod lacinia at quis risus sed vulputate odio. Nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ <br/>
+ odio eu feugiat pretium, nibh ipsum consequat nisl, vel pretium lectus quam id leo?
+ arcu non odio euismod lacinia at quis risus sed vulputate odio. nullam non nisi est,
+ sit amet facilisis magna etiam tempor, orci eu lobortis elementum,
+ nibh tellus molestie nunc, non blandit massa enim nec dui nunc.
+ </div>
+
+ </div>
+ </div>
+ </div>
+
+
+
+
+
<div class="wrapper container draggable-elements align-items-center">
<div class="empty ">
@@ -76,5 +123,9 @@
</div>
<script src="js/main.js"></script>
+
+
+ <!-- JavaScript Bundle with Popper -->
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
</body>
</html>