added tip and changed mopst of the feedback functions, added random p…

…raise
MeikeSteinhilber · Jan 8, 2025 · 4ac89fd · 4ac89fd
1 parent e799696
commit 4ac89fd
Show file tree

Hide file tree

Showing 10 changed files with 2,433 additions and 1,522 deletions.
diff --git a/inst/tutorials/Grundlagen/Grundlagen.Rmd b/inst/tutorials/Grundlagen/Grundlagen.Rmd
diff --git a/inst/tutorials/Grundlagen/Grundlagen.html b/inst/tutorials/Grundlagen/Grundlagen.html
diff --git a/inst/tutorials/Grundlagen/css/style.css b/inst/tutorials/Grundlagen/css/style.css
@@ -30,6 +30,76 @@ original is from: https://github.com/tidymodels/learntidymodels/tree/main/inst/t
   border-color: #CA225E;
 }
 
+.tip summary {
+  background-color: #f2f2f2; /* Neutral background color */
+  border-color: grey;
+  font-size: 11px;
+  display: inline-block; /* Ensures the button adjusts to its content */
+  border-radius: 8px; /* Rounded corners for a modern look */
+  padding: 1px 6px; /* Padding for better spacing */
+  cursor: pointer; /* Pointer cursor for interactivity */
+  font-weight: bold; /* Bold text for emphasis */
+  margin-bottom: 25px;
+  border: 1px solid transparent; /* Border for a cleaner look */
+  transition: background-color 0.3s, transform 0.2s, box-shadow 0.2s; /* Smooth hover and click effects */
+}
+
+.tip summary:hover {
+  border-color: grey;
+  background-color: #e0e0e0; /* Slightly darker shade on hover */
+  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); /* Subtle shadow on hover */
+  transform: scale(1.02); /* Slightly enlarge on hover */
+}
+
+.tip summary:active {
+  border-color: grey;
+  background-color: #d6d6d6; /* Darker shade when clicked */
+  transform: scale(0.98); /* Slightly shrink to simulate pressing */
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); /* Subtle shadow change */
+}
+
+.tip details {
+  margin-top: 10px;
+  margin-left: 25px;
+  border-radius: 8px;
+  margin-bottom: 20px;
+  background-color: white !important; /* Keeps the details background consistent */
+}
+
+
+
+.tip-carousel {
+  border: 1px solid #ddd;
+  padding: 15px;
+  margin-top: -15px;
+}
+
+.tip-carousel button {
+  border: 1px solid transparent; /* Border for a cleaner look */
+  border-color: #ddd;
+  background-color: #f2f2f2;
+  color: black;
+  border-radius: 5px;
+  cursor: pointer;
+  font-size: small;
+}
+
+.tip-carousel button:disabled {
+  background-color: white;
+  color: #ddd;
+  cursor: not-allowed;
+}
+
+.tip-carousel .tip-content {
+  margin: 10px 0;
+  font-size: 14px;
+}
+
+.icon-small {
+  width: 40px;
+  height: 40px;
+}
+
 /* Default <details> styling */
 details {
   margin: 0; /* Remove default margins */

diff --git a/inst/tutorials/Grundlagen/images/env_example.png b/inst/tutorials/Grundlagen/images/env_example.png
diff --git a/inst/tutorials/Grundlagen/images/otter_info.png b/inst/tutorials/Grundlagen/images/otter_info.png
diff --git a/inst/tutorials/Grundlagen/images/otter_info.webp b/inst/tutorials/Grundlagen/images/otter_info.webp
diff --git a/inst/tutorials/Grundlagen/images/otter_info_2.webp b/inst/tutorials/Grundlagen/images/otter_info_2.webp
diff --git a/inst/tutorials/Grundlagen/images/otter_symbol.webp b/inst/tutorials/Grundlagen/images/otter_symbol.webp
diff --git a/inst/tutorials/Grundlagen/images/small_otter.png b/inst/tutorials/Grundlagen/images/small_otter.png
diff --git a/inst/tutorials/Grundlagen/images/small_otter2.png b/inst/tutorials/Grundlagen/images/small_otter2.png