Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • 2024/bielefeld-cebitec
  • l-sanfilippo/bielefeld-ce-bi-tec-temp
2 results
Show changes
Hide whitespace changes
Inline Side-by-side
Showing
with 2258 additions and 215 deletions
src/components/slider.tsx → src/components/Slider.tsx
View file @ 3fd292fd
File moved
src/components/Svgs.tsx 0 → 100644
View file @ 3fd292fd
import { useNavigation } from "../utils"
import { ScrollLinkWithChild } from "./ScrollLink";
export function Complex(){
const { goToPagesAndOpenTab /* , goToTextsAndOpenCollapsible */ } = useNavigation();
return(
<>
<svg
version="1.1"
id="svg1"
width="1680.5347"
height="100%"
viewBox="0 0 1680.5347 894.22675"
xmlns="http://www.w3.org/2000/svg">
<defs
id="defs1" />
<path
style={{display:"inline",fill:"none",fillOpacity:"1",stroke:"#b85bd1",strokeWidth:"11",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 536.25592,140.66225 c 0,0 36.68755,-41.469505 156.18317,-33.42618 119.49562,8.04333 168.25581,15.34193 228.7437,31.64862 60.48789,16.30669 73.11105,58.8616 73.11105,58.8616"
id="path4" />
<path
style={{display:"inline",fill:"#f57d22",fillOpacity:"1",stroke:"none",strokeWidth:"9.82677",paintOrder:"fill markers stroke"}}
d="m 349.7092,115.90912 c -21.58164,43.29511 -22.06871,43.32792 -19.73816,95.58165 1.00526,22.53928 27.8566,61.79793 40.84233,70.34232 12.98573,8.54438 36.92769,11.19405 81.00698,2.18022 44.07929,-9.01383 78.04877,-12.93144 98.29137,-42.33894 20.2426,-29.4075 19.64336,-80.29068 9.28194,-105.24677 C 540.4759,90.863009 425.94772,52.3266 381.92493,88.31964 351.27283,113.3808 349.7092,115.90912 349.7092,115.90912 Z"
id="rnabinding" />
<path
style={{display:"inline",fill:"none",fillOpacity:"1",stroke:"#b85bd1",strokeWidth:"11",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 1199.7991,273.39017 c 0,0 67.9513,2.20866 100.4647,20.80954 32.5133,18.60088 64.9287,50.969 72.947,73.88046 8.0182,22.91146 9.9963,94.80072 -1.1615,135.05709 -11.1579,40.25637 -26.5289,105.00932 -40.3378,121.85105 -13.8089,16.84173 -24.9464,29.79483 -60.149,33.78219 -35.2026,3.98736 -145.9148,-24.41744 -145.9148,-24.41744"
id="path5" />
<path
className="rnabindingloch"
style={{display:"inline",fill:"#d15f09",fillOpacity:"1",stroke:"none",strokeWidth:"9.82677",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 433.35343,288.04207 c 0,0 -3.04023,-23.08257 -4.71846,-49.50734 -1.67823,-26.42478 -7.67326,-39.22201 -14.58977,-67.54697 -6.91652,-28.32496 4.14016,-32.04292 15.97827,-37.05034 11.83811,-5.00743 28.73094,-14.91508 43.352,8.75061 14.62107,23.66569 14.99989,51.025 27.92,76.7785 12.92011,25.7535 24.88006,44.41503 24.88006,44.41503 0,0 -28.28613,16.76837 -47.05414,19.85701 -18.768,3.08863 -45.76796,4.3035 -45.76796,4.3035 z"
id="rnabindingloch" />
<path
style={{display:"inline",fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 540.97421,543.68479 c -10.11403,4.30089 -23.84837,10.81751 -15.53277,29.24496 8.3156,18.42745 13.74418,27.04158 25.26655,36.1218 10.45561,8.23956 12.20931,-0.77942 28.03211,9.36138 17.10865,10.96489 16.39326,38.74553 3.34221,46.7528 -13.05105,8.00727 -38.07928,12.54084 -47.70812,1.70731 -8.43268,-9.48772 -11.52904,-30.53317 -6.16837,-38.65867 5.36067,-8.12549 -12.9797,-23.17631 -21.69563,-46.5582 -8.71594,-23.3819 -2.64855,-32.13787 -26.36208,-30.65517 -14.13322,0.88369 -37.11257,25.10484 -37.11257,25.10484 l -34.69048,22.36871"
id="path8-1"
/>
<path
style={{display:"inline",fill:"#f57d22",fillOpacity:"1",stroke:"none",strokeWidth:"9.82677",paintOrder:"fill markers stroke"}}
d="m 937.53671,223.96776 c -21.40089,65.64728 43.54825,100.84349 60.58042,108.97423 17.03217,8.13074 40.98497,17.60709 65.42417,20.62795 24.4392,3.02087 92.3388,4.7403 119.2434,-11.6398 19.1987,-11.6886 63.6092,-33.75963 40.4006,-98.33475 -23.2085,-64.57512 -42.9497,-85.92164 -98.8589,-97.3748 -55.9092,-11.45316 -67.5984,-15.61231 -121.1658,12.36741 -53.5674,27.97973 -65.62389,65.37976 -65.62389,65.37976 z"
id="minirt"
/>
<path
style={{display:"inline",fill:"#f57d22",fillOpacity:"1",stroke:"none",strokeWidth:"9.82677",paintOrder:"fill markers stroke"}}
d="m 837.40398,459.62386 c 53.6149,-18.71228 71.01922,-25.99811 123.49074,-16.72359 52.47148,9.27452 126.82848,26.96955 150.03198,62.08192 23.2035,35.11236 44.9844,97.62703 35.7829,130.23724 -9.2015,32.61021 -22.6564,43.72491 -64.5844,60.37293 -41.9281,16.64801 -101.67903,36.39624 -155.22182,37.53952 -53.54278,1.14329 -94.14033,-0.38337 -144.24281,-35.75999 -50.10248,-35.37662 -105.60427,-53.3835 -113.21763,-91.69462 -15.97187,-80.37187 45.59759,-103.347 167.96104,-146.05341 z"
id="path3"
/>
<path
style={{display:"inline",fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 431.75202,288.16742 c 0,0 20.82795,-14.71627 20.48015,-30.15258 -0.34781,-15.43631 -15.83522,-67.76339 -18.22234,-83.40439 -2.38712,-15.64101 21.56786,-31.87251 30.84683,-7.13798 9.27897,24.73452 13.67107,64.44744 26.47192,81.21007 12.80084,16.76263 42.11616,19.11139 64.57262,14.48476"
id="path8-3"
/>
<path
style={{display:"inline",fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 553.17412,264.25703 c 24.04866,0.53187 172.88723,3.23312 205.24378,-0.64714 32.35654,-3.88026 65.48601,-0.77851 103.12512,11.22141 37.6391,11.99992 121.55271,52.51332 144.57278,57.48641 23.0201,4.97309 132.8725,26.14781 150.8111,32.22867 17.9386,6.08086 32.9029,30.34939 29.1407,38.44711 -5.4213,11.66858 -27.8879,21.64108 -47.7817,15.80167 -19.8939,-5.83941 -69.1697,-26.46578 -94.1575,-28.23913 -24.9878,-1.77336 -68.43594,5.53583 -90.86005,13.8862 -22.42411,8.35037 -60.74917,20.00023 -62.62121,29.96906 -4.38587,23.35527 13.00387,33.96573 23.79499,52.54176 14.26765,24.5606 33.7745,49.05959 39.51204,64.52917 6.32043,17.04118 3.29363,38.09445 -12.44132,42.81669 -15.73495,4.72225 -29.18807,-7.20639 -41.91145,-34.3568 -12.72337,-27.15041 -29.42056,-70.56704 -36.72499,-81.72696 -7.30444,-11.15992 -22.51137,-38.183 -38.59694,-40.38686 -16.08557,-2.20387 -40.79116,12.30043 -55.96629,22.81124 -15.17512,10.5108 -210.37472,79.30109 -229.73923,84.3324"
id="path8"
/>
<g
id="pegrnapath"
style={{strokeWidth:"5",strokeDasharray:"none"}}
transform="translate(322.46791,74.987221)">
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 530.85998,389.77946 c 37.6348,-17.18859 37.6348,-17.18859 37.6348,-17.18859"
id="path19" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 565.13684,459.70353 c 46.17508,-19.7416 46.17508,-19.7416 46.17508,-19.7416"
id="path26" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 733.99145,264.05655 -12.16163,50.10753"
id="path9" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 746.96464,275.38214 c -5.58393,20.91553 -8.62217,30.89794 -12.19161,43.16173"
id="path10"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 763.00787,273.89496 c -13.13376,47.83559 -13.13376,47.83559 -13.13376,47.83559"
id="path11" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 776.01371,278.10833 c -11.55338,49.60998 -11.55338,49.60998 -11.55338,49.60998"
id="path12" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 790.23741,280.78773 c -11.55338,49.60998 -11.55338,49.60998 -11.55338,49.60998"
id="path12-3" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 805.45425,282.32536 c -13.77169,53.10391 -13.77169,53.10391 -13.77169,53.10391"
id="path13" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 819.40056,286.12855 c -5.52223,22.92448 -5.52223,22.92448 -5.52223,22.92448"
id="path27" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 803.18973,339.17508 c 7.68386,-18.51268 7.68386,-18.51268 7.68386,-18.51268"
id="path28" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 837.31731,292.44493 c -10.79238,14.2585 -10.79238,14.2585 -10.79238,14.2585"
id="path29" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 818.1798,342.09143 c 4.65903,-17.2115 4.65903,-17.2115 4.65903,-17.2115"
id="path30" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 840.58155,342.4093 c -6.68362,-17.61208 -6.68362,-17.61208 -6.68362,-17.61208"
id="path31" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 849.53572,302.40957 c -13.49526,13.21192 -13.49526,13.21192 -13.49526,13.21192"
id="path32" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:4.35,strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 863.37182,324.98114 c -15.83329,0 -15.83329,0 -15.83329,0"
id="path33" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 583.11722,345.10198 572.99301,329.80804"
id="path41-8-3-8-4"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 594.77916,339.29344 584.65495,323.9995"
id="path41-8-3-8-4-6"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 608.68878,332.31411 598.56457,317.02017"
id="path41-8-3-8-4-9"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 621.18309,328.60304 611.05888,313.3091"
id="path41-8-3-8-4-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 635.55704,324.65231 625.43283,309.35837"
id="path41-8-3-8-4-85"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 648.84835,320.05086 -4.3775,-16.44119"
id="path41-8-3-8-4-88"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 663.65023,317.9673 -1.73916,-17.93391"
id="path41-8-3-8-4-64"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 676.90972,315.13638 -1.73916,-17.93391"
id="path41-8-3-8-4-64-6"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 690.22111,313.97362 -1.73916,-17.93391"
id="path41-8-3-8-4-64-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 705.97964,313.25941 704.24048,295.3255"
id="path41-8-3-8-4-64-4"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 539.29208,398.68535 33.89003,-14.99956"
id="path21"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 544.47999,411.43415 c 38.76909,-17.3545 38.76909,-17.3545 38.76909,-17.3545"
id="path22" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 549.99876,423.0566 40.593,-15.23029"
id="path23"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 554.44414,434.56614 C 594.0654,418.8958 594.0654,418.8958 594.0654,418.8958"
id="path24" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 560.64477,446.41266 c 42.97306,-17.37607 42.97306,-17.37607 42.97306,-17.37607"
id="path25" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 572.67887,472.68514 c 46.17508,-19.7416 46.17508,-19.7416 46.17508,-19.7416"
id="path26-6" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 578.05305,485.58044 c 46.17508,-19.7416 46.17508,-19.7416 46.17508,-19.7416"
id="path26-6-2" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 582.89381,496.65064 c 21.2641,-7.88192 21.2641,-7.88192 21.2641,-7.88192"
id="path34" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 629.20532,475.53513 c -15.7114,9.27136 -15.7114,9.27136 -15.7114,9.27136"
id="path35" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 593.2247,509.25381 c 12.69499,-10.17136 12.69499,-10.17136 12.69499,-10.17136"
id="path36" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 638.07955,490.35751 c -19.38266,5.28122 -19.38266,5.28122 -19.38266,5.28122"
id="path37" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 610.99147,518.39764 c 2.31734,-11.51589 2.31734,-11.51589 2.31734,-11.51589"
id="path38" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 522.55274,376.08751 c 14.40042,-8.73166 18.2882,-10.82848 18.2882,-10.82848"
id="path39" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 516.76111,368.65516 13.89422,-18.57319"
id="path40"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 571.88938,360.8001 -17.89437,0.1219"
id="path41-8-3-1"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 498.92722,361.37753 0.0149,-19.42075"
id="path41"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 473.0409,351.39118 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-29" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 487.63067,361.87819 -2.65925,-18.40672"
id="path41-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 310.83681,418.52593 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-5" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 335.81235,409.42163 c 6.71894,18.61879 6.71894,18.61879 6.71894,18.61879"
id="path51" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 323.19849,412.76779 c 7.36484,18.00609 7.36484,18.00609 7.36484,18.00609 v 0"
id="path52" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 298.69052,422.58483 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 286.10231,426.75272 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-1" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 273.50005,431.32608 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-9" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 259.89368,434.97657 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-50" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 246.55493,440.52839 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-6" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 231.97638,445.95104 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-15" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 218.16902,451.14502 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-56" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 348.3015,404.27159 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-4" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 360.44403,399.80612 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-68" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 373.89156,395.76916 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-49" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 386.25713,391.62643 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-92" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 399.83546,384.29635 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-2" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 414.26807,379.48684 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-10" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 425.24339,373.97925 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-490" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 436.77752,368.497 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-11" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 448.27804,361.89365 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-67" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 461.71161,355.10839 c 7.25482,15.07713 7.25482,15.07713 7.25482,15.07713"
id="path50-3" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 507.1778,364.57942 8.09998,-21.88575"
id="path41-8-3"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 573.80336,351.03527 -15.43759,-10.0884"
id="path41-8-3-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 499.29566,191.9072 -2.9846,19.77736"
id="path50-67-9-5-2-8-06-87"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 486.52096,190.70657 -2.9846,19.77736"
id="path50-67-9-5-2-8-06-9"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 417.78232,191.67835 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 554.32907,207.90708 -6.46482,19.65557"
id="path50-67-9-5-2-8-06-8-19"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 541.0033,202.45217 -6.46482,19.65557"
id="path50-67-9-5-2-8-06-8-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 527.7793,196.44264 -6.46482,19.65557"
id="path50-67-9-5-2-8-06-8-4"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 515.52298,194.78601 -6.46482,19.65557"
id="path50-67-9-5-2-8-06-8-26"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 474.7574,190.15448 -2.9846,19.77736"
id="path50-67-9-5-2-8-06-6"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 459.38192,188.9481 -2.9846,19.77736"
id="path50-67-9-5-2-8-06-5"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 445.70633,190.63672 -2.9846,19.77736"
id="path50-67-9-5-2-8-06-91"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 432.71277,190.08175 -2.9846,19.77736"
id="path50-67-9-5-2-8-1-7"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 404.73856,192.81271 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-0"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 392.7803,193.12591 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-05"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 380.61694,192.3647 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-28"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 367.06664,192.91083 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-09"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 354.12612,192.83242 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-5"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 341.38733,194.99699 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-36"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 328.90695,190.81042 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-9"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 314.5649,191.20099 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-74"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 300.81714,192.67105 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-94"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 287.63932,193.04419 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-12"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 274.14132,188.94068 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-88"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 259.10916,192.51927 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-83"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 246.10898,189.47235 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-47"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 719.56799,265.10319 -7.71377,20.0851"
id="path50-67-9"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 598.88127,224.74147 -6.46482,19.65557"
id="path50-67-9-5-2-8-06-8-7"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 588.61885,220.34067 -6.46482,19.65557"
id="path50-67-9-5-2-8-06-8-2"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 705.35615,261.99704 -7.71377,20.0851"
id="path50-67-9-5"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 689.69597,256.14909 -3.88906,21.76026"
id="path50-67-9-5-2"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 677.61895,253.01029 -6.83355,21.94595"
id="path50-67-9-5-2-5"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 660.04672,252.44277 -2.9846,19.77736"
id="path50-67-9-5-2-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 646.17047,245.2659 -2.9846,19.77736"
id="path50-67-9-5-2-8-0"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 634.24101,241.13424 -2.9846,19.77736"
id="path50-67-9-5-2-8-1"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 622.66455,235.44547 -2.9846,19.77736"
id="path50-67-9-5-2-8-06"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 609.71382,231.34542 -2.9846,19.77736"
id="path50-67-9-5-2-8-06-4"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 565.72084,211.42963 -6.46482,19.65557"
id="path50-67-9-5-2-8-06-8-3"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#c00000",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 577.06408,216.10443 570.59926,235.76"
id="path50-67-9-5-2-8-06-8-1"
/>
</g>
<g
id="g54"
style={{strokeWidth:"5",strokeDasharray:"none"}}
transform="translate(322.46791,74.987221)">
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 200.32605,189.24433 194.138,206.33062"
id="path50-67-9-5-2-8-06-8-6-8"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 213.50489,190.31709 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-6-6"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 226.78268,191.84985 -1.1364,19.47472"
id="path50-67-9-5-2-8-06-8-6"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 179.14959,199.6749 c 11.61516,-12.34817 11.61516,-12.34817 11.61516,-12.34817 v 0"
id="path54" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 161.738,190.78583 c 11.33706,-7.66367 11.33706,-7.66367 11.33706,-7.66367"
id="path55" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 149.95346,180.67462 c 14.33285,-9.6671 14.33285,-9.6671 14.33285,-9.6671"
id="path56" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 123.89074,166.53855 c 34.21631,-10.06382 34.21631,-10.06382 34.21631,-10.06382"
id="path57" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 118.5849,151.20053 c 37.65194,-9.21456 37.65194,-9.21456 37.65194,-9.21456"
id="path58" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 116.12015,135.78727 c 37.36211,-9.33225 37.36211,-9.33225 37.36211,-9.33225"
id="path59" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 110.84716,119.76002 c 36.91658,-6.83944 36.91658,-6.83944 36.91658,-6.83944"
id="path60" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 112.87111,104.22463 c 30.33311,-6.282894 30.33311,-6.282894 30.33311,-6.282894"
id="path61" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 126.59388,182.45272 c 14.08046,-1.78631 14.08046,-1.78631 14.08046,-1.78631"
id="path62" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 126.64221,193.1052 c 19.7963,2.11324 19.7963,2.11324 19.7963,2.11324"
id="path63" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 119.63969,201.10198 c 20.95644,8.01884 20.95644,8.01884 20.95644,8.01884"
id="path64" />
</g>
<g
id="g79"
style={{strokeWidth:"5",strokeDasharray:"none"}}
transform="translate(322.46791,74.987221)">
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 86.076469,503.6186 c 9.885466,10.34489 9.885466,10.34489 9.885466,10.34489"
id="path79" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 150.29978,457.9044 c 1.94243,17.866 1.94243,17.866 1.94243,17.866"
id="path74" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 199.2849,489.09253 c -20.16296,6.25573 -20.16296,6.25573 -20.16296,6.25573"
id="path65" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 185.64643,507.21289 18.91069,-8.1251"
id="path66"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 200.0694,535.32029 18.44174,-11.22353"
id="path68"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 190.37277,468.63475 c 12.03608,11.65686 12.03608,11.65686 12.03608,11.65686"
id="path70" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 188.01452,520.60665 c 21.95551,-7.77626 21.95551,-7.77626 21.95551,-7.77626"
id="path67" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 203.99285,458.45369 c 6.02382,12.65907 6.02382,12.65907 6.02382,12.65907"
id="path71" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 168.04028,459.88507 c -3.73958,14.91825 -3.73958,14.91825 -3.73958,14.91825"
id="path73" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 182.07736,468.94115 -7.11607,8.94229"
id="path72"
/>
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 134.38215,466.70236 c 7.96216,12.33763 7.96216,12.33763 7.96216,12.33763"
id="path75" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 108.9415,485.68453 c 14.93848,11.89975 14.93848,11.89975 14.93848,11.89975"
id="path77" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 98.897373,494.73002 c 10.788387,11.81565 10.788387,11.81565 10.788387,11.81565"
id="path78" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 122.44948,475.68997 c 11.33981,11.93991 11.33981,11.93991 11.33981,11.93991"
id="path76" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 207.51348,546.72794 c 19.76534,16.49536 19.76534,16.49536 19.76534,16.49536"
id="path81" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 247.86735,540.24219 C 235.79684,564.1611 235.79684,564.1611 235.79684,564.1611"
id="path83" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 266.3738,550.27267 c -29.53463,15.7483 -29.53463,15.7483 -29.53463,15.7483"
id="path84" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 225.20263,534.7905 c 8.21137,24.89252 8.21137,24.89252 8.21137,24.89252"
id="path82" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 271.08848,579.89367 C 234.82807,566.55482 234.82807,566.55482 234.82807,566.55482"
id="path85" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 251.84773,592.74616 C 235.2896,565.15588 235.2896,565.15588 235.2896,565.15588"
id="path86" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 224.96356,598.05855 C 235.33244,563.7431 235.33244,563.7431 235.33244,563.7431"
id="path87" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"#f57d22",strokeWidth:"5",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 204.57799,585.58498 c 28.48643,-20.19452 28.48643,-20.19452 28.48643,-20.19452 l -29.95461,2.05101"
id="path88" />
</g>
<circle
style={{display:"inline",fill:"#881276",fillOpacity:"1",stroke:"none",strokeWidth:"9.82677",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="path6"
cx="557.70325"
cy="641.6452"
r="9" />
<path
style={{fill:"none",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 525.09492,662.08075 C 375.66161,714.42751 375.66161,714.42751 375.66161,714.42751"
id="path89" />
<ScrollLinkWithChild targetId="riboswitch">
<text
style={{fontStyle:"normal",fontVariant:"normal",fontWeight:"normal",fontStretch:"normal",fontSize:"15.6654px",fontFamily:"Arial",whiteSpace:"pre",inlineSize:"123.911",fill:"none",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"0.326363",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
x="24.838236"
y="650.23364"
id="ribotext"
transform="matrix(3.0526697,0,0,3.0755132,187.95508,-1243.9539)"><tspan
x="24.838236"
y="650.23364"
id="ribotext"><tspan
style={{fill:"var(--offblack)"}}
id="ribotext">Riboswitch</tspan></tspan></text>
</ScrollLinkWithChild>
<path
style={{fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 714.57654,286.73782 C 603.08853,373.95263 603.08853,373.95263 603.08853,373.95263"
id="path90" />
<path
style={{fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 1103.7358,196.5664 C 1273.6985,45.590255 1273.6985,45.590255 1273.6985,45.590255"
id="path91" />
<path
style={{fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 1379.6899,405.17969 c 155.4063,-8.16843 155.4063,-8.16843 155.4063,-8.16843"
id="path92" />
<path
style={{fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 1047.3061,690.69055 c 108.107,155.37789 108.107,155.37789 108.107,155.37789"
id="path93" />
<path
style={{fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="m 440.96587,225.1945 c -203.4394,37.82614 -203.4394,37.82614 -203.4394,37.82614"
id="path94" />
<path
style={{fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"7",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
d="M 372.73265,118.88705 C 234.25926,81.796787 234.25926,81.796787 234.25926,81.796787"
id="path95" />
<text
style={{fontStyle:"normal",fontVariant:"normal",fontWeight:"normal",fontStretch:"normal",fontSize:"15.6654px",fontFamily:"Arial",whiteSpace:"pre",inlineSize:"123.911",display:"inline",fill:"none",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"0.326363",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
x="24.838236"
y="650.23364"
id="stemlooptext"
transform="matrix(3.0526697,0,0,3.0755132,-77.470116,-1718.9553)"><tspan
x="24.838236"
y="650.23364"
id="stemlooptext"><tspan
style={{fill:"var(--offblack)"}}
id="stemlooptext">Stem Loop</tspan></tspan></text>
<a onClick={() => goToPagesAndOpenTab('InvWesthoff', '/engineering?tab=')}>
<text
style={{fontStyle:"normal",fontVariant:"normal",fontWeight:"normal",fontStretch:"normal",fontSize:"15.6654px",fontFamily:"Arial",whiteSpace:"pre",inlineSize:"123.911",display:"inline",fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"0.326363",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
x="24.838236"
y="650.23364"
id="rnabindingtext"
transform="matrix(3.0526697,0,0,3.0755132,-33.649696,-1947.0708)"><tspan
x="24.838236"
y="650.23364"
id="tspan7">RNA binding </tspan><tspan
x="24.838236"
y="669.81539"
id="tspan8">protein</tspan></text>
</a>
{/* pegRNA Text */}
<a onClick={() => goToPagesAndOpenTab('tab-pegrna', '/engineering?tab=')}>
<text
style={{fontStyle:"normal",fontVariant:"normal",fontWeight:"normal",fontStretch:"normal",fontSize:"15.6654px",fontFamily:"Arial", whiteSpace:"pre",inlineSize:"123.911",display:"inline",fill:"none",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"0.326363",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
x="24.838236"
y="650.23364"
id="pegrnatext"
transform="matrix(3.0526697,0,0,3.0755132,327.1556,-1588.33)"><tspan
x="24.838236"
y="650.23364"
id="pegrnatext"><tspan
style={{fill:"var(--offblack)"}}
id="pegrnatext">pegRNA</tspan></tspan></text>
</a>
<g
id="g1"
transform="translate(845.89947,114.11378)">
<a onClick={() => goToPagesAndOpenTab('tab-nikase', '/engineering?tab=')}>
<text
style={{fontStyle:"normal",fontVariant:"normal",fontWeight:"normal",fontStretch:"normal",fontSize:"15.6654px",fontFamily:"Arial",whiteSpace:"pre",inlineSize:"123.911",display:"inline",fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:0.326363,strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
x="24.838236"
y="650.23364"
id="nikasetext"
transform="matrix(3.0526697,0,0,3.0755132,225.24024,-1220.7538)"><tspan
x="24.838236"
y="650.23364"
id="tspan11">Nikase</tspan></text>
</a>
</g>
<text
style={{fontStyle:"normal",fontVariant:"normal",fontWeight:"normal",fontStretch:"normal",fontSize:"15.6654px",fontFamily:"Arial",whiteSpace:"pre",inlineSize:"123.911",display:"inline",fill:"var(--offblack)",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:0.326363,strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
x="24.838236"
y="650.23364"
id="linkertext"
transform="matrix(3.0526697,0,0,3.0755132,1473.3113,-1593.3056)"><tspan
x="24.838236"
y="650.23364"
id="tspan12">Linker</tspan></text>
<text
style={{fontStyle:"normal",fontVariant:"normal",fontWeight:"normal",fontStretch:"normal",fontSize:"15.6654px",fontFamily:"Arial",whiteSpace:"pre",inlineSize:"123.911",display:"inline",fill:"none",fillOpacity:"1",stroke:"var(--offblack)",strokeWidth:"0.326363",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
x="24.838236"
y="650.23364"
id="text89-49"
transform="matrix(3.0526697,0,0,3.0755132,1199.0298,-1957.216)"><tspan
x="24.838236"
y="650.23364"
id="PEtext"><tspan
style={{fill:"var(--offblack)"}}
id="PEtext">PE</tspan><tspan
style={{fontSize:"65%",baselineShift:"super"}}
id="PEtextlow">CO</tspan><tspan
style={{fill:"var(--offblack)"}}
id="PEtext">-Mini RT</tspan></tspan></text>
</svg>
</>
)
}
export function EngineeringCycle(){
return(
<svg
width="70%"
height="70%"
viewBox="0 0 133 133"
id="svg25"
xmlns="http://www.w3.org/2000/svg">
<defs
id="defs1">
</defs>
<g
id="Layer_2"
data-name="Layer 2"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<g
id="Plasmid"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<g
id="g25"
transform="translate(7.500978,3.0504898)">
<path
className="cls-7"
d="m 42.05,115.59 c 27.77,9.19 57.83,-4.79 69.76,-32.23"
id="path22"
style={{stroke:"#f4cc1e",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}} />
</g>
<g
id="g26"
transform="translate(8.0019699,2.8418223)"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<polygon
className="cls-13"
points="112.07,83.36 110.94,76.27 117.65,78.84 "
id="polygon25"
style={{fill:"#850f78",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(2.9806259,0,0,2.9806259,-225.43722,-156.45123)" />
<path
className="cls-12"
d="M 114,78.55 C 123.45,50.86 110,20.75 82.66,8.6"
id="path25"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#850f78",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text31"
transform="translate(5.6902194,-0.11551883)"><textPath
xlinkHref="#path25"
id="textPath33">Learn<tspan
id="tspan31" /></textPath></text>
</g>
<g
id="g27"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(8.0019699,2.8418223)">
<polygon
className="cls-10"
points="62.53,7.12 63.47,0 69.17,4.37 "
id="polygon23"
transform="matrix(2.7712263,0.58147548,-0.58147548,2.7712263,-96.587828,-39.748071)"
style={{fill:"#a0a7f3",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
inkscape:transform-center-x="3.6173751"
inkscape:transform-center-y="5.1978852" />
<path
className="cls-9"
d="M 78.599111,7.5468264 C 43.820346,-2.6177588 13.956746,14.286046 4.2106281,46.368749"
id="path23"
style={{stroke:"#a0a7f3",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"6",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text28"
transform="translate(-0.03023506,-5.9602336)"><textPath
xlinkHref="#path23"
id="textPath28">Test</textPath></text>
</g>
<g
id="g28"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(8.0019699,2.8418223)">
<polygon
className="cls-13"
points="117.65,78.84 112.07,83.36 110.94,76.27 "
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)" />
<path
className="cls-11"
d="M 2.6659753,50.953505 C -2.0956694,72.727915 10.936866,102.94273 36.656234,113.62834"
id="path24"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#f57d22",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text32"
transform="translate(-5.7110315,1.7453243)"><textPath
xlinkHref="#path24"
id="textPath32">Build<tspan
id="tspan32" /></textPath></text>
</g>
<polygon
className="cls-8"
points="37.22,113.74 44.3,112.56 41.78,119.28 "
id="polygon22"
style={{strokeWidth:"6",strokeDasharray:"none",fill:"#f4cc1e",fillOpacity:"1"}}
transform="matrix(2.8248588,0,0,2.8248588,-67.797781,-207.96977)" />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text29"
transform="translate(8.4052921,8.8553334)"><textPath
xlinkHref="#path22"
id="textPath34">Design<tspan
id="tspan29" /></textPath></text>
</g>
</g>
</svg>
)
}
export function EngineeringCycleZwei(){
return(
<svg
viewBox="0 0 15851.014 15529.118"
version="1.1"
id="svg25"
width="15851.014"
height="15529.118"
xmlns="http://www.w3.org/2000/svg">
<defs
id="defs1">
</defs>
<g
id="g25"
transform="translate(951.4934,342.3641)"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<path
className="cls-7"
d="m 42.05,115.59 c 27.77,9.19 57.83,-4.79 69.76,-32.23"
id="path22"
style={{stroke:"#f4cc1e",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}}
/>
</g>
<g
id="g26"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(951.99439,342.15543)">
<polygon
className="cls-13"
points="112.07,83.36 110.94,76.27 117.65,78.84 "
id="polygon25"
style={{fill:"#850f78",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(2.9806259,0,0,2.9806259,-225.43722,-156.45123)" />
<path
className="cls-12"
d="M 114,78.55 C 123.45,50.86 110,20.75 82.66,8.6"
id="path25"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#850f78",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text31"
transform="translate(5.6902194,-0.11551883)"><textPath
id="textPath33">Learn<tspan
id="tspan31" /></textPath></text>
</g>
<g
id="g27"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(951.99439,342.15543)">
<polygon
className="cls-10"
points="62.53,7.12 63.47,0 69.17,4.37 "
id="polygon23"
transform="matrix(2.7712263,0.58147548,-0.58147548,2.7712263,-96.587828,-39.748071)"
style={{fill:"#a0a7f3",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
inkscape:transform-center-x="3.6173751"
inkscape:transform-center-y="5.1978852" />
<path
className="cls-9"
d="M 78.599111,7.5468264 C 43.820346,-2.6177588 13.956746,14.286046 4.2106281,46.368749"
id="path23"
style={{stroke:"#a0a7f3",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"6",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text28"
transform="translate(-0.03023506,-5.9602336)"><textPath
id="textPath28">Test</textPath></text>
</g>
<g
id="g28"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(951.99439,342.15543)">
<polygon
className="cls-13"
points="117.65,78.84 112.07,83.36 110.94,76.27 "
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)" />
<path
className="cls-11"
d="M 2.6659753,50.953505 C -2.0956694,72.727915 10.936866,102.94273 36.656234,113.62834"
id="path24"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#f57d22",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text32"
transform="translate(-5.7110315,1.7453243)"><textPath
id="textPath32">Build<tspan
id="tspan32" /></textPath></text>
</g>
<polygon
className="cls-8"
points="37.22,113.74 44.3,112.56 41.78,119.28 "
id="polygon22"
style={{strokeWidth:"6",strokeDasharray:"none",fill:"#f4cc1e",fillOpacity:"1"}}
transform="matrix(2.8248588,0,0,2.8248588,876.19464,131.34384)" />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"var(--offblack)",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text29"
transform="translate(952.39772,348.16894)"><textPath
id="textPath34">Design<tspan
id="tspan29" /></textPath></text>
</svg>
)
}
\ No newline at end of file
src/components/Table.tsx 0 → 100644
View file @ 3fd292fd
import { Part } from "../data/parts";
import { Res } from "../data/results-table";
export function PartTable({data, cols}: {data: Array<Part>, cols: Array<string>}){
let list: JSX.Element[] = [];
for (let index = 0; index < data.length; index++) {
list.push(
<tr>
<td>{data[index].partname}</td>
<td><a href={data[index].url}>{data[index].registrycode}</a></td>
<td>{data[index].description}</td>
<td>{data[index].length}</td>
<td>{data[index].type}</td>
</tr>
)
}
let heads: JSX.Element[] = [];
for (let index = 0; index < cols.length; index++) {
heads.push(<td><b>{cols[index]}</b></td>)
}
return(
<div className="flex flex-col">
<div className="min-w-full overflow-x-auto">
<div className="inline-block min-w-full">
<div className="overflow-hidden p-2">
<table className="text-center parttable">
<thead className="bg-d">
<tr>
{heads}
</tr>
</thead>
<tbody>
{list}
</tbody>
</table>
</div>
</div>
</div>
</div>
)
}
export function ResTable({data, cols}: {data: Array<Res>, cols: Array<string>}){
let list: JSX.Element[] = [];
for (let index = 0; index < data.length; index++) {
list.push(
<tr>
<td>{data[index].nr}</td>
<td>{data[index].silent}</td>
<td>{data[index].pbs}</td>
<td>{data[index].rtt}</td>
<td>{data[index].q1}</td>
</tr>
)
}
let heads: JSX.Element[] = [];
for (let index = 0; index < cols.length; index++) {
heads.push(<td><b>{cols[index]}</b></td>)
}
return(
<div className="flex flex-col">
<div className="min-w-full overflow-x-auto">
<div className="inline-block min-w-full">
<div className="overflow-hidden p-2">
<table className="text-center restable">
<thead className="bg-d">
<tr>
{heads}
</tr>
</thead>
<tbody>
{list}
</tbody>
</table>
</div>
</div>
</div>
</div>
)
}
\ No newline at end of file
src/components/Tabs.tsx
View file @ 3fd292fd
// The main tab has to be given display: block; via id css or be given the id "First"
export function ButtonRowTabs({data, cla}: {data: Array<TabDatensatz>, cla: string}) {
let rows = []
let rows: JSX.Element[] = []
for ( let i = 0; i < data.length; i++ ){
rows.push(
<div id={data[i].cssname} className={cla}>
{data[i].node}
</div>
)
if(data[i].main == true){
rows.push(<div id={data[i].cssname} className={cla} style={{display: "block"}}>
{data[i].node}
</div>)
}
else{
rows.push(<div id={data[i].cssname} className={cla} style={{display: "none"}}>
{data[i].node}
</div>)
}
}
return rows;
}
import React from "react";
import { BlockQuoteB } from "./Quotes";
import { TimelineDatenpunkt } from "../data/hptimelinedata";
import Collapsible from "./Collapsible";
import { stringToSlug } from "../utils";
/* import { stringToSlug } from "../utils"; */
export function BFHStyleTabs({data, cla}: {data: Array<TimelineDatenpunkt>, cla: string}) {
let rows: JSX.Element[] = []
for ( let i = 0; i < data.length; i++ ){
var problem: Boolean = false;
var problem_desc: Array<string> = [];
/* Language */
var lang;
if(data[i].language === "en"){
lang = "Original language: English"
}
else if(data[i].language === "de"){
lang = "Original language: German"
}
else{
lang = ""
}
/* else if(data[i].type != "meta"){
problem = true;
problem_desc.push("interview language");
} */
/* Expert on */
let expert = "";
if (data[i].experton) {
expert = `Expert on ${data[i].experton}`;
}
/* Aim/Goal */
var goalheading: string = "";
if(data[i].type === "meta"){
goalheading = "Goals";
}
else{
goalheading = "Aim of contact"
}
/* Quotation */
var quoted: string = "";
if(data[i].quote != ""){
if(data[i].quoteNachname && data[i].quoteVorname){
quoted = data[i].quoteVorname + " " + data[i].quoteNachname;
}
else{
quoted = data[i].vorname + " " + data[i].nachnname;
}
}
/* else{
problem = true;
problem_desc.push("quote missing");
} */
let inv_img: React.ReactNode = <></>;
let imp_img: React.ReactNode = <></>;
let aim_img: React.ReactNode = <></>;
// Restliche Logik der Schleife...
// Bildzuweisungen basierend auf den Daten
if (data[i].pictureurl_interview) {
inv_img = <div className="hti-box">
<img src={data[i].pictureurl_interview} className="hp-timeline-img hti-right" />
</div>;
}
if (data[i].pictureurl_implementation) {
imp_img = <div className="hti-box">
<img src={data[i].pictureurl_implementation} className="hp-timeline-img hti-left" />
</div>;
}
if (data[i].pictureurl_aim) {
aim_img = <div className="hti-box">
<img src={data[i].pictureurl_aim} className="hp-timeline-img hti-left" />
</div>;
}
/* textparts */
let aiM: JSX.Element = <></>
if(data[i].aimofcontact){
aiM = <>
<h4>{goalheading}</h4>
<div className="flexbox">
<p className="hp-timeline-p">{data[i].aimofcontact}</p>
{aim_img}
</div>
</>
}
let insighT: JSX.Element = <></>
if(data[i].insights){
insighT = <>
<h4>Insights</h4>
<div className="flexbox">
{inv_img}
<p className="hp-timeline-p">{data[i].insights}</p>
</div>
</>
}
let imP: JSX.Element = <></>
if(data[i].implementation){
imP = <>
<h4>Implementation</h4>
<div className="flexbox">
<p className="hp-timeline-p">{data[i].implementation}</p>
{imp_img}
</div>
</>
}
/* if(data[i].aimofcontact === ""){
problem = true;
problem_desc.push(" " + goalheading + " missing");
}
if(data[i].insights === ""){
problem = true;
problem_desc.push(" insights missing");
}
if(data[i].implementation === ""){
problem = true;
problem_desc.push(" implementation missing");
} */
/* Clarification */
var clari: React.ReactNode = <></>
if(data[i].clarification){
clari = <>
<h4>Clarification</h4>
<p>{data[i].clarification}</p>
</>
}
/* Other warnings */
if(data[i].interviewtabid === ""){
problem = true;
problem_desc.push(" interviewtabid missing");
}
/* if(data[i].cardtext === ""){
problem = true;
problem_desc.push(" cardtext missing");
} */
/* if(data[i].type !== "meta"){
if(data[i].affiliation === undefined || data[i].affiliation === ""){
problem = true;
problem_desc.push(" affiliation missing");
}
if(data[i].job === undefined || data[i].job === ""){
problem = true;
problem_desc.push(" job missing" );
}
} */
/* if(data[i].type === "meta"){
if(data[i].quoteVorname === undefined || data[i].quoteVorname === ""){
problem = true;
problem_desc.push(" who is the quote from?" );
}
} */
/* References */
var refs: React.ReactNode = <></>;
if (data[i].references) {
refs = <> <h4>References </h4> {data[i].references}</>
}
/* Further pictures */
/* var inv_img: React.ReactNode = <></>;
if (data[i].pictureurl_interview) {
console.info("before: inv_img is: " + inv_img)
console.info(data[i].vorname + " has pictureurl_interview")
inv_img = <> <div className="hti-box"> <img id={`${data[i].vorname}-inv-img`} src={data[i].pictureurl_interview} className="hp-timeline-img hti-right"/> </div> <div className="hti-abstand"/> </>
console.info("after: inv_img is: " + inv_img)
}
var imp_img: React.ReactNode = <></>;
if (data[i].pictureurl_implementation) {
console.info(data[i].vorname + " has pictureurl_implementation")
console.info("before: imp_img is: " )
console.info(imp_img)
imp_img = <> <div className="hti-abstand"/><div className="hti-box">
<img id={`${data[i].vorname}-imp-img`} src={data[i].pictureurl_implementation} className="hp-timeline-img hti-right"/>
</div>
</>
console.info("after: imp_img is: " )
console.info(imp_img)
}
var aim_img: React.ReactNode = <></>;
if (data[i].pictureurl_aim) {
console.info(data[i].vorname + " has pictureurl_aim")
console.info("before: aim_img is: " )
console.info(aim_img)
aim_img = <> <div className="hti-abstand"/> <div className="hti-box">
<img id={`${data[i].vorname}-aim-img`} src={data[i].pictureurl_aim} className="hp-timeline-img hti-left"/>
</div></>
console.info("after: aim_img is: " )
console.info(aim_img)
} */
let int = <></>;
let int_id = stringToSlug(`${data[i].vorname}-inv-collapsible`)
if (data[i].interview) {
int = <div className="hp-collaps"><Collapsible title="Read full Interview here" id={int_id}>
{data[i].interview}
</Collapsible></div>
}
let morepics: JSX.Element[] = [];
let oldpics: string[] = [];
/* if(data[i].more_pictures){ */
if (!data[i].aimofcontact && data[i].pictureurl_aim) {
oldpics.push(data[i].pictureurl_aim!)
}
if (!data[i].insights && data[i].pictureurl_interview) {
oldpics.push(data[i].pictureurl_interview!)
}
if (!data[i].implementation && data[i].pictureurl_implementation) {
oldpics.push(data[i].pictureurl_implementation!)
}
let newlist = oldpics.concat(data[i].more_pictures!);
for (let ind = 0; ind < (newlist.length - 1); ind += 2) {
console.info(data[i].vorname)
console.info(ind + newlist[ind])
console.info(ind+1 + newlist[ind+1])
morepics.push(
<div className="row">
<div className="col">
<img src={newlist[ind]}/>
</div>
<div className="col">
<img src={newlist[ind+1]}/>
</div>
</div>
)
}
/* } */
let node = <>
<br/>
<h3 id={`${data[i].interviewtabid}-heading`}>{data[i].title} {data[i].vorname} {data[i].nachnname}</h3>
<hr/>
<div className="row">
<div className="col-6">
<div className={"t-tag " + data[i].tag}>
{data[i].job} - {data[i].affiliation}
</div>
</div>
<div className="col" style={{padding: "5px"}}>{expert}</div>
<div className="col" style={{width: "20%", flex: "1 0 0%", padding: "5px"}}>{lang}</div>
</div>
<div className="row align-items-stretch">
<div className="col d-flex flex-column">
<div className="row flex-grow-1 mitte">
<h4 style={{paddingTop: "50px"}}>Summary:</h4>
<p>{data[i].summary}</p>
</div>
<div className="row unten" style={{fontSize: "large"}}>
</div>
</div>
<div className="col-3">
<img className="middle sechpro img-fluid" src={data[i].pictureurl} />
</div>
</div>
{/* <div className="row">
<div className="col">
<p style={{paddingTop: "50px", fontSize: "large"}}>Summary:</p>
<p>{data[i].summary}</p>
</div>
<div className="col-3">
<img className="middle sechpro" src={data[i].pictureurl}/>
</div>
</div> */}
{aiM}
{insighT}
{clari}
{imP}
<div className="col">
<BlockQuoteB text={data[i].quote!} cite={quoted}></BlockQuoteB>
</div>
{data[i].text}
{morepics}
{int}
{refs}
</>
if(problem){
rows.push(
<div id={data[i].interviewtabid} className={cla} style={{ backgroundColor: "black", color: "white"}}>
<h1>PROBLEM with {data[i].vorname} {data[i].nachnname}</h1>
<p> because of: </p>
{problem_desc}
</div>
)
}
else{
if (data[i].interviewtabid === "timeline"){
rows.push(
<div id={data[i].interviewtabid} className={`${cla} timelinetab bg-db`} style={{display: "block"}}>
{node}
</div>
)
}
else{
rows.push(
<div id={data[i].interviewtabid} className={`${cla} timelinetab bg-db`}>
{node}
</div>
)
}
}
}
return rows;
}
export function BFHStyleTabs({data, cla}: {data: Array<NodeDatensatz>, cla: string}) {
let rows = []
/* Interview */
export function OLDBFHStyleTabs({data, cla}: {data: Array<NodeDatensatz>, cla: string}) {
let rows: JSX.Element[] = []
for ( let i = 0; i < data.length; i++ ){
if (data[i].cssname === "timeline"){
if (data[i].cssname == "timeline"){
rows.push(
<div id={data[i].cssname} className={cla} style={{display: "block"}}>
{data[i].node}
......@@ -29,4 +364,4 @@ export function ButtonRowTabs({data, cla}: {data: Array<TabDatensatz>, cla: stri
}
}
return rows;
}
\ No newline at end of file
}
src/components/Testsvganimation.tsx 0 → 100644
View file @ 3fd292fd
import gsap from "gsap";
import { useGSAP } from "@gsap/react";
import { ScrollTrigger } from "gsap/dist/ScrollTrigger";
import { useRef } from 'react';
import { MotionPathPlugin } from "gsap/dist/MotionPathPlugin";
import { LoremMedium } from "./Loremipsum";
import { H2 } from "./Headings";
function TestSVG() {
gsap.registerPlugin(useGSAP);
gsap.registerPlugin(MotionPathPlugin);
gsap.registerPlugin(ScrollTrigger);
console.log("Started TestSVG")
const vectorRef = useRef(null);
const payloadRef = useRef(null);
const inhalatorRef = useRef(null);
useGSAP(
() => {
gsap.registerPlugin(ScrollTrigger);
gsap.registerPlugin(useGSAP);
gsap.registerPlugin(MotionPathPlugin);
gsap.defaults({ease: "none"});
const main = gsap.timeline({
scrollTrigger: {
trigger: "svg",
scrub: true,
start:"top middle",
end: "bottom middle"
}
})
.from(".theLine", {drawSVG: 0}, 0)
.to(payloadRef.current, {motionPath:{
path:".theLine",
align:".theLine",
alignOrigin:[0.5, 0.5],
}}, 0)
.from(".theLine2", {drawSVG: 0}, 0)
.to(vectorRef.current, {motionPath:{
path:".theLine2",
align:".theLine2",
alignOrigin:[0.5, 0.5],
}}, 0).from(".theLine3", {drawSVG: 0}, 0)
.to(inhalatorRef.current, {motionPath:{
path:".theLine3",
align:".theLine3",
alignOrigin:[0.5, 0.5],
}}, 0)
console.log(main)
},
);
return (
<div className="row col">
<svg id="svg" viewBox="0 0 1500 1000">
{/*
<path className="theLine" d="S 50"
stroke="white" strokeWidth="10px"></path>
<path className="theLine2" d="M 300 50 S 50 200"
stroke="white" strokeWidth="10px" width="10px"></path>
*/}
<foreignObject x="5vw" y="5vh" className="box1">
<H2 id="mutcans" text="Mutation canidates"/>
<p >
<LoremMedium></LoremMedium>
</p>
</foreignObject>
<foreignObject className="box2">
<H2 id="mutcans2" text="Mutation canidates"/>
<p>
<LoremMedium></LoremMedium>
</p>
</foreignObject>
{/* <path className="theLine3" d="M 300"
stroke="white" strokeWidth="10px"></path> */}
</svg>
{/* </svg> */}
{/* <text ref={vectorRef}>H</text>
<text ref={payloadRef}>B</text> */}
{/* <img ref={vectorRef} src="https://static.igem.wiki/teams/5247/scientific-figures/antibiotics-capsule.svg" alt="vectorImg"/>
*/}{/* <img ref={payloadRef} src="https://static.igem.wiki/teams/5247/scientific-figures/antibiotics-inhaler.svg" alt="payloadImg"/>
*/}
{/* <img className="test2" ref={inhalatorRef} src="https://static.igem.wiki/teams/5247/scientific-figures/antibiotics-capsule.svg" alt="vectorImg" />
*/} </div>
);
}
export default TestSVG;
src/components/TextEvent.tsx deleted 100644 → 0
View file @ e8830b3c
import React from 'react';
import Event from './Event';
import { joinClassNames } from './classNames';
export function TextAtom({ text }:{text:string}) {
return (
<div className="text-atom">
{text}
</div>
);
}
interface TextEventProps {
children?: React.ReactNode;
date: string;
text: string;
marker?: React.ReactNode;
id?: string;
card?: Function;
}
/**
* Use `TextEvent` to render text (including markdown) as an event.
*/
export const TextEvent = ({ children, date, text, marker, card}: TextEventProps) => {
return (
<Event
date={date}
marker={marker}
card={card}
className={joinClassNames({classNames: ['text-event']})}
text={text}
layout='default'
>
<TextAtom text={text} />
{children}
</Event>
);
}
export default TextEvent;
\ No newline at end of file
src/components/VerticalTimeline.tsx 0 → 100644
View file @ 3fd292fd
import { BFHMoreButton } from "./Buttons";
interface ItemProps {
text?: string;
heading?: string;
vorname?: string,
vorname2?: string,
nachname?: string,
nachname2?: string,
date: string ,
children: React.ReactNode;
tag: string,
color: string,
csstag: string,
url: string,
url2?: string
}
interface NoButtItemProps {
text?: string;
heading?: string;
vorname?: string,
vorname2?: string,
nachname?: string,
nachname2?: string,
date: string ,
children: React.ReactNode;
tag: string,
color: string,
url: string,
url2?: string
}
export const TimelineItemPic = ({ heading, text, vorname, nachname, date, tag, color, children, csstag, url }:ItemProps) => (
<div className="timeline-item">
<div className="timeline-item-content">
<span className="tag" style={{ background: color }}>
{tag}
</span>
<time>{date}</time>
<hr/>
<div className="row">
<div className="col">
<figure className="snip1113 red">
<img src={url} alt={nachname} />
<figcaption>
<h3>{vorname} <br/> <span>{nachname}</span></h3>
</figcaption>
</figure>
</div>
<div className="col text-1-bfh">
<h5>{heading}</h5>
<span className="">{text}</span>
</div>
{children}
</div>
<BFHMoreButton it={csstag}></BFHMoreButton>
<span className="circle" />
</div>
</div>
);
export const TimelineItemTwoPic = ({ url, url2, heading, text, vorname, nachname, vorname2, nachname2, date, tag, color, children, csstag }:ItemProps) => (
<div className="timeline-item">
<div className="timeline-item-content">
<span className="tag" style={{ background: color }}>
{tag}
</span>
<time>{date}</time>
<hr/>
<div className="row">
<div className="col">
<figure className="snip1113 red">
<img src={url} alt={nachname} />
<figcaption>
<h3>{vorname} <br/> <span>{nachname}</span></h3>
</figcaption>
</figure>
</div>
<div className="col">
<figure className="snip1113 red">
<img src={url2} alt={nachname2} />
<figcaption>
<h3>{vorname2} <br/> <span>{nachname2}</span></h3>
</figcaption>
</figure>
</div>
<div className="col text-1-bfh">
<h5>{heading}</h5>
<span className="">{text}</span>
</div>
{children}
</div>
<BFHMoreButton it={csstag}></BFHMoreButton>
<span className="circle" />
</div>
</div>
);
export const TimelineItem = ({ date, tag, color, children, csstag }:ItemProps) => (
<div className="timeline-item">
<div className="timeline-item-content">
<span className="tag" style={{ background: color }}>
{tag}
</span>
<time>{date}</time>
<hr/>
{children}
<BFHMoreButton it={csstag}></BFHMoreButton>
<span className="circle" />
</div>
</div>
);
export const NoButtTimelineItem = ({ date, tag, color, children }:NoButtItemProps) => (
<div className="timeline-item">
<div className="timeline-item-content">
<span className="tag" style={{ background: color }}>
{tag}
</span>
<time>{date}</time>
<hr/>
{children}
<span className="circle" />
</div>
</div>
);
export const PanelTimelineItem = () => (
<div className="timeline-item">
<div className="timeline-item-content">
<span className="tag" style={{ background: "var(--lightblue)" }}>
Talks
</span>
<time>Panel Discussion</time>
<div className="row align-items-center panel-talk-gallery">
<div className="col">
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/traci.jpg" alt="pr-sample1" />
<div className="small middle">Taci <br/> Haddock</div>
</div>
<div className="col">
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/anita-sifuantes.png" alt="pr-sample1" />
<div className="small middle">Ana <br/> Sifuentes</div>
</div>
<div className="col">
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/olivia.png" alt="pr-sample1" />
<div className="small middle">Olivia <br/> Mozolewska</div>
</div>
<div className="col">
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/middendorf.jpeg" alt="pr-sample1" />
<div className="small middle">Lasse <br/> Middendorf</div>
</div>
<div className="col">
<img className="img-round-panel" src="https://static.igem.wiki/teams/5247/photos/meetup/speakers/nemanja.jpg" alt="pr-sample1" />
<div className="small middle">Nemanja <br/> Stijepovic</div>
</div>
</div>
<hr/>
<span>Panel Discussion</span>
<div id="panel" style={{display: "none"}}>
<p>During the panel discussion, participants shared their experiences with iGEM and synthetic biology. Leslie, an advisor for the University of Windsor's team, detailed her transition from team member to advisor and her recent involvement in synthetic biology organizations. Anna, a former iGEM participant, spoke about her background in design and her current role as a senior content strategist at Freelitics, emphasizing her passion for science communication. Tracy recounted her extensive journey within iGEM, starting as a team leader at Boston University and eventually becoming the director of the competition at iGEM headquarters. After transitioning to Asimov, she highlighted her efforts to strengthen partnerships between Asimov and iGEM, including manufacturing distribution kits for participating teams. The discussion showcased the diverse paths taken by individuals in the field and their ongoing commitment to advancing synthetic biology.</p>
</div>
<BFHMoreButton it="panel"></BFHMoreButton>
<span className="circle" />
</div>
</div>
);
src/components/data/stroke.svg deleted 100644 → 0
View file @ e8830b3c
<svg width="100" height="64" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#a)">
<path d="M-17 30.5C-1 22 72-4 54 13 37.9 28.2-2.5 57.5 16 55.5s72-29 104-40" stroke="#850F78" stroke-width="10"/>
</g>
<defs>
<clipPath id="a">
<path fill="#fff" d="M0 0h100v64H0z"/>
</clipPath>
</defs>
</svg>
src/components/headings.tsx deleted 100644 → 0
View file @ e8830b3c
export function Hhopp({text}:{text: string}){
const arr = [];
for (let i = 0; i < text.length; i++) {
const x = text.charAt(i);
arr.push(<span aria-hidden="true">{x}</span>)
}
return(
<h1 className="playful" aria-label="Wash your hands">
{arr}
</h1>
)
}
export function Hsmoke({text}:{text: string}){
const arr = [];
for (let i = 0; i < text.length; i++) {
const x = text.charAt(i);
arr.push(<span aria-hidden="true">{x}</span>)
}
return(
<h1 className="smoke" aria-label="Wash your hands">
{arr}
</h1>
)
}
export function H1({text}:{text: string}){
return(
<div className="row hone">
<svg width="100%" height="100%">
<text x="0%" y="60%">
{text}
</text>
</svg>
</div>
)
}
/* export function Hprompt({text}:{text: string}){
return(
<div>
<h2>{text}</h2>
<hr/>
</div>
)
} */
export function H2({text}:{text: string}){
return(
<div>
<h2>{text}</h2>
<hr/>
</div>
)
}
export function Hhighlight({children}:{children: React.ReactNode}){
return(
<div className="content v2">
{children}
</div>
)
}
export function Hspoiler({children}:{children: React.ReactNode}){
return(
<div className="content v3">
{children}
</div>
)
}
export function Hwave({text}:{text: string}){
return(
<svg viewBox="0 0 100 20">
<defs>
<linearGradient id="gradient" x1="0" x2="0" y1="0" y2="1">
<stop offset="5%" stop-color="#850F78"/>
<stop offset="95%" stop-color="#A0A7F3"/>
</linearGradient>
<pattern id="wave" x="0" y="0" width="120" height="20" patternUnits="userSpaceOnUse">
<path id="wavePath" d="M-40 9 Q-30 7 -20 9 T0 9 T20 9 T40 9 T60 9 T80 9 T100 9 T120 9 V20 H-40z" mask="url(#mask)" fill="url(#gradient)">
<animateTransform
attributeName="transform"
begin="0s"
dur="1.5s"
type="translate"
from="0,0"
to="40,0"
repeatCount="indefinite" />
</path>
</pattern>
</defs>
<text text-anchor="middle" x="50" y="15" font-size="17" fill="url(#wave)" fill-opacity="0.6">{text}</text>
<text text-anchor="middle" x="50" y="15" font-size="17" fill="url(#gradient)" fill-opacity="0.1">{text}</text>
</svg>
)
}
export function Hpopart({text}:{text: string}){
return(
<div className="relative">
<div className="absolute popart">
{text}
</div>
</div>
)
}
export function Hshadone({text}:{text: string}){
return(
<div>
<p className="stroke shadow-stroke">{text}</p>
</div>
)
}
export default H1;
\ No newline at end of file
src/components/interfaces.tsx 0 → 100644
View file @ 3fd292fd
export interface Ourlink{
path: string,
text: string,
scrollToId?: string,
tabId?: string,
subTabId?: string,
collapseId?: string,
tabincolId?: string
}
\ No newline at end of file
src/components/landingpage/ContentBlock.tsx 0 → 100644
View file @ 3fd292fd
import React from 'react';
export function ContentBlock({file}:{file: string}) {
const [isVisible, setVisible] = React.useState(false);
const domRef = React.useRef(null)!;
React.useEffect(() => {
const observer = new IntersectionObserver(entries => {
entries.forEach(entry => setVisible(entry.isIntersecting));
});
observer.observe(domRef.current!);
}, []);
return(
<div className={`content-block${isVisible ? 'is-visible' : ''}`}
ref={domRef}>
{
<img src={file}></img>
}
</div>
);
}
\ No newline at end of file
src/components/makeSources.tsx 0 → 100644
View file @ 3fd292fd
import React, { useState, useEffect } from "react";
import bibtexParse from 'bibtex-parser-js';
interface BibEntry {
ENTRYTYPE: string;
TITLE?: string;
AUTHOR?: string;
journal?: string;
volume?: string;
pages?: string;
year?: string;
doi?: string;
[key: string]: any;
}
interface BibtexParserProps {
bibtexSources: string[]; // Accept an array of BibTeX strings
special?: string,
start?: number
}
function formatPages(pages: string | undefined): JSX.Element | null {
// Check if pages is provided and is a non-empty string
if (pages && pages.length > 0) {
// Check for common page range separators
const pageRangeRegex = /--|-|–|–/; // RegEx to match various dash types
if (pageRangeRegex.test(pages)) {
const pag = pages.split(pageRangeRegex).map(p => p.trim());
const begin = pag[0];
const end = pag[1];
// Return formatted JSX
return (
<>
,&nbsp;<span property="schema:pageBegin">{begin}</span>-<span property="schema:pageEnd">{end}</span>
</>
);
} else if (/^\d+(-\d+)?$/.test(pages)) {
// If pages is a single numeric range, return it directly
return (
<>
,&nbsp;<span property="schema:pageBegin">{pages}</span>
</>
);
} else {
// Handle non-numeric page info
console.warn(`Non-numeric page information detected ('${pages}'). Treating as missing.`);
return null; // Return null if invalid
}
} else {
console.warn("Sorry, no page information.");
return null; // Return null if no page info
}
}
export const BibtexParser: React.FC<BibtexParserProps> = ({ bibtexSources , special, start}) => {
const [parsedEntries, setParsedEntries] = useState<BibEntry[]>([]);
// Parse BibTeX on component mount or when sources change
useEffect(() => {
//console.log("Parsing BibTeX sources: ", bibtexSources);
try {
const allEntries: BibEntry[] = [];
bibtexSources.forEach((bibtex) => {
// console.log(`Parsing BibTeX entry #${index + 1}: `, bibtex);
const parsed = bibtexParse.toJSON(bibtex);
// console.log(`Parsed entry: `, parsed);
allEntries.push(...parsed);
});
setParsedEntries(allEntries);
//console.log("All parsed entries: ", allEntries);
} catch (error) {
console.error("Error parsing BibTeX: ", error);
alert("An error occurred while parsing the BibTeX entries. Please check the format." + bibtexSources);
}
}, [bibtexSources]);
// Helper function to render AUTHORS
const formatAuthors = (authors: string): string => {
//console.log("Original input:", authors);
// Bereinigen des Eingabestrings und Ersetzen von "and" durch "|"
const cleanedAuthors = authors
.replace(/\s*and\s*/g, "|") // "and" durch "|" ersetzen
.replace(/\{|\}/g, "") // geschweifte Klammern entfernen
.trim();
//console.log("Cleaned authors string:", cleanedAuthors);
// Autoren in ein Array aufteilen
const authorList = cleanedAuthors.split("|").map(author => author.trim());
//console.log("Split author list:", authorList);
// Maximale Anzahl der anzuzeigenden Autoren
const maxAuthors = 7;
// Formatiere jeden Autor
const formattedAuthors = authorList.map((author, _index) => {
//console.log(`Processing author #${index + 1}:`, author);
// Nachname und Vornamen aufteilen
const [last, firstNames] = author.includes(",") ?
author.split(",").map(part => part.trim()) :
['', author]; // Wenn kein Komma vorhanden ist, wird der gesamte Name als Vorname behandelt
// console.log(`Last name: "${last}", First names: "${firstNames}"`);
// Initialen für Vornamen erstellen
const initials = firstNames.split(' ').map(n => n[0] + '.').join(' ');
//console.log(`Initials for "${firstNames}": "${initials}"`);
const formattedName = `${last}, ${initials}`.trim(); // Rückgabe des formatierten Namens
//console.log(`Formatted name: "${formattedName}"`);
return formattedName;
});
//console.log("Formatted authors before adding et al.:", formattedAuthors);
// Kombiniere die formatierten Autoren mit korrekter Interpunktion
const output = formattedAuthors.slice(0, maxAuthors).join('; ') +
(formattedAuthors.length > maxAuthors ? ' et al.' : '');
//console.log("Final output:", output);
return output;
};
let specialthing = "";
if (special) {
specialthing = `#${special}`;
}
// Helper function to render individual citations based on their type
const renderCitation = (entry: BibEntry, index: number) => {
// console.log(`Rendering citation for entry #${index + 1}: `, entry);
// Use the index as citation number
let citationNumber = index +1;
if(start){
citationNumber += start -1;
}
const entryType = entry.entryType.toLowerCase(); // Convert to lowercase for consistent comparison
const entryTags = entry.entryTags; // Adjust based on your data structure
// console.log("Entry Tags: ", entryTags);
switch (entryType) {
case "article":
return (
<li key={index} typeof="schema:ScholarlyArticle" role="doc-biblioentry" property="schema:citation" id={`desc-${citationNumber}${specialthing}`}>
{/* Citation number as comment */}
{/*<!-- Citation num ${citationNumber} --> */}
{formatAuthors(entryTags.AUTHOR || entryTags.EDITOR || "")}
&nbsp;<span property="schema:name">{entryTags.TITLE.replace(/[?!.]/g, '').replace(/\n/g, ' ').trim()}.</span>
&nbsp;<i property="schema:publisher" typeof="schema:Organization">{entryTags.JOURNAL}</i>
&nbsp;<b property="issueNumber" typeof="PublicationIssue">{entryTags.VOLUME}</b>
{formatPages(entryTags.PAGES) && <span>{formatPages(entryTags.PAGES)}</span>}
{entryTags.YEAR && (
<span>&nbsp;(<time property="schema:datePublished" datatype="xsd:gYear" dateTime={entryTags.YEAR}>{entryTags.YEAR}</time>).</span>
)}
{entryTags.DOI && (
<span>&nbsp;<a className="doi" href={`https://doi.org/${entryTags.DOI}`}>doi: {entryTags.DOI}</a></span>
)}
</li>
);
case "book":
return (
<li key={index} typeof="schema:Book" role="doc-biblioentry" property="schema:citation" id={`desc-${citationNumber}`}>
{/* Render authors */}
{formatAuthors(entryTags.AUTHOR || entryTags.EDITOR || "")}
{/* Render title or booktitle */}
{entryTags.TITLE ? (
<span property="schema:name">&nbsp;{entryTags.TITLE.replace(/[?!.]/g, '').replace(/\n/g, ' ').trim()}.</span>
) : entryTags.BOOKTITLE ? (
<span property="schema:name">&nbsp;{entryTags.BOOKTITLE.replace(/[?!.]/g, '').replace(/\n/g, ' ').trim()}.</span>
) : (
console.warn(`No title or booktitle found for entry ${citationNumber}`)
)}
{/* Render publisher */}
{entryTags.PUBLISHER && (
<i property="schema:publisher" typeof="schema:Organization">
&nbsp;{entryTags.PUBLISHER}
</i>
)}
{/* Render year */}
{entryTags.YEAR && (
<span>
&nbsp;(<time property="schema:datePublished" datatype="xsd:gYear" dateTime={entryTags.YEAR}>
{entryTags.YEAR}
</time>).
</span>
)}
{entryTags.ISBN && (
<span property="isbn">&nbsp;{entryTags.ISBN}</span>
)
}
</li>
);
case "misc":
return (
<li key={index} typeof="schema:WebPage" role="doc-biblioentry" property="schema:citation" id={`desc-${citationNumber}`}>
{/* Render authors */}
{(entryTags.AUTHOR || entryTags.EDITOR || "")}
{/* Render title */}
{entryTags.TITLE && (
<span property="schema:name">.&nbsp;{entryTags.TITLE.replace(/[?!.]/g, '').replace(/\n/g, ' ').trim()}.</span>
)}
{/* Render howpublished */}
{entryTags.HOWPUBLISHED && (
<i property="schema:publisher" typeof="schema:Organization">&nbsp;{entryTags.HOWPUBLISHED}</i>
)}
{/* Render year */}
{entryTags.YEAR && (
<span>&nbsp;(<time property="schema:datePublished" datatype="xsd:gYear" dateTime={entryTags.YEAR}>{entryTags.YEAR}</time>).</span>
)}
</li>
);
// Handle additional entry types here
case "inproceedings":
return (
<li key={index}>
<span>{formatAuthors(entryTags.AUTHOR || "")}</span>&nbsp;
<span>{entryTags.TITLE}</span>. In <i>{entryTags.BOOKTITLE}</i>,&nbsp;
<b>{entryTags.editor}</b>, {entryTags.YEAR}.
</li>
);
case "phdthesis":
return (
<li key={index}>
<span>{formatAuthors(entryTags.AUTHOR || "")}</span>&nbsp;
<span>{entryTags.TITLE}</span>, PhD thesis, {entryTags.SCHOOL}, {entryTags.YEAR}.
</li>
);
default:
console.warn(`Unknown entry type: ${entryType}`);
return <li key={index}>Unknown entry type: {entryType}</li>;
}
};
let startnumber = 1;
if(start) {
startnumber = start;
}
return (
<div>
{parsedEntries.length === 0 ? (
<p>No citations available.</p>
) : (
<ol start={startnumber}>
{parsedEntries.map((entry, index) => renderCitation(entry, index))}
</ol>
)}
</div>
);
};
export default BibtexParser;
src/components/mindmap/RouteManager.tsx 0 → 100644
View file @ 3fd292fd
src/components/pdfs.tsx deleted 100644 → 0
View file @ e8830b3c
import { DownloadLink } from "./Buttons"
export function PDF({link, name}: {link: string, name:string}){
return(
<div className='row align-items-center'>
<iframe src={link} width="100%" height="530vw" title="title" className='small-i'>
</iframe>
<div className='row download-col'>
<DownloadLink url={link} fileName={name} ></DownloadLink>
</div>
</div>
)
}
export default function BFHpdf(){
return(
<div className='row align-items-center'>
<div className='col'>
<PDF link='https://static.igem.wiki/teams/5247/pdfs/bfh-flyer-european-meetup.pdf' name="bfh-flyer-european-meetup.pdf"/>
</div>
<div className='col-2'>
</div>
<div className='col'>
<PDF link='https://static.igem.wiki/teams/5247/pdfs/bfh-meet-up-guideline.pdf' name="bfh-meet-up-guideline.pdf"/>
</div>
</div>
)
}
\ No newline at end of file
src/components/poster.tsx 0 → 100644
View file @ 3fd292fd
export function Poster({postername, url}:{postername: string, url: string}){
return(
<a typeof="button" onClick={reSize({name: postername})}>
<img id={postername} className="picture-frame norm" src={url} alt={postername} />
</a>
)
}
export function Certificate({postername, url}:{postername: string, url: string}){
return(
<div className="col">
<a typeof="button" onClick={reSize2({name: postername})}>
<img id={postername} className="cert-frame norm" src={url} alt={postername} />
</a>
</div>
)
}
function reSize({name}:{name: string}){
const resize = (_event : React.MouseEvent<HTMLElement, MouseEvent>) =>{
var img;
img = document.getElementById(name);
if (img!.className === "picture-frame norm"){
console.log("=== picture-frame norm")
img!.className = img!.className.replace("picture-frame norm", "full-screen-width");
}
else if (img!.className === "full-screen-width"){
console.log("=== full-screen-width")
img!.className = img!.className.replace("full-screen-width", "picture-frame norm");
}
}
return resize;
}
function reSize2({name}:{name: string}){
const resize = (_event : React.MouseEvent<HTMLElement, MouseEvent>) =>{
var img;
img = document.getElementById(name);
if (img!.className === "cert-frame norm"){
console.log("=== cert-frame norm")
img!.className = img!.className.replace("cert-frame norm", "full-screen-width");
}
else if (img!.className === "full-screen-width"){
console.log("=== full-screen-width")
img!.className = img!.className.replace("full-screen-width", "cert-frame norm");
}
}
return resize;
}
export function PosterRow({postername1, postername2, url1, url2}:{postername1: string, url1: string, postername2: string, url2: string}){
return(
<>
<div className="row">
<div className="col">
<Poster url={url1} postername={postername1} />
</div>
<div className="col">
<Poster url={url2} postername={postername2} />
</div>
</div>
<br/>
</>
)
}
\ No newline at end of file
src/components/precyse.tsx 0 → 100644
View file @ 3fd292fd
export default function PreCyse() {
return (<span className="underline--magical precyse">PreCyse</span>
)}
\ No newline at end of file
src/components/seclarations.ts
View file @ 3fd292fd
export * from './Buttons.tsx'
export * from './headings.tsx';
export * from './Headings.tsx';
export * from './Sidebar.tsx';
export * from './Boxes.tsx'
export * from './AOSs.tsx'
export * from './My-Timeline.tsx'
export * from './data/mapscr.ts'
export * from "./slider.tsx"
export * from './VerticalTimeline.tsx'
export * from "./Slider.tsx"
/* export * from './data/humanpractice.ts'; */
declare global{
......@@ -22,6 +21,7 @@ interface Window {
node: React.ReactNode,
cssname: string,
buttonname: string
main?: Boolean;
}
}
......@@ -34,3 +34,5 @@ interface Datawrapper {
dependencyPromises?: any;
}
src/components/sections.tsx 0 → 100644
View file @ 3fd292fd
import { H2, H3 } from "./Headings"
export function Section({id, title, children}: {id: string, title: string, children: React.ReactNode}){
let sec_id = `${id}H`
let header_id = id
return(
<div className="col">
<section id={sec_id} className="section">
<div id={header_id}><H2 text={title}/></div>
{children}
</section>
</div>
)
}
export function Subesction({id, title, children}: {id: string, title: string, children: React.ReactNode}){
return(
<section id={id}>
<H3 text={title} id={id + "H"}></H3>
{children}
</section>
)
}
\ No newline at end of file
src/components/test.css 0 → 100644
View file @ 3fd292fd
.ball01 {
fill: red;
}
.ball02 {
fill: blue;
}
.ball03 {
fill: green;
}
.homeAnimLine {
/* Set visibility to visible for debugging and hidden otherwise*/
visibility: visible;
}
.line {
stroke: bvar(--offblack)lack;
}
.theLine {
visibility: hidden;
}
.theLine2 {
visibility: hidden;
}
.theLine3 {
visibility: hidden;
}
.vector {
width: 100px;
height: 100px;
background-color: var(--ourbeige) ;
}
.animStarterClass {
visibility: hidden;
}
#payload {
height: 100px;
width: 100px;
float: left;
}
.firstSpacingBlock {
background-color: violet;
height: 50vh;
text-align: center;
}
.secondSpacingBlock {
margin-bottom: 160%;
}
#firstCircle {
background-color: yellow;
border-radius: 50%;
height: 100px;
width: 100px;
border: 2px solid blue;
}
#secondCircle {
background-color: blue;
border-radius: 50%;
height: 100px;
width: 100px;
border: 2px solid yellow;
margin-bottom: 10%;
}
#thirdCircle {
background-color: var(--offblack);
border-radius: 50%;
height: 100px;
width: 100px;
border: 2px solid yellow;
margin-bottom: 80%;
}
\ No newline at end of file
src/components/three-extended.d.ts 0 → 100644
View file @ 3fd292fd
declare module 'three/examples/jsm/loaders/GLTFLoader' {
export class GLTFLoader {
load(
url: string,
onLoad: (gltf: { scene: THREE.Group }) => void,
onProgress?: (event: ProgressEvent) => void,
onError?: (event: ErrorEvent) => void
): void;
}
}
\ No newline at end of file