diff --git a/src/components/Buttons.tsx b/src/components/Buttons.tsx
index 2c70797160b83742f4845797b33589f32428fb64..feff031fa33590f4ad1072600cfce22d82fdeca2 100644
--- a/src/components/Buttons.tsx
+++ b/src/components/Buttons.tsx
@@ -5,7 +5,15 @@ interface UrlButtonProps{
href: string,
children: string,
};
-
+ interface TabButtonProps{
+ classy?: string,
+ closing: string,
+ opentype: string
+ /* children?: React.ReactNode, */
+ /* onClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void, */
+ name: string,
+ type: string
+ }
export function Villagebutton({ title, source, page }: { title: string; source: string; page:string}) {
return (
@@ -90,15 +98,7 @@ export function TabButtonRow({data, classy, opentype, closing}: {data: Array<Tab
-interface TabButtonProps{
- classy?: string,
- closing: string,
- opentype: string
- /* children?: React.ReactNode, */
- /* onClick: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void, */
- name: string,
- type: string
-}
+
// neuer
export function TabButton({classy, name, closing, opentype, type}:TabButtonProps){
if (!classy){
@@ -234,23 +234,23 @@ export function ButtonFourRotate(){
-export function openIt({it}: {it: string}){
+export function openIt({whattoopen, classnamewhattoopen}: {whattoopen: string, classnamewhattoopen: string }){
const openit = (event : React.MouseEvent<HTMLElement, MouseEvent>) => {
/* console.log(document.getElementById(it)) */
- console.log(document.getElementById(it)?.className)
- let tabcontent = document.getElementsByClassName("cycletab");
+ console.log(document.getElementById(whattoopen)?.className)
+ let tabcontent = document.getElementsByClassName(classnamewhattoopen);
for (let i = 0; i < tabcontent.length; i++) {
(tabcontent[i] as HTMLElement).style.display = "none";
}
/* console.log(document.getElementById(it)!.style.display) */
- document.getElementById(it)!.style.display = "block";
+ document.getElementById(whattoopen)!.style.display = "block";
event.currentTarget.className += " active";
}
return openit;
}
-export function openItTwo({it}: {it: string}){
+function openItTwo({it}: {it: string}){
const openit = (event : React.MouseEvent<HTMLElement, MouseEvent>) => {
/* console.log(document.getElementById(it)) */
console.log(document.getElementById(it)?.className)
diff --git a/src/components/HorizontalTimeline.tsx b/src/components/HorizontalTimeline.tsx
index 604b87b040943f42a20970eed1dbd3556da5f5ef..cd8f4e8e74a499a710f21f1c249c5937b83e7a14 100644
--- a/src/components/HorizontalTimeline.tsx
+++ b/src/components/HorizontalTimeline.tsx
@@ -131,7 +131,7 @@ function TimeItem({tag, title, pic, author, tabid}: ItemProps){
<div>
{children}
</div>
- <button onClick={Open({person})} >Close</button>
+ <button onClick={Open({person})}>Close</button>
</span>
</div>
diff --git a/src/contents/engineering.tsx b/src/contents/engineering.tsx
index ab694a48a9592dc8ff5bcca1c218316d704216e9..1ae61da53c490b1673cb3cc2f35b90f99f9aa3f6 100644
--- a/src/contents/engineering.tsx
+++ b/src/contents/engineering.tsx
@@ -203,7 +203,7 @@ export function EngineeringCycleTab(){
<g
id="g25"
transform="translate(7.500978,3.0504898)">
- <a typeof="button" className="svg-button" onClick={openIt({it: "designing"})}>
+ <a typeof="button" className="svg-button" onClick={openIt({whattoopen: "designing", classnamewhattoopen: "cycletab"})}>
<path
className="cls-7"
d="m 42.05,115.59 c 27.77,9.19 57.83,-4.79 69.76,-32.23"
@@ -221,7 +221,7 @@ export function EngineeringCycleTab(){
id="polygon25"
style={{fill:"#850f78",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(2.9806259,0,0,2.9806259,-225.43722,-156.45123)" />
- <a typeof="button" className="svg-button" onClick={openIt({it: "learning"})}>
+ <a typeof="button" className="svg-button" onClick={openIt({whattoopen: "learning", classnamewhattoopen: "cycletab"})}>
<path
className="cls-12"
d="M 114,78.55 C 123.45,50.86 110,20.75 82.66,8.6"
@@ -248,7 +248,7 @@ export function EngineeringCycleTab(){
style={{fill:"#a0a7f3",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
inkscape:transform-center-x="3.6173751"
inkscape:transform-center-y="5.1978852" />
- <a typeof="button" className="svg-button" onClick={openIt({it: "testing"})}>
+ <a typeof="button" className="svg-button" onClick={openIt({whattoopen: "testing", classnamewhattoopen: "cycletab"})}>
<path
className="cls-9"
d="M 78.599111,7.5468264 C 43.820346,-2.6177588 13.956746,14.286046 4.2106281,46.368749"
@@ -273,7 +273,7 @@ export function EngineeringCycleTab(){
id="polygon25-6"
style={{fill:"#f57d22",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(-2.9650314,0.30449893,-0.30449893,-2.9650314,364.84067,249.28249)" />
- <a typeof="button" className="svg-button" onClick={openIt({it: "building"})}>
+ <a typeof="button" className="svg-button" onClick={openIt({whattoopen: "building", classnamewhattoopen: "cycletab"})}>
<path
className="cls-11"
d="M 2.6659753,50.953505 C -2.0956694,72.727915 10.936866,102.94273 36.656234,113.62834"
@@ -294,7 +294,7 @@ export function EngineeringCycleTab(){
id="polygon22"
style={{strokeWidth:"6",strokeDasharray:"none",fill:"#f4cc1e",fillOpacity:"1"}}
transform="matrix(2.8248588,0,0,2.8248588,-67.797781,-207.96977)" />
- <a typeof="button" className="svg-button" onClick={openIt({it: "designing"})}>
+ <a typeof="button" className="svg-button" onClick={openIt({whattoopen: "designing", classnamewhattoopen: "cycletab"})}>
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
@@ -305,7 +305,7 @@ export function EngineeringCycleTab(){
id="tspan29" /></textPath></text> </a>
</g>
</g>
- <a typeof="button" className="svg-button" onClick={openIt({it: "overview"})}>
+ <a typeof="button" className="svg-button" onClick={openIt({whattoopen: "overview", classnamewhattoopen: "cycletab"})}>
<circle
style={{opacity:"0.85",fill:"#e2dad7",fillOpacity:"1",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",paintOrder:"fill markers stroke"}}
id="path1"