From 01658ea3294f5eab57772e02c30d766966b7fb40 Mon Sep 17 00:00:00 2001
From: lav-sen <lavinia.sen0@gmail.com>
Date: Mon, 22 Dec 2025 12:07:20 +0100
Subject: [PATCH 1/3] prettier buttons

---
 docs/boards/mcu/mcu-overview.mdx                      |  9 +++++----
 .../current/boards/mcu/mcu-overview.mdx               | 11 ++++++-----
 src/components/ButtonWithText/buttonWithText.jsx      |  7 +++++++
 3 files changed, 18 insertions(+), 9 deletions(-)
 create mode 100644 src/components/ButtonWithText/buttonWithText.jsx

diff --git a/docs/boards/mcu/mcu-overview.mdx b/docs/boards/mcu/mcu-overview.mdx
index a1193fd..e94903c 100644
--- a/docs/boards/mcu/mcu-overview.mdx
+++ b/docs/boards/mcu/mcu-overview.mdx
@@ -6,6 +6,7 @@ hide_title: true
 import mcus2top from "@site/static/img/mcus2/mcus2top.png";
 import AlertBox from "@site/src/components/AlertBox/AlertBox";
 import mcuPorts from "@site/static/img/mcu/sensebox-mcu-ports.png";
+import ButtonWithText from "@site/src/components/ButtonWithText/ButtonWithText";
 import {
   Popover,
   PopoverContent,
@@ -47,7 +48,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 <div className="flex flex-row justify-evenly">
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			I2C/Wire Anschlüsse
+		 <ButtonWithText title="I2C/Wire Ports" />
 		</PopoverTrigger>
 		<PopoverContent>
 			<div>
@@ -115,7 +116,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 	</Popover>
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			UART/Serielle Anschlüsse
+			 <ButtonWithText title="UART/Serielle Anschlüsse" />	
 		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
@@ -140,7 +141,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 	</Popover>
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			Digitale/Analoge Anschlüsse
+			 <ButtonWithText title="Digitale/Analoge Anschlüsse" />	
 		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
@@ -173,7 +174,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 	</Popover>
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			XBEE
+			<ButtonWithText title="XBEE" />	
 		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
diff --git a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
index 69cff99..486d781 100644
--- a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
+++ b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
@@ -5,6 +5,7 @@ hide_title: true
 
 import mcus2top from "@site/static/img/mcus2/mcus2top.png";
 import AlertBox from "@site/src/components/AlertBox/AlertBox";
+import ButtonWithText from "./ButtonWithText";
 import mcuPorts from "@site/static/img/en/mcu/sensebox-mcu-ports.jpg";
 import {
   Popover,
@@ -49,9 +50,9 @@ Click on the ports below to see which sensor is connected there.
 <div className="flex flex-row justify-evenly">
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			I2C/Wire Ports
+	  <ButtonWithText title="I2C/Wire Ports" />
 		</PopoverTrigger>
-		<PopoverContent>
+		<PopoverContent> 
 			<div>
 				<h2>Sensoren und Accessoire an den I2C/Wire Ports</h2>
 				<div className="flex flex-col lg:flex-row">
@@ -117,7 +118,7 @@ Click on the ports below to see which sensor is connected there.
 	</Popover>
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			UART/Serial port
+		 <ButtonWithText title="UART/Serielle Anschlüsse" />	
 		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
@@ -142,7 +143,7 @@ Click on the ports below to see which sensor is connected there.
 	</Popover>
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			Digital/Analogue ports
+		 <ButtonWithText title="Digitale/Analoge Anschlüsse" />	
 		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
@@ -175,7 +176,7 @@ Click on the ports below to see which sensor is connected there.
 	</Popover>
 	<Popover>
 		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			XBEE
+		<ButtonWithText title="XBEE" />	
 		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
diff --git a/src/components/ButtonWithText/buttonWithText.jsx b/src/components/ButtonWithText/buttonWithText.jsx
new file mode 100644
index 0000000..5b035e2
--- /dev/null
+++ b/src/components/ButtonWithText/buttonWithText.jsx
@@ -0,0 +1,7 @@
+const ButtonWithText = ({ title }) => (
+<button type="button" 
+class="text-body bg-neutral-secondary-medium box-border border border-default-medium hover:bg-neutral-tertiary-medium hover:text-heading focus:ring-4 focus:ring-neutral-tertiary shadow-xs font-medium leading-5 rounded-base text-sm px-4 py-2.5 focus:outline-none">
+    { title } </button>
+);
+
+export default ButtonWithText;
\ No newline at end of file

From dd2f6038b95601d57e0bf99054427fed42dceb0d Mon Sep 17 00:00:00 2001
From: lav-sen <lavinia.sen0@gmail.com>
Date: Mon, 22 Dec 2025 13:33:02 +0100
Subject: [PATCH 2/3] prettier buttons finish

---
 docs/boards/mcu/mcu-overview.mdx                  | 11 +----------
 docs/boards/mcus2/mcu-s2-overview.mdx             |  9 ++-------
 .../current/boards/mcu/mcu-overview.mdx           | 11 +----------
 .../current/boards/mcus2/mcu-s2-overview.mdx      |  9 ++-------
 src/components/ButtonWithText/ButtonWithText.jsx  | 15 +++++++++++++++
 src/components/ButtonWithText/buttonWithText.jsx  |  7 -------
 6 files changed, 21 insertions(+), 41 deletions(-)
 create mode 100644 src/components/ButtonWithText/ButtonWithText.jsx
 delete mode 100644 src/components/ButtonWithText/buttonWithText.jsx

diff --git a/docs/boards/mcu/mcu-overview.mdx b/docs/boards/mcu/mcu-overview.mdx
index e94903c..2340d5b 100644
--- a/docs/boards/mcu/mcu-overview.mdx
+++ b/docs/boards/mcu/mcu-overview.mdx
@@ -10,7 +10,6 @@ import ButtonWithText from "@site/src/components/ButtonWithText/ButtonWithText";
 import {
   Popover,
   PopoverContent,
-  PopoverTrigger,
 } from "@site/src/components/ui/popover";
 import lightSensor from "@site/static/img/hardware-bilder/helligkeit-uv/sensor_helligkeit_uv.png";
 import display from "@site/static/img/hardware-bilder/oled/display.png";
@@ -47,9 +46,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 
 <div className="flex flex-row justify-evenly">
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
 		 <ButtonWithText title="I2C/Wire Ports" />
-		</PopoverTrigger>
 		<PopoverContent>
 			<div>
 				<h2>Sensoren und Zubehör an den I2C/Wire Anschlüssen</h2>
@@ -115,9 +112,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 		</PopoverContent>
 	</Popover>
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-			 <ButtonWithText title="UART/Serielle Anschlüsse" />	
-		</PopoverTrigger>
+	 <ButtonWithText title="UART/Serielle Anschlüsse" />	
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
 				<div className="flex flex-col items-center">
@@ -140,9 +135,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 		</PopoverContent>
 	</Popover>
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
 			 <ButtonWithText title="Digitale/Analoge Anschlüsse" />	
-		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
 				<div className="flex flex-col items-center">
@@ -173,9 +166,7 @@ Klicke auf die unten stehenden Anschlüsse um zu sehen welcher Sensor dort anges
 		</PopoverContent>
 	</Popover>
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
 			<ButtonWithText title="XBEE" />	
-		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
 				<div className="flex flex-col items-center">
diff --git a/docs/boards/mcus2/mcu-s2-overview.mdx b/docs/boards/mcus2/mcu-s2-overview.mdx
index e071ad7..92df402 100644
--- a/docs/boards/mcus2/mcu-s2-overview.mdx
+++ b/docs/boards/mcus2/mcu-s2-overview.mdx
@@ -16,7 +16,6 @@ import {
 import {
 	Popover,
 	PopoverContent,
-	PopoverTrigger,
 } from "@site/src/components/ui/popover";
 import { Button } from "@site/src/components/ui/button";
 import mcus2ports from "@site/static/img/mcus2/mcus2-ports.png";
@@ -45,9 +44,7 @@ import mcus2top from "@site/static/img/mcus2/mcus2top.png";
 			<h1 className="text-left"> Anschlüsse </h1>
 			<div className="flex flex-row justify-evenly">
 				<Popover>
-					<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-						I2C/Wire Ports
-					</PopoverTrigger>
+					 <ButtonWithText title="I2C/Wire Ports" />
 					<PopoverContent>
 						<div>
 							<h2>Sensoren und Accessoire an den I2C/Wire Ports</h2>
@@ -97,9 +94,7 @@ import mcus2top from "@site/static/img/mcus2/mcus2top.png";
 					</PopoverContent>
 				</Popover>
 				<Popover>
-					<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-						Digital/Analog Ports
-					</PopoverTrigger>
+				 <ButtonWithText title="Digital/Analog Ports" />	
 					<PopoverContent>
 						<div>
 							<h2>Sensoren und Accessoire an den Digital/Analog Ports</h2>
diff --git a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
index 486d781..e4a1e02 100644
--- a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
+++ b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
@@ -10,7 +10,6 @@ import mcuPorts from "@site/static/img/en/mcu/sensebox-mcu-ports.jpg";
 import {
   Popover,
   PopoverContent,
-  PopoverTrigger,
 } from "@site/src/components/ui/popover";
 import lightSensor from "@site/static/img/hardware-bilder/helligkeit-uv/sensor_helligkeit_uv.png";
 import display from "@site/static/img/hardware-bilder/oled/display.png";
@@ -49,9 +48,7 @@ import Admonition from '@theme/Admonition';
 Click on the ports below to see which sensor is connected there.
 <div className="flex flex-row justify-evenly">
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
 	  <ButtonWithText title="I2C/Wire Ports" />
-		</PopoverTrigger>
 		<PopoverContent> 
 			<div>
 				<h2>Sensoren und Accessoire an den I2C/Wire Ports</h2>
@@ -117,9 +114,7 @@ Click on the ports below to see which sensor is connected there.
 		</PopoverContent>
 	</Popover>
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
 		 <ButtonWithText title="UART/Serielle Anschlüsse" />	
-		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
 				<div className="flex flex-col items-center">
@@ -142,9 +137,7 @@ Click on the ports below to see which sensor is connected there.
 		</PopoverContent>
 	</Popover>
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
 		 <ButtonWithText title="Digitale/Analoge Anschlüsse" />	
-		</PopoverTrigger>
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
 				<div className="flex flex-col items-center">
@@ -175,9 +168,7 @@ Click on the ports below to see which sensor is connected there.
 		</PopoverContent>
 	</Popover>
 	<Popover>
-		<PopoverTrigger className="flex cursor-pointer bg-white dark:bg-gray-800 text-black dark:text-gray-100 border border-gray-300 dark:border-gray-600 rounded-md w-[10rem] p-2 hover:bg-gray-100 dark:hover:bg-gray-700">
-		<ButtonWithText title="XBEE" />	
-		</PopoverTrigger>
+			<ButtonWithText title="XBEE" />	
 		<PopoverContent>
 			<div className="flex flex-col lg:flex-row">
 				<div className="flex flex-col items-center">
diff --git a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx
index 74bfeaa..bbc79c8 100644
--- a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx
+++ b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx
@@ -16,7 +16,6 @@ import {
 import {
 	Popover,
 	PopoverContent,
-	PopoverTrigger,
 } from "@site/src/components/ui/popover";
 import { Button } from "@site/src/components/ui/button";
 import mcus2ports from "@site/static/img/en/mcus2/mcus2-ports.png";
@@ -43,9 +42,7 @@ import mcus2top from "@site/static/img/mcus2/mcus2top.png";
 			<h1 className="text-left"> Ports </h1>
 			<div className="flex flex-row justify-evenly">
 				<Popover>
-					<PopoverTrigger className="flex cursor-pointer bg-white border-solid border-1 rounded-md w-[10rem] p-2 hover:bg-gray-100">
-						I2C/Wire ports
-					</PopoverTrigger>
+					 <ButtonWithText title="I2C/Wire ports" />
 					<PopoverContent>
 						<div>
 							<h2>Sensors and accessories on the I2C/Wire ports</h2>
@@ -95,9 +92,7 @@ import mcus2top from "@site/static/img/mcus2/mcus2top.png";
 					</PopoverContent>
 				</Popover>
 				<Popover>
-					<PopoverTrigger className="cursor-pointer bg-white border-solid border-1 rounded-md w-[10rem] p-2 hover:bg-gray-100">
-						Digital/Analogue ports
-					</PopoverTrigger>
+					 <ButtonWithText title="Digital/Analogue ports" />	
 					<PopoverContent>
 						<div>
 							<h2>Sensors and accessories on the digital/analogue ports</h2>
diff --git a/src/components/ButtonWithText/ButtonWithText.jsx b/src/components/ButtonWithText/ButtonWithText.jsx
new file mode 100644
index 0000000..ac021e9
--- /dev/null
+++ b/src/components/ButtonWithText/ButtonWithText.jsx
@@ -0,0 +1,15 @@
+import { PopoverTrigger } from "@radix-ui/react-popover";
+
+const ButtonWithText = ({ title, ...props }) => (
+  <PopoverTrigger asChild>
+    <button 
+      type="button" 
+      className="bg-gradient-to-r  from-green to-green hover:from-green-2 hover:to-green-2 text-white font-medium py-3 px-6 rounded-xl shadow-lg transition-all duration-300 ease-in-out"
+      {...props}
+    >
+      {title}
+    </button>
+  </PopoverTrigger>
+);
+
+export default ButtonWithText;
\ No newline at end of file
diff --git a/src/components/ButtonWithText/buttonWithText.jsx b/src/components/ButtonWithText/buttonWithText.jsx
deleted file mode 100644
index 5b035e2..0000000
--- a/src/components/ButtonWithText/buttonWithText.jsx
+++ /dev/null
@@ -1,7 +0,0 @@
-const ButtonWithText = ({ title }) => (
-<button type="button" 
-class="text-body bg-neutral-secondary-medium box-border border border-default-medium hover:bg-neutral-tertiary-medium hover:text-heading focus:ring-4 focus:ring-neutral-tertiary shadow-xs font-medium leading-5 rounded-base text-sm px-4 py-2.5 focus:outline-none">
-    { title } </button>
-);
-
-export default ButtonWithText;
\ No newline at end of file

From 67d8a46019cce392e50062a81aa28a61f216ef2a Mon Sep 17 00:00:00 2001
From: lav-sen <lavinia.sen0@gmail.com>
Date: Mon, 22 Dec 2025 14:18:31 +0100
Subject: [PATCH 3/3] improve import

---
 docs/boards/mcus2/mcu-s2-overview.mdx                           | 1 +
 .../current/boards/mcu/mcu-overview.mdx                         | 2 +-
 .../current/boards/mcus2/mcu-s2-overview.mdx                    | 1 +
 3 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/docs/boards/mcus2/mcu-s2-overview.mdx b/docs/boards/mcus2/mcu-s2-overview.mdx
index 92df402..9578bf4 100644
--- a/docs/boards/mcus2/mcu-s2-overview.mdx
+++ b/docs/boards/mcus2/mcu-s2-overview.mdx
@@ -7,6 +7,7 @@ import Admonition from "@theme/Admonition";
 import React, { useState } from "react";
 import { motion } from "framer-motion";
 import image from "@site/static/img/mcus2/mcus2top.png";
+import ButtonWithText from "@site/src/components/ButtonWithText/ButtonWithText";
 import {
 	Tooltip,
 	TooltipContent,
diff --git a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
index e4a1e02..207df47 100644
--- a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
+++ b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcu/mcu-overview.mdx
@@ -5,7 +5,7 @@ hide_title: true
 
 import mcus2top from "@site/static/img/mcus2/mcus2top.png";
 import AlertBox from "@site/src/components/AlertBox/AlertBox";
-import ButtonWithText from "./ButtonWithText";
+import ButtonWithText from "@site/src/components/ButtonWithText/ButtonWithText";
 import mcuPorts from "@site/static/img/en/mcu/sensebox-mcu-ports.jpg";
 import {
   Popover,
diff --git a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx
index bbc79c8..cb6e166 100644
--- a/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx
+++ b/i18n/en/docusaurus-plugin-content-docs/current/boards/mcus2/mcu-s2-overview.mdx
@@ -7,6 +7,7 @@ import Admonition from "@theme/Admonition";
 import React, { useState } from "react";
 import { motion } from "framer-motion";
 import image from "@site/static/img/mcus2/mcus2top.png";
+import ButtonWithText from "@site/src/components/ButtonWithText/ButtonWithText";
 import {
 	Tooltip,
 	TooltipContent,