diff --git a/wiki/pages/engineering.html b/wiki/pages/engineering.html
index 1f391bbf83c96550d50a61ea6352456c754ad753..ce305dc1243075e0e4995e763cd2039b3b3baf25 100644
--- a/wiki/pages/engineering.html
+++ b/wiki/pages/engineering.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/entrepreneurship.html b/wiki/pages/entrepreneurship.html
index e1b983d39d1b0b980d802a6c6b32cc6db1ed05dc..edabe21c60df0ce8cf894ed2a263ebde6d25edea 100644
--- a/wiki/pages/entrepreneurship.html
+++ b/wiki/pages/entrepreneurship.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/experiments.html b/wiki/pages/experiments.html
index 3bec2d312a1ec5fc8ee4fc25ad6b509283309988..982269cba0df908bdcd19f986390e0890b32bf70 100644
--- a/wiki/pages/experiments.html
+++ b/wiki/pages/experiments.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/hardware.html b/wiki/pages/hardware.html
index 59f54edc0fdbfd4ecc509b6408fcbe0249fe99b4..318c23321680f22b8afb932e67696bab4b5ce602 100644
--- a/wiki/pages/hardware.html
+++ b/wiki/pages/hardware.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,7 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
+
</style>
</head>
<body>
@@ -157,31 +108,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
diff --git a/wiki/pages/human-practices.html b/wiki/pages/human-practices.html
index 9baf53418020e8f64b67b66ab88357b6a33038a6..78ea155c026d41c1cffddfb3aca5dfb3af2aac1d 100644
--- a/wiki/pages/human-practices.html
+++ b/wiki/pages/human-practices.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/inclusivity.html b/wiki/pages/inclusivity.html
index 108b8355521c4d6148edcf92d671a824eec3f213..5bc258e6c4609ef05a8f43da31aa33010e210bd4 100644
--- a/wiki/pages/inclusivity.html
+++ b/wiki/pages/inclusivity.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/measurement.html b/wiki/pages/measurement.html
index 21dbf230c24df045ed6f5ed179903f07ca8a709a..2cf87a679729853bee5a80c8c915f776eb8c3825 100644
--- a/wiki/pages/measurement.html
+++ b/wiki/pages/measurement.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/model.html b/wiki/pages/model.html
index 6aff701dfc447ef7a51146a1e1a079ed6bdd589a..ecc4aa7abea1357919ce2e277ed1ebb5c4022422 100644
--- a/wiki/pages/model.html
+++ b/wiki/pages/model.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/notebook.html b/wiki/pages/notebook.html
index 60409bfa89388e00f8c5e72d6b5197ee740811eb..641702e2bc4f4406898126c5fd68b108da1ea94b 100644
--- a/wiki/pages/notebook.html
+++ b/wiki/pages/notebook.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/proof-of-concept.html b/wiki/pages/proof-of-concept.html
index f6c6e3f3a8cf9713c972b85cec0b161a6613d994..61642f9d18bbef0bda0e1561f6560c32bc8f55d4 100644
--- a/wiki/pages/proof-of-concept.html
+++ b/wiki/pages/proof-of-concept.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,6 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +107,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
diff --git a/wiki/pages/results.html b/wiki/pages/results.html
index 9694de832f504cf01e7af98f78c63aa94030c6a9..68242a9687d9d3f7a94f7b7e4ee0d676da2efe24 100644
--- a/wiki/pages/results.html
+++ b/wiki/pages/results.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,7 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
+
</style>
</head>
<body>
@@ -157,31 +108,7 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
+
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/safety.html b/wiki/pages/safety.html
index 44f7608a7f16936136c8a21a8356567477d20f63..f278352b824c93e36dff427e6f1497752a4ddf27 100644
--- a/wiki/pages/safety.html
+++ b/wiki/pages/safety.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -48,32 +24,7 @@
margin-left: 130px;
}
- .progress-container {
- position: fixed;
- left: 20px;
- bottom: 80px;
- width: 60px;
- height: 60px;
- z-index: 1000;
- }
-
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
+
</style>
</head>
<body>
@@ -157,31 +108,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/software.html b/wiki/pages/software.html
index 8b45b37333d15cb37e5c5c6ac82b67cb3de8af6b..f495a51151a47c31f18c6adb3b67f4a2b4676caa 100644
--- a/wiki/pages/software.html
+++ b/wiki/pages/software.html
@@ -16,31 +16,7 @@
max-width: 800px;
margin: 0 auto;
}
- .sidebar {
- position: fixed;
- left: 0;
- top: 280px;
- width: 160px;
- height: 40%;
- background-color: #ffffff;
- padding: 20px;
- box-shadow: 2px 0 5px rgba(0,0,0,0.1);
- border-radius: 20px;
- }
- .sidebar ul {
- list-style: none;
- padding: 0;
- }
- .sidebar ul li a {
- display: block;
- padding: 10px;
- color: hsl(17, 100%, 50%);
- text-decoration: none;
- }
- .sidebar ul li a:hover {
- background-color: #e9ecef;
- border-radius: 20px;
- }
+
h2 {
scroll-margin-top: 60px;
}
@@ -57,23 +33,6 @@
z-index: 1000;
}
- .progress-bar-circle {
- transform: rotate(-90deg);
- }
- .progress-circle {
- stroke: hsl(17, 100%, 50%);
- stroke-linecap: round;
- transition: stroke-dashoffset 0.3s;
- }
- .progress-text {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- font-size: 12px;
- font-weight: bold;
- color: hsl(17, 100%, 50%);
- }
</style>
</head>
<body>
@@ -157,31 +116,6 @@
</div>
</div>
- <script>
- document.addEventListener('DOMContentLoaded', function() {
- var circle = document.querySelector('.progress-circle');
- var radius = circle.r.baseVal.value;
- var circumference = radius * 2 * Math.PI;
-
- circle.style.strokeDasharray = `${circumference} ${circumference}`;
- circle.style.strokeDashoffset = circumference;
-
- function setProgress(percent) {
- const offset = circumference - (percent / 100) * circumference;
- circle.style.strokeDashoffset = offset;
- document.querySelector('.progress-text').textContent = Math.round(percent) + '%';
- }
-
- function handleScroll() {
- var winScroll = document.documentElement.scrollTop;
- var height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
- var scrolled = (winScroll / height) * 100;
- setProgress(scrolled);
- }
-
- window.addEventListener('scroll', handleScroll);
- });
- </script>
</body>
</html>
{% endblock %}
\ No newline at end of file
diff --git a/wiki/pages/team.html b/wiki/pages/team.html
index 198b0859d70335f70fe8a689cfa7b66ded2169dd..a9726f7e162d67b727530a0cca2364ae3a8f0b31 100644
--- a/wiki/pages/team.html
+++ b/wiki/pages/team.html
@@ -88,6 +88,13 @@ Meet Our Team Members
{% block page_content %}
+<div class="progress-container">
+ <svg class="progress-bar-circle" width="60" height="60">
+ <circle class="progress-circle" cx="30" cy="30" r="25" stroke-width="5" fill="transparent"></circle>
+ </svg>
+ <div class="progress-text">0%</div>
+</div>
+
<div style="text-align: center;">
<img src="https://static.igem.wiki/teams/5187/teammembers/team-pic.jpg" alt="thu" style="max-width: 100%; height: auto; width: 50%;border-radius: 20px;">
</div>