From 1b11cd508767129bc12ca49065d4a17fca2c2a19 Mon Sep 17 00:00:00 2001
From: liliana <liliana.sanfilippo@uni-bielefeld.de>
Date: Sun, 30 Jun 2024 22:46:13 +0200
Subject: [PATCH] finishes layout for description, commented infinished parts
out and addedd pictures
---
README.md | 35 ++++--
package-lock.json | 65 ++--------
package.json | 6 +-
src/App/App.css | 198 ++++++++++++++++++++++++++++++-
src/App/App.scss | 105 ++++++++++++++++
src/App/App.tsx | 1 +
src/aos.css | 1 +
src/components/AOSs.tsx | 19 +++
src/components/Boxes.tsx | 45 +++++++
src/components/Collapsible.tsx | 42 +++++++
src/components/headings.tsx | 68 ++++++++++-
src/components/seclarations.d.ts | 10 --
src/contents/description.tsx | 68 +++++++++--
yarn.lock | 120 +++++++++++++++++--
14 files changed, 679 insertions(+), 104 deletions(-)
create mode 100644 src/App/App.scss
create mode 100644 src/aos.css
create mode 100644 src/components/AOSs.tsx
create mode 100644 src/components/Boxes.tsx
create mode 100644 src/components/Collapsible.tsx
diff --git a/README.md b/README.md
index 84eaf2d4..1ef62c54 100644
--- a/README.md
+++ b/README.md
@@ -24,19 +24,28 @@ You should probably only edit the files inside folders `static`, `wiki` and `wik
The static assets are in the `static` directory. The layout and templates are in the `wiki` directory, and the pages live in the `wiki > pages` directory. Unless you are an experienced and/or adventurous human, you probably shouldn't change other files.
- |__ static/ -> static assets (CSS and JavaScript files only)
- |__ wiki/ -> Main directory for the pages and layouts
- |__ footer.html -> Footer that will appear in all the pages
- |__ layout.html -> Main layout of your wiki. All the pages will follow its structure
- |__ menu.html -> Menu that will appear in all the pages
- |__ pages/ -> Directory for all the pages
- |__ *.html -> Actual pages of your wiki
- |__ .gitignore -> Tells GitLab which files/directories should not be uploaded to the repository
- |__ .gitlab-ci.yml -> Automated flow for building, testing and deploying your website.
- |__ LICENSE -> License CC-by-4.0, all wikis are required to have this license - DO NOT MODIFY
- |__ README.md -> File containing the text you are reading right now
- |__ app.py -> Python code managing your wiki
- |__ dependencies.txt -> Software dependencies from the Python code
+├── README.md -> The file you are currently reading
+├── index.html -> Single HTML file for the wiki
+├── package.json -> Manages project metadata and dependencies
+├── src/
+│ ├── components/ -> Components (Like Navbar, Timelines, ...)
+│ ├── App/ -> Main React application container
+| | ├── App.tsx
+| | └── App.css
+│ ├── contents/ -> Page components for the website
+│ │ ├── *.tsx
+│ │ └── index.ts -> Declaration file
+│ ├── main.tsx -> Entry point of the wiki application
+│ ├── pages.ts -> Page definition and path mapping
+│ ├── utils/ -> Utility functions
+| | ├── *.js -> Extra js files
+| | └── *.ts -> Given ts files
+│ └── vite-env.d.ts -> TypeScript definitions for Vite
+├── tsconfig.json -> Configures TypeScript options
+├── tsconfig.node.json -> TypeScript settings for Node.js
+├── vite.config.ts -> Configuration for the Vite tool
+└── yarn.lock -> Yarn lock file for dependency management
+
### Technologies
diff --git a/package-lock.json b/package-lock.json
index 79d80e88..973d2e04 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,19 +11,15 @@
"dependencies": {
"@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.5",
+ "@gsap/react": "^2.1.1",
"@mui/lab": "^5.0.0-alpha.170",
"@mui/material": "^5.15.21",
"@popperjs/core": "^2.11.8",
- "animate.css": "^4.1.1",
"aos": "^2.3.4",
"bootstrap": "^5.3.3",
"d3": "^7.9.0",
- "d3-fetch": "^3.0.1",
- "d3-scale": "^4.0.2",
"gsap": "^3.12.5",
- "prop-types": "^15.7.2",
"react": "^18.2.0",
- "react-animate-on-scroll": "^2.1.9",
"react-bootstrap": "^2.10.2",
"react-d3-library": "^1.0.4",
"react-dom": "^18.2.0",
@@ -35,13 +31,9 @@
"devDependencies": {
"@types/aos": "^3.0.7",
"@types/d3": "^7.4.3",
- "@types/d3-fetch": "^3.0.7",
- "@types/d3-scale": "^4.0.8",
"@types/node": "^20.12.10",
"@types/react": "^18.2.66",
- "@types/react-animate-on-scroll": "^2.1.8",
"@types/react-dom": "^18.2.22",
- "@types/react-simple-maps": "^3.0.4",
"@typescript-eslint/eslint-plugin": "^7.2.0",
"@typescript-eslint/parser": "^7.2.0",
"@vitejs/plugin-react": "^4.2.1",
@@ -849,6 +841,15 @@
"integrity": "sha512-XGndio0l5/Gvd6CLIABvsav9HHezgDFFhDfHk1bvLfr9ni8dojqLSvBbotJEjmIwNHL7vK4QzBJTdBRoB+c1ww==",
"license": "MIT"
},
+ "node_modules/@gsap/react": {
+ "version": "2.1.1",
+ "resolved": "https://registry.npmjs.org/@gsap/react/-/react-2.1.1.tgz",
+ "integrity": "sha512-apGPRrmpqxvl1T6Io1KgT8tFU+IuACI6z4zmT7t8+PASserJeLVRFJdSNUFA2Xb/eVkZI1noE8LIrY/w/oJECw==",
+ "dependencies": {
+ "gsap": "^3.12.5",
+ "react": ">=16"
+ }
+ },
"node_modules/@humanwhocodes/config-array": {
"version": "0.11.14",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.14.tgz",
@@ -1598,8 +1599,7 @@
"version": "3.0.7",
"resolved": "https://registry.npmjs.org/@types/aos/-/aos-3.0.7.tgz",
"integrity": "sha512-sEhyFqvKauUJZDbvAB3Pggynrq6g+2PS4XB3tmUr+mDL1gfDJnwslUC4QQ7/l8UD+LWpr3RxZVR/rHoZrLqZVg==",
- "dev": true,
- "license": "MIT"
+ "dev": true
},
"node_modules/@types/babel__core": {
"version": "7.20.5",
@@ -1983,16 +1983,6 @@
"csstype": "^3.0.2"
}
},
- "node_modules/@types/react-animate-on-scroll": {
- "version": "2.1.8",
- "resolved": "https://registry.npmjs.org/@types/react-animate-on-scroll/-/react-animate-on-scroll-2.1.8.tgz",
- "integrity": "sha512-Lyd1hb1aY9T0bOUL3VE7bKuOlAv2nBziJg5piDLqW+jxzy5jCa/nIftsOpYxZ0+Sdo0wFXuI6tpLo6B0Q288IQ==",
- "dev": true,
- "license": "MIT",
- "dependencies": {
- "@types/react": "*"
- }
- },
"node_modules/@types/react-dom": {
"version": "18.3.0",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.0.tgz",
@@ -2003,19 +1993,6 @@
"@types/react": "*"
}
},
- "node_modules/@types/react-simple-maps": {
- "version": "3.0.4",
- "resolved": "https://registry.npmjs.org/@types/react-simple-maps/-/react-simple-maps-3.0.4.tgz",
- "integrity": "sha512-U9qnX0wVhxldrTpsase44fIoLpyO1OT/hgNMRoJTixj1qjpMRdSRIfih93mR3D/Tss/8CmM7dPwKMjtaGkDpmw==",
- "dev": true,
- "license": "MIT",
- "dependencies": {
- "@types/d3-geo": "^2",
- "@types/d3-zoom": "^2",
- "@types/geojson": "*",
- "@types/react": "*"
- }
- },
"node_modules/@types/react-transition-group": {
"version": "4.4.10",
"resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.10.tgz",
@@ -2395,12 +2372,6 @@
"node": ">=0.4.2"
}
},
- "node_modules/animate.css": {
- "version": "4.1.1",
- "resolved": "https://registry.npmjs.org/animate.css/-/animate.css-4.1.1.tgz",
- "integrity": "sha512-+mRmCTv6SbCmtYJCN4faJMNFVNN5EuCTTprDTAo7YzIGji2KADmakjVA3+8mVDkZ2Bf09vayB35lSQIex2+QaQ==",
- "license": "MIT"
- },
"node_modules/ansi-regex": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
@@ -7708,20 +7679,6 @@
"node": ">=0.10.0"
}
},
- "node_modules/react-animate-on-scroll": {
- "version": "2.1.9",
- "resolved": "https://registry.npmjs.org/react-animate-on-scroll/-/react-animate-on-scroll-2.1.9.tgz",
- "integrity": "sha512-E4PZLX6RDLLn+/iIMhnQrC1xU74ixGcCQ5/TBX8fBsaO+SnaU9VFoZLvIfUqVf3mH5HUNzO8wAqA11niot5Obw==",
- "license": "MIT",
- "dependencies": {
- "lodash.throttle": "^4.1.1",
- "prop-types": "^15.5.9"
- },
- "peerDependencies": {
- "classnames": "^2.2.5",
- "react": ">= 15.4.1 < 19.0.0-0"
- }
- },
"node_modules/react-bootstrap": {
"version": "2.10.2",
"resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.10.2.tgz",
diff --git a/package.json b/package.json
index d38d2ed2..c495015b 100644
--- a/package.json
+++ b/package.json
@@ -17,19 +17,23 @@
"@mui/lab": "^5.0.0-alpha.170",
"@mui/material": "^5.15.21",
"@popperjs/core": "^2.11.8",
+ "aos": "^2.3.4",
"bootstrap": "^5.3.3",
"d3": "^7.9.0",
"gsap": "^3.12.5",
"react": "^18.2.0",
"react-bootstrap": "^2.10.2",
+ "react-collapsed": "^4.1.2",
"react-d3-library": "^1.0.4",
"react-dom": "^18.2.0",
"react-pdf": "^9.0.0",
"react-photo-album": "^2.4.1",
"react-router-dom": "^6.23.0",
- "react-select": "^5.8.0"
+ "react-select": "^5.8.0",
+ "sass": "^1.77.6"
},
"devDependencies": {
+ "@types/aos": "^3.0.7",
"@types/d3": "^7.4.3",
"@types/node": "^20.12.10",
"@types/react": "^18.2.66",
diff --git a/src/App/App.css b/src/App/App.css
index fe865c66..b6356f78 100644
--- a/src/App/App.css
+++ b/src/App/App.css
@@ -19,6 +19,26 @@
--igemdarkgreen: #006530;
--igemmediumgreen: #019968;
--igemlightgreen: #99cb9a;
+
+ --info-border-color: var(--mediumpurple);
+ --vp-ct: var(--text-primary);
+ --info-border-color: var(--accent-primary);
+ --info-bg-color: var(--lightyellow);
+ --info-title-color: var(--text-primary);
+ --info-code-bg-color: var(--lightyellow);
+ --note-border-color: var(--text-primary);
+ --note-bg-color: var(--darkoffwhite);
+ --note-title-color: var(--text-primary);
+ --note-code-bg-color: var(--darkoffwhite);
+ --tip-border-color: var(--text-primary);
+ --tip-bg-color: var(--darkoffwhite);
+ --tip-title-color: var(--text-primary);
+ --tip-code-bg-color: var(--darkoffwhite);
+ --warning-border-color: var(--accen-secondary);
+ --warning-bg-color: var(--lightorange);
+ --warning-title-color: var(--text-primary);
+ --warning-code-bg-color: var(--lightorange);
+
}
/* * * * * * * */
/* * * BODY* * */
@@ -188,6 +208,26 @@ h2{
text-decoration: none !important;
}
+.v2 p {
+ background-position: left;
+ background-size: 0% 100%;
+ background-image: linear-gradient(#f6e05e, #f6e05e);
+}
+.v2:hover p {
+ background-size: 100% 100%;
+}
+
+.v3 p {
+ color: transparent;
+ background-position: right;
+ background-size: 100% 100%;
+ background-image: linear-gradient(#a0aec0, #a0aec0);
+}
+.v3:hover p {
+ color: #000;
+ background-size: 0% 100%;
+}
+
/* * * * * * * */
/* * CALLOUT * */
@@ -300,7 +340,13 @@ img .middle{
}
.img-right{
float: right !important;
- padding-left: 1vw !important;
+ padding-left: 2vw !important;
+ padding-bottom: 1vw !important;
+ padding-top: 1vw !important;
+}
+.img-left{
+ float: left !important;
+ padding-right: 2vw !important;
padding-bottom: 1vw !important;
padding-top: 1vw !important;
}
@@ -308,6 +354,10 @@ img .middle{
max-width: 50% !important;
}
+.updown{
+ max-width: 3vw;
+}
+
.hexagon{
clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
@@ -318,7 +368,7 @@ img .middle{
svg{
background:transparent
}
-svg text{
+.hone svg text{
font-size: 7vw !important;
stroke-width:2px !important;
fill:var(--accent-primary) ;
@@ -326,7 +376,7 @@ svg text{
/*letter-spacing:4px;*/
animation:effect 3s, dash 3s;
}
-svg text:hover{
+.hone svg text:hover{
fill: var(--text-primary)
}
@@ -431,6 +481,19 @@ svg text:hover{
background-color: #000;
}
+.hello:hover {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 25vw;
+ animation-name: jumpy;
+ animation-iteration-count: infinite;
+ animation-timing-function: ease-in-out;
+ -webkit-text-stroke-width: 3px;
+ -webkit-text-stroke-color: black;
+}
+
/* TIMELINE EINS */
@@ -601,6 +664,7 @@ svg text:hover{
max-width: 560px;
}
+
.date {
background-color: var(--text-primary) !important;
padding: 4px !important;
@@ -689,10 +753,136 @@ svg text:hover{
width: 10vw;
height: 10vw;
background-color: var(--lightblue) !important;
+ box-shadow: 3px 3px 10px black !important;
border-radius: 50%;
margin: 1vw;
}
.shape-text {
margin: auto;
text-align: center;
-}
\ No newline at end of file
+}
+
+
+/*collapsible*/
+
+.collapse-card {
+ border-radius: 4px;
+ background-color: #fff;
+ color: #333;
+ padding: 10px;
+ box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2);
+ width: 100%;
+
+}
+
+
+/*boxes*/
+.hint-container {
+ position:relative;
+ transition:background var(--vp-ct),border-color var(--vp-ct),color var(--vp-ct)
+}
+@media print {
+ .hint-container {
+ page-break-inside:avoid
+ }
+}
+.hint-container .hint-container-title {
+ position:relative;
+ font-weight:600;
+ line-height:1.25
+}
+.hint-container.info,
+.hint-container.note,
+.hint-container.tip,
+.hint-container.warning,
+.hint-container.danger {
+ margin:1rem 0;
+ padding:.25rem 1rem;
+ border-inline-start-width:.3rem;
+ border-inline-start-style:solid;
+ border-radius:.5rem;
+ color:inherit
+}
+@media (max-width: 419px) {
+ .hint-container.info,
+ .hint-container.note,
+ .hint-container.tip,
+ .hint-container.warning,
+ .hint-container.danger {
+ margin-inline:-.75rem
+ }
+}
+.hint-container.info .hint-container-title,
+.hint-container.note .hint-container-title,
+.hint-container.tip .hint-container-title,
+.hint-container.warning .hint-container-title,
+.hint-container.danger .hint-container-title {
+ padding-inline-start:1.75rem
+}
+@media print {
+ .hint-container.info .hint-container-title,
+ .hint-container.note .hint-container-title,
+ .hint-container.tip .hint-container-title,
+ .hint-container.warning .hint-container-title,
+ .hint-container.danger .hint-container-title {
+ padding-inline-start:0
+ }
+}
+.hint-container.info .hint-container-title:before,
+.hint-container.note .hint-container-title:before,
+.hint-container.tip .hint-container-title:before,
+.hint-container.warning .hint-container-title:before,
+.hint-container.danger .hint-container-title:before {
+ content:" ";
+ position:absolute;
+ top:calc(50% - .6125em);
+ left:0;
+ width:1.25em;
+ height:1.25em;
+ background-position:left;
+ background-repeat:no-repeat
+}
+@media print {
+ .hint-container.info .hint-container-title:before,
+ .hint-container.note .hint-container-title:before,
+ .hint-container.tip .hint-container-title:before,
+ .hint-container.warning .hint-container-title:before,
+ .hint-container.danger .hint-container-title:before {
+ display:none
+ }
+}
+html[dir=rtl] .hint-container.info .hint-container-title:before,
+html[dir=rtl] .hint-container.note .hint-container-title:before,
+html[dir=rtl] .hint-container.tip .hint-container-title:before,
+html[dir=rtl] .hint-container.warning .hint-container-title:before,
+html[dir=rtl] .hint-container.danger .hint-container-title:before {
+ right:0;
+ left:unset
+}
+.hint-container.info p,
+.hint-container.note p,
+.hint-container.tip p,
+.hint-container.warning p,
+.hint-container.danger p {
+ line-height:1.5
+}
+.hint-container.info a,
+.hint-container.note a,
+.hint-container.tip a,
+.hint-container.warning a,
+.hint-container.danger a {
+ color:var(--vp-tc)
+}
+.hint-container.info {
+ border-color:var(--info-border-color);
+ background:var(--info-bg-color)
+}
+.hint-container.info>.hint-container-title {
+ color:var(--info-title-color)
+}
+.hint-container.info>.hint-container-title:before {
+ background-image:url("https://static.igem.wiki/teams/5247/design/icons/info-filled-small.png")
+}
+.hint-container.info code {
+ background:var(--info-code-bg-color)
+}
diff --git a/src/App/App.scss b/src/App/App.scss
new file mode 100644
index 00000000..6e43c7ce
--- /dev/null
+++ b/src/App/App.scss
@@ -0,0 +1,105 @@
+$background: #E4FFF7;
+
+@function textShadow($precision, $size, $color){
+ $value: null;
+ $offset: 0;
+ $length: $size * (1 / $precision) - 1;
+
+ @for $i from 0 through $length {
+ $offset: $offset + $precision;
+ $shadow: $offset + px $offset + px $color;
+ $value: append($value, $shadow, comma);
+ }
+
+ @return $value;
+}
+
+.playful span {
+ position: relative;
+ color: #850F78;
+ text-shadow: textShadow(0.25, 6, #ca17b6);
+ animation: scatter 1.75s infinite;
+}
+
+.playful span:nth-child(2n) {
+ color: #F57D22;
+ text-shadow: textShadow(0.25, 6, #f8a86b);
+ animation-delay: 0.3s;
+}
+
+.playful span:nth-child(3n) {
+ color: #F4CC1E;
+ text-shadow: textShadow(0.25, 6, #f8dd67);
+ animation-delay: 0.15s;
+}
+
+.playful span:nth-child(5n) {
+ color: #5c68ea;
+ text-shadow: textShadow(0.25, 6, #A0A7F3);
+ animation-delay: 0.4s;
+}
+
+.playful span:nth-child(7n), .playful span:nth-child(11n) {
+ color: #bc15aa;
+ text-shadow: textShadow(0.25, 6, #ff1ce4);
+ animation-delay: 0.25s;
+}
+
+@keyframes scatter {
+ 0% {
+ top: 0;
+ }
+ 50% {
+ top: -10px;
+ }
+ 100% {
+ top: 0;
+ }
+}
+
+
+
+.smoke span {
+ display: inline-block;
+ text-shadow: 0 0 0 whitesmoke;
+ animation: smoky 5s 3s both;
+}
+
+.smoke span:nth-child(even){
+ animation-name: smoky-mirror;
+}
+
+@keyframes smoky {
+ 60% {
+ text-shadow: 0 0 40px whitesmoke;
+ }
+ to {
+ transform:
+ translate3d(15rem,-8rem,0)
+ rotate(-40deg)
+ skewX(70deg)
+ scale(1.5);
+ text-shadow: 0 0 20px whitesmoke;
+ opacity: 0;
+ }
+}
+
+@keyframes smoky-mirror {
+ 60% {
+ text-shadow: 0 0 40px whitesmoke; }
+ to {
+ transform:
+ translate3d(18rem,-8rem,0)
+ rotate(-40deg)
+ skewX(-70deg)
+ scale(2);
+ text-shadow: 0 0 20px whitesmoke;
+ opacity: 0;
+ }
+}
+
+@for $item from 1 through 21 {
+ span:nth-of-type(#{$item}){
+ animation-delay: #{(3 + ($item/10))}s;
+ }
+}
\ No newline at end of file
diff --git a/src/App/App.tsx b/src/App/App.tsx
index 393a2c40..8458084b 100644
--- a/src/App/App.tsx
+++ b/src/App/App.tsx
@@ -1,4 +1,5 @@
import "./App.css";
+import "./App.scss";
import "bootstrap/dist/css/bootstrap.min.css";
import { Route, Routes } from "react-router-dom";
import { Footer } from "../components/Footer.tsx";
diff --git a/src/aos.css b/src/aos.css
new file mode 100644
index 00000000..66923fe6
--- /dev/null
+++ b/src/aos.css
@@ -0,0 +1 @@
+[data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos]{transition-duration:50ms}[data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate{transition-delay:50ms}[data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos]{transition-duration:.1s}[data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate{transition-delay:.1s}[data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos]{transition-duration:.15s}[data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate{transition-delay:.15s}[data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos]{transition-duration:.2s}[data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate{transition-delay:.2s}[data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos]{transition-duration:.25s}[data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate{transition-delay:.25s}[data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos]{transition-duration:.3s}[data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate{transition-delay:.3s}[data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos]{transition-duration:.35s}[data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate{transition-delay:.35s}[data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{transition-duration:.4s}[data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate{transition-delay:.4s}[data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos]{transition-duration:.45s}[data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate{transition-delay:.45s}[data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos]{transition-duration:.5s}[data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate{transition-delay:.5s}[data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos]{transition-duration:.55s}[data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate{transition-delay:.55s}[data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos]{transition-duration:.6s}[data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate{transition-delay:.6s}[data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos]{transition-duration:.65s}[data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate{transition-delay:.65s}[data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos]{transition-duration:.7s}[data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate{transition-delay:.7s}[data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos]{transition-duration:.75s}[data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="750"].aos-animate,body[data-aos-delay="750"] [data-aos].aos-animate{transition-delay:.75s}[data-aos][data-aos][data-aos-duration="800"],body[data-aos-duration="800"] [data-aos]{transition-duration:.8s}[data-aos][data-aos][data-aos-delay="800"],body[data-aos-delay="800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="800"].aos-animate,body[data-aos-delay="800"] [data-aos].aos-animate{transition-delay:.8s}[data-aos][data-aos][data-aos-duration="850"],body[data-aos-duration="850"] [data-aos]{transition-duration:.85s}[data-aos][data-aos][data-aos-delay="850"],body[data-aos-delay="850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="850"].aos-animate,body[data-aos-delay="850"] [data-aos].aos-animate{transition-delay:.85s}[data-aos][data-aos][data-aos-duration="900"],body[data-aos-duration="900"] [data-aos]{transition-duration:.9s}[data-aos][data-aos][data-aos-delay="900"],body[data-aos-delay="900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="900"].aos-animate,body[data-aos-delay="900"] [data-aos].aos-animate{transition-delay:.9s}[data-aos][data-aos][data-aos-duration="950"],body[data-aos-duration="950"] [data-aos]{transition-duration:.95s}[data-aos][data-aos][data-aos-delay="950"],body[data-aos-delay="950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="950"].aos-animate,body[data-aos-delay="950"] [data-aos].aos-animate{transition-delay:.95s}[data-aos][data-aos][data-aos-duration="1000"],body[data-aos-duration="1000"] [data-aos]{transition-duration:1s}[data-aos][data-aos][data-aos-delay="1000"],body[data-aos-delay="1000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1000"].aos-animate,body[data-aos-delay="1000"] [data-aos].aos-animate{transition-delay:1s}[data-aos][data-aos][data-aos-duration="1050"],body[data-aos-duration="1050"] [data-aos]{transition-duration:1.05s}[data-aos][data-aos][data-aos-delay="1050"],body[data-aos-delay="1050"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1050"].aos-animate,body[data-aos-delay="1050"] [data-aos].aos-animate{transition-delay:1.05s}[data-aos][data-aos][data-aos-duration="1100"],body[data-aos-duration="1100"] [data-aos]{transition-duration:1.1s}[data-aos][data-aos][data-aos-delay="1100"],body[data-aos-delay="1100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1100"].aos-animate,body[data-aos-delay="1100"] [data-aos].aos-animate{transition-delay:1.1s}[data-aos][data-aos][data-aos-duration="1150"],body[data-aos-duration="1150"] [data-aos]{transition-duration:1.15s}[data-aos][data-aos][data-aos-delay="1150"],body[data-aos-delay="1150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1150"].aos-animate,body[data-aos-delay="1150"] [data-aos].aos-animate{transition-delay:1.15s}[data-aos][data-aos][data-aos-duration="1200"],body[data-aos-duration="1200"] [data-aos]{transition-duration:1.2s}[data-aos][data-aos][data-aos-delay="1200"],body[data-aos-delay="1200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1200"].aos-animate,body[data-aos-delay="1200"] [data-aos].aos-animate{transition-delay:1.2s}[data-aos][data-aos][data-aos-duration="1250"],body[data-aos-duration="1250"] [data-aos]{transition-duration:1.25s}[data-aos][data-aos][data-aos-delay="1250"],body[data-aos-delay="1250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1250"].aos-animate,body[data-aos-delay="1250"] [data-aos].aos-animate{transition-delay:1.25s}[data-aos][data-aos][data-aos-duration="1300"],body[data-aos-duration="1300"] [data-aos]{transition-duration:1.3s}[data-aos][data-aos][data-aos-delay="1300"],body[data-aos-delay="1300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1300"].aos-animate,body[data-aos-delay="1300"] [data-aos].aos-animate{transition-delay:1.3s}[data-aos][data-aos][data-aos-duration="1350"],body[data-aos-duration="1350"] [data-aos]{transition-duration:1.35s}[data-aos][data-aos][data-aos-delay="1350"],body[data-aos-delay="1350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1350"].aos-animate,body[data-aos-delay="1350"] [data-aos].aos-animate{transition-delay:1.35s}[data-aos][data-aos][data-aos-duration="1400"],body[data-aos-duration="1400"] [data-aos]{transition-duration:1.4s}[data-aos][data-aos][data-aos-delay="1400"],body[data-aos-delay="1400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1400"].aos-animate,body[data-aos-delay="1400"] [data-aos].aos-animate{transition-delay:1.4s}[data-aos][data-aos][data-aos-duration="1450"],body[data-aos-duration="1450"] [data-aos]{transition-duration:1.45s}[data-aos][data-aos][data-aos-delay="1450"],body[data-aos-delay="1450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1450"].aos-animate,body[data-aos-delay="1450"] [data-aos].aos-animate{transition-delay:1.45s}[data-aos][data-aos][data-aos-duration="1500"],body[data-aos-duration="1500"] [data-aos]{transition-duration:1.5s}[data-aos][data-aos][data-aos-delay="1500"],body[data-aos-delay="1500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1500"].aos-animate,body[data-aos-delay="1500"] [data-aos].aos-animate{transition-delay:1.5s}[data-aos][data-aos][data-aos-duration="1550"],body[data-aos-duration="1550"] [data-aos]{transition-duration:1.55s}[data-aos][data-aos][data-aos-delay="1550"],body[data-aos-delay="1550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1550"].aos-animate,body[data-aos-delay="1550"] [data-aos].aos-animate{transition-delay:1.55s}[data-aos][data-aos][data-aos-duration="1600"],body[data-aos-duration="1600"] [data-aos]{transition-duration:1.6s}[data-aos][data-aos][data-aos-delay="1600"],body[data-aos-delay="1600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1600"].aos-animate,body[data-aos-delay="1600"] [data-aos].aos-animate{transition-delay:1.6s}[data-aos][data-aos][data-aos-duration="1650"],body[data-aos-duration="1650"] [data-aos]{transition-duration:1.65s}[data-aos][data-aos][data-aos-delay="1650"],body[data-aos-delay="1650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1650"].aos-animate,body[data-aos-delay="1650"] [data-aos].aos-animate{transition-delay:1.65s}[data-aos][data-aos][data-aos-duration="1700"],body[data-aos-duration="1700"] [data-aos]{transition-duration:1.7s}[data-aos][data-aos][data-aos-delay="1700"],body[data-aos-delay="1700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1700"].aos-animate,body[data-aos-delay="1700"] [data-aos].aos-animate{transition-delay:1.7s}[data-aos][data-aos][data-aos-duration="1750"],body[data-aos-duration="1750"] [data-aos]{transition-duration:1.75s}[data-aos][data-aos][data-aos-delay="1750"],body[data-aos-delay="1750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1750"].aos-animate,body[data-aos-delay="1750"] [data-aos].aos-animate{transition-delay:1.75s}[data-aos][data-aos][data-aos-duration="1800"],body[data-aos-duration="1800"] [data-aos]{transition-duration:1.8s}[data-aos][data-aos][data-aos-delay="1800"],body[data-aos-delay="1800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1800"].aos-animate,body[data-aos-delay="1800"] [data-aos].aos-animate{transition-delay:1.8s}[data-aos][data-aos][data-aos-duration="1850"],body[data-aos-duration="1850"] [data-aos]{transition-duration:1.85s}[data-aos][data-aos][data-aos-delay="1850"],body[data-aos-delay="1850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1850"].aos-animate,body[data-aos-delay="1850"] [data-aos].aos-animate{transition-delay:1.85s}[data-aos][data-aos][data-aos-duration="1900"],body[data-aos-duration="1900"] [data-aos]{transition-duration:1.9s}[data-aos][data-aos][data-aos-delay="1900"],body[data-aos-delay="1900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1900"].aos-animate,body[data-aos-delay="1900"] [data-aos].aos-animate{transition-delay:1.9s}[data-aos][data-aos][data-aos-duration="1950"],body[data-aos-duration="1950"] [data-aos]{transition-duration:1.95s}[data-aos][data-aos][data-aos-delay="1950"],body[data-aos-delay="1950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="1950"].aos-animate,body[data-aos-delay="1950"] [data-aos].aos-animate{transition-delay:1.95s}[data-aos][data-aos][data-aos-duration="2000"],body[data-aos-duration="2000"] [data-aos]{transition-duration:2s}[data-aos][data-aos][data-aos-delay="2000"],body[data-aos-delay="2000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2000"].aos-animate,body[data-aos-delay="2000"] [data-aos].aos-animate{transition-delay:2s}[data-aos][data-aos][data-aos-duration="2050"],body[data-aos-duration="2050"] [data-aos]{transition-duration:2.05s}[data-aos][data-aos][data-aos-delay="2050"],body[data-aos-delay="2050"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2050"].aos-animate,body[data-aos-delay="2050"] [data-aos].aos-animate{transition-delay:2.05s}[data-aos][data-aos][data-aos-duration="2100"],body[data-aos-duration="2100"] [data-aos]{transition-duration:2.1s}[data-aos][data-aos][data-aos-delay="2100"],body[data-aos-delay="2100"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2100"].aos-animate,body[data-aos-delay="2100"] [data-aos].aos-animate{transition-delay:2.1s}[data-aos][data-aos][data-aos-duration="2150"],body[data-aos-duration="2150"] [data-aos]{transition-duration:2.15s}[data-aos][data-aos][data-aos-delay="2150"],body[data-aos-delay="2150"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2150"].aos-animate,body[data-aos-delay="2150"] [data-aos].aos-animate{transition-delay:2.15s}[data-aos][data-aos][data-aos-duration="2200"],body[data-aos-duration="2200"] [data-aos]{transition-duration:2.2s}[data-aos][data-aos][data-aos-delay="2200"],body[data-aos-delay="2200"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2200"].aos-animate,body[data-aos-delay="2200"] [data-aos].aos-animate{transition-delay:2.2s}[data-aos][data-aos][data-aos-duration="2250"],body[data-aos-duration="2250"] [data-aos]{transition-duration:2.25s}[data-aos][data-aos][data-aos-delay="2250"],body[data-aos-delay="2250"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2250"].aos-animate,body[data-aos-delay="2250"] [data-aos].aos-animate{transition-delay:2.25s}[data-aos][data-aos][data-aos-duration="2300"],body[data-aos-duration="2300"] [data-aos]{transition-duration:2.3s}[data-aos][data-aos][data-aos-delay="2300"],body[data-aos-delay="2300"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2300"].aos-animate,body[data-aos-delay="2300"] [data-aos].aos-animate{transition-delay:2.3s}[data-aos][data-aos][data-aos-duration="2350"],body[data-aos-duration="2350"] [data-aos]{transition-duration:2.35s}[data-aos][data-aos][data-aos-delay="2350"],body[data-aos-delay="2350"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2350"].aos-animate,body[data-aos-delay="2350"] [data-aos].aos-animate{transition-delay:2.35s}[data-aos][data-aos][data-aos-duration="2400"],body[data-aos-duration="2400"] [data-aos]{transition-duration:2.4s}[data-aos][data-aos][data-aos-delay="2400"],body[data-aos-delay="2400"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2400"].aos-animate,body[data-aos-delay="2400"] [data-aos].aos-animate{transition-delay:2.4s}[data-aos][data-aos][data-aos-duration="2450"],body[data-aos-duration="2450"] [data-aos]{transition-duration:2.45s}[data-aos][data-aos][data-aos-delay="2450"],body[data-aos-delay="2450"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2450"].aos-animate,body[data-aos-delay="2450"] [data-aos].aos-animate{transition-delay:2.45s}[data-aos][data-aos][data-aos-duration="2500"],body[data-aos-duration="2500"] [data-aos]{transition-duration:2.5s}[data-aos][data-aos][data-aos-delay="2500"],body[data-aos-delay="2500"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2500"].aos-animate,body[data-aos-delay="2500"] [data-aos].aos-animate{transition-delay:2.5s}[data-aos][data-aos][data-aos-duration="2550"],body[data-aos-duration="2550"] [data-aos]{transition-duration:2.55s}[data-aos][data-aos][data-aos-delay="2550"],body[data-aos-delay="2550"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2550"].aos-animate,body[data-aos-delay="2550"] [data-aos].aos-animate{transition-delay:2.55s}[data-aos][data-aos][data-aos-duration="2600"],body[data-aos-duration="2600"] [data-aos]{transition-duration:2.6s}[data-aos][data-aos][data-aos-delay="2600"],body[data-aos-delay="2600"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2600"].aos-animate,body[data-aos-delay="2600"] [data-aos].aos-animate{transition-delay:2.6s}[data-aos][data-aos][data-aos-duration="2650"],body[data-aos-duration="2650"] [data-aos]{transition-duration:2.65s}[data-aos][data-aos][data-aos-delay="2650"],body[data-aos-delay="2650"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2650"].aos-animate,body[data-aos-delay="2650"] [data-aos].aos-animate{transition-delay:2.65s}[data-aos][data-aos][data-aos-duration="2700"],body[data-aos-duration="2700"] [data-aos]{transition-duration:2.7s}[data-aos][data-aos][data-aos-delay="2700"],body[data-aos-delay="2700"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2700"].aos-animate,body[data-aos-delay="2700"] [data-aos].aos-animate{transition-delay:2.7s}[data-aos][data-aos][data-aos-duration="2750"],body[data-aos-duration="2750"] [data-aos]{transition-duration:2.75s}[data-aos][data-aos][data-aos-delay="2750"],body[data-aos-delay="2750"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2750"].aos-animate,body[data-aos-delay="2750"] [data-aos].aos-animate{transition-delay:2.75s}[data-aos][data-aos][data-aos-duration="2800"],body[data-aos-duration="2800"] [data-aos]{transition-duration:2.8s}[data-aos][data-aos][data-aos-delay="2800"],body[data-aos-delay="2800"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2800"].aos-animate,body[data-aos-delay="2800"] [data-aos].aos-animate{transition-delay:2.8s}[data-aos][data-aos][data-aos-duration="2850"],body[data-aos-duration="2850"] [data-aos]{transition-duration:2.85s}[data-aos][data-aos][data-aos-delay="2850"],body[data-aos-delay="2850"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2850"].aos-animate,body[data-aos-delay="2850"] [data-aos].aos-animate{transition-delay:2.85s}[data-aos][data-aos][data-aos-duration="2900"],body[data-aos-duration="2900"] [data-aos]{transition-duration:2.9s}[data-aos][data-aos][data-aos-delay="2900"],body[data-aos-delay="2900"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2900"].aos-animate,body[data-aos-delay="2900"] [data-aos].aos-animate{transition-delay:2.9s}[data-aos][data-aos][data-aos-duration="2950"],body[data-aos-duration="2950"] [data-aos]{transition-duration:2.95s}[data-aos][data-aos][data-aos-delay="2950"],body[data-aos-delay="2950"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="2950"].aos-animate,body[data-aos-delay="2950"] [data-aos].aos-animate{transition-delay:2.95s}[data-aos][data-aos][data-aos-duration="3000"],body[data-aos-duration="3000"] [data-aos]{transition-duration:3s}[data-aos][data-aos][data-aos-delay="3000"],body[data-aos-delay="3000"] [data-aos]{transition-delay:0}[data-aos][data-aos][data-aos-delay="3000"].aos-animate,body[data-aos-delay="3000"] [data-aos].aos-animate{transition-delay:3s}[data-aos][data-aos][data-aos-easing=linear],body[data-aos-easing=linear] [data-aos]{transition-timing-function:cubic-bezier(.25,.25,.75,.75)}[data-aos][data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos]{transition-timing-function:ease}[data-aos][data-aos][data-aos-easing=ease-in],body[data-aos-easing=ease-in] [data-aos]{transition-timing-function:ease-in}[data-aos][data-aos][data-aos-easing=ease-out],body[data-aos-easing=ease-out] [data-aos]{transition-timing-function:ease-out}[data-aos][data-aos][data-aos-easing=ease-in-out],body[data-aos-easing=ease-in-out] [data-aos]{transition-timing-function:ease-in-out}[data-aos][data-aos][data-aos-easing=ease-in-back],body[data-aos-easing=ease-in-back] [data-aos]{transition-timing-function:cubic-bezier(.6,-.28,.735,.045)}[data-aos][data-aos][data-aos-easing=ease-out-back],body[data-aos-easing=ease-out-back] [data-aos]{transition-timing-function:cubic-bezier(.175,.885,.32,1.275)}[data-aos][data-aos][data-aos-easing=ease-in-out-back],body[data-aos-easing=ease-in-out-back] [data-aos]{transition-timing-function:cubic-bezier(.68,-.55,.265,1.55)}[data-aos][data-aos][data-aos-easing=ease-in-sine],body[data-aos-easing=ease-in-sine] [data-aos]{transition-timing-function:cubic-bezier(.47,0,.745,.715)}[data-aos][data-aos][data-aos-easing=ease-out-sine],body[data-aos-easing=ease-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.39,.575,.565,1)}[data-aos][data-aos][data-aos-easing=ease-in-out-sine],body[data-aos-easing=ease-in-out-sine] [data-aos]{transition-timing-function:cubic-bezier(.445,.05,.55,.95)}[data-aos][data-aos][data-aos-easing=ease-in-quad],body[data-aos-easing=ease-in-quad] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quad],body[data-aos-easing=ease-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quad],body[data-aos-easing=ease-in-out-quad] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-cubic],body[data-aos-easing=ease-in-cubic] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-cubic],body[data-aos-easing=ease-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-cubic],body[data-aos-easing=ease-in-out-cubic] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-quart],body[data-aos-easing=ease-in-quart] [data-aos]{transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quart],body[data-aos-easing=ease-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quart],body[data-aos-easing=ease-in-out-quart] [data-aos]{transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos^=fade][data-aos^=fade]{opacity:0;transition-property:opacity,transform}[data-aos^=fade][data-aos^=fade].aos-animate{opacity:1;transform:translateZ(0)}[data-aos=fade-up]{transform:translate3d(0,100px,0)}[data-aos=fade-down]{transform:translate3d(0,-100px,0)}[data-aos=fade-right]{transform:translate3d(-100px,0,0)}[data-aos=fade-left]{transform:translate3d(100px,0,0)}[data-aos=fade-up-right]{transform:translate3d(-100px,100px,0)}[data-aos=fade-up-left]{transform:translate3d(100px,100px,0)}[data-aos=fade-down-right]{transform:translate3d(-100px,-100px,0)}[data-aos=fade-down-left]{transform:translate3d(100px,-100px,0)}[data-aos^=zoom][data-aos^=zoom]{opacity:0;transition-property:opacity,transform}[data-aos^=zoom][data-aos^=zoom].aos-animate{opacity:1;transform:translateZ(0) scale(1)}[data-aos=zoom-in]{transform:scale(.6)}[data-aos=zoom-in-up]{transform:translate3d(0,100px,0) scale(.6)}[data-aos=zoom-in-down]{transform:translate3d(0,-100px,0) scale(.6)}[data-aos=zoom-in-right]{transform:translate3d(-100px,0,0) scale(.6)}[data-aos=zoom-in-left]{transform:translate3d(100px,0,0) scale(.6)}[data-aos=zoom-out]{transform:scale(1.2)}[data-aos=zoom-out-up]{transform:translate3d(0,100px,0) scale(1.2)}[data-aos=zoom-out-down]{transform:translate3d(0,-100px,0) scale(1.2)}[data-aos=zoom-out-right]{transform:translate3d(-100px,0,0) scale(1.2)}[data-aos=zoom-out-left]{transform:translate3d(100px,0,0) scale(1.2)}[data-aos^=slide][data-aos^=slide]{transition-property:transform}[data-aos^=slide][data-aos^=slide].aos-animate{transform:translateZ(0)}[data-aos=slide-up]{transform:translate3d(0,100%,0)}[data-aos=slide-down]{transform:translate3d(0,-100%,0)}[data-aos=slide-right]{transform:translate3d(-100%,0,0)}[data-aos=slide-left]{transform:translate3d(100%,0,0)}[data-aos^=flip][data-aos^=flip]{backface-visibility:hidden;transition-property:transform}[data-aos=flip-left]{transform:perspective(2500px) rotateY(-100deg)}[data-aos=flip-left].aos-animate{transform:perspective(2500px) rotateY(0)}[data-aos=flip-right]{transform:perspective(2500px) rotateY(100deg)}[data-aos=flip-right].aos-animate{transform:perspective(2500px) rotateY(0)}[data-aos=flip-up]{transform:perspective(2500px) rotateX(-100deg)}[data-aos=flip-up].aos-animate{transform:perspective(2500px) rotateX(0)}[data-aos=flip-down]{transform:perspective(2500px) rotateX(100deg)}[data-aos=flip-down].aos-animate{transform:perspective(2500px) rotateX(0)}
\ No newline at end of file
diff --git a/src/components/AOSs.tsx b/src/components/AOSs.tsx
new file mode 100644
index 00000000..12ce0aa0
--- /dev/null
+++ b/src/components/AOSs.tsx
@@ -0,0 +1,19 @@
+//AOSs.tsx
+import AOS from "aos";
+import "./aos.css";
+import { useEffect } from "react";
+
+
+
+export function AOStry(){
+ useEffect(() => {
+ AOS.init({
+ disable: "phone",
+ duration: 700,
+ easing: "ease-out-cubic",
+ });
+ }, []);
+ return(
+ <h1 data-aos="zoom-y-out">Sample heading</h1>
+ )
+}
\ No newline at end of file
diff --git a/src/components/Boxes.tsx b/src/components/Boxes.tsx
new file mode 100644
index 00000000..9bc42fcd
--- /dev/null
+++ b/src/components/Boxes.tsx
@@ -0,0 +1,45 @@
+
+
+export function BulbBox({title, children}:{title: string, children: React.ReactNode}){
+ return(
+ <aside className="hint-container tip">
+ <p className="hint-container-title">
+ {title}
+ </p>
+ <div className="v-card-text">
+ <p>
+ {children}
+ </p>
+ </div>
+ </aside>
+ )
+}
+
+export function InfoBox({title, children}:{title: string, children: React.ReactNode}){
+ return(
+ <aside className="hint-container info">
+ <p className="hint-container-title">
+ {title}
+ </p>
+ <div className="v-card-text">
+ <p>
+ {children}
+ </p>
+ </div>
+ </aside>
+ )
+}
+export function WarnBox({title, children}:{title: string, children: React.ReactNode}){
+ return(
+ <aside className="hint-container warning">
+ <p className="hint-container-title">
+ {title}
+ </p>
+ <div className="v-card-text">
+ <p>
+ {children}
+ </p>
+ </div>
+ </aside>
+ )
+}
\ No newline at end of file
diff --git a/src/components/Collapsible.tsx b/src/components/Collapsible.tsx
new file mode 100644
index 00000000..12c31783
--- /dev/null
+++ b/src/components/Collapsible.tsx
@@ -0,0 +1,42 @@
+import { useState } from 'react';
+
+interface IProps {
+ open?: boolean;
+ title?: string;
+ children?: React.ReactNode;
+ }
+
+
+
+ export const Collapsible: React.FC<IProps> = ({ open, children, title }) => {
+ const [isOpen, setIsOpen] = useState(open);
+
+ const handleFilterOpening = () => {
+ setIsOpen((prev) => !prev);
+ };
+
+ return (
+ <>
+ <div className="collapse-card ">
+ <div>
+ <div className="p-3 border-bottom d-flex justify-content-between">
+ <h6 className="font-weight-bold">{title}</h6>
+ <button type="button" className="btn" onClick={handleFilterOpening}>
+ {!isOpen ? (
+ <img className='updown' src="https://static.igem.wiki/teams/5247/design/icons/angle-small-down.png" />
+ ) : (
+ <img className='updown' src="https://static.igem.wiki/teams/5247/design/icons/angle-small-up32px.png" />
+ )}
+ </button>
+ </div>
+ </div>
+
+ <div className="border-bottom">
+ <div>{isOpen && <div className="p-3">{children}</div>}</div>
+ </div>
+ </div>
+ </>
+ );
+ };
+
+ export default Collapsible;
\ No newline at end of file
diff --git a/src/components/headings.tsx b/src/components/headings.tsx
index 346d30df..2dfcdf4d 100644
--- a/src/components/headings.tsx
+++ b/src/components/headings.tsx
@@ -1,9 +1,33 @@
+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">
+ <div className="row hone">
<svg width="100%" height="100%">
<text x="0%" y="60%">
{text}
@@ -23,4 +47,46 @@ export function H2({text}:{text: string}){
)
}
+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 default H1;
\ No newline at end of file
diff --git a/src/components/seclarations.d.ts b/src/components/seclarations.d.ts
index 8ac90a7a..8e3c2641 100644
--- a/src/components/seclarations.d.ts
+++ b/src/components/seclarations.d.ts
@@ -13,17 +13,7 @@ export * from './components/Timeline.js';
export * from './themes/index.js';
export * from './constants/layouts';
export * from './utils/themes/defaultTheme';
-
-export * from '../ImageAtom.js';
-export * from './components/atoms/MarkdownAtom.js';
-
-export * from './components/events/Events';
export * from '../Card.js';
-export * from './components/events/ImageEvent.js';
-export * from './components/events/TextEvent.js';
-export *from './components/events/EventDate.js';
-export * from './Marker.js';
-
export * from './AOSs.tsx'
export * from './My-Timeline.tsx'
diff --git a/src/contents/description.tsx b/src/contents/description.tsx
index 1e0dc863..fbbc13e4 100644
--- a/src/contents/description.tsx
+++ b/src/contents/description.tsx
@@ -1,7 +1,8 @@
import { H2 } from "../components/headings";
import { Circle } from "../components/Shapes";
/* import "../utils/text.js"; */
-
+import { Collapsible } from "../components/Collapsible";
+import { InfoBox } from "../components/Boxes";
export function Description() {
@@ -18,11 +19,11 @@ export function Description() {
<div className="col">
<section id="Cystic Fibrosis" className="section">
<H2 text="Cystic Fibrosis"/>
+ {/* <h3>General</h3> */}
<div className="row align-items-center">
<div className="col">
<p data-aos="zoom-y-out" >Cystic fibrosis (CF) is the most common life-limiting genetic disorder in the Caucasian population. In Europe, CF affecting about 1 in 3,000 newborns<a href="#desc-one"><sup>1</sup></a>.</p>
<p> It is caused by mutations in the CFTR gene, which controls ions and water movement in cells. This leads to thick mucus, clogging airways, and frequent infections. The defective CFTR protein impacts the respiratory and digestive systems, causing chronic lung infections, breathing difficulties, and malnutrition. CF's severity varies, but it reduces life quality and expectancy. There are over 1,700 CFTR mutations; the ΔF508 mutation is most common, present in 70% of cases. It prevents proper protein folding, affecting its function. </p>
-
</div>
<div className="col-2 ">
<Circle text="1:3000 newborns worldwide"/>
@@ -30,9 +31,10 @@ export function Description() {
<Circle text="kosten"/>
</div>
</div>
- <div className="col">
+ {/* <div className="col">
<img src="https://static.igem.wiki/teams/5247/charts-maps/cfper10-000.png"></img>
</div>
+ <h3>CFTR</h3>
<div className="row align-items-center">
<div className="col-2 ">
<img src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
@@ -43,11 +45,24 @@ export function Description() {
</div>
</div>
<img src="https://static.igem.wiki/teams/5247/charts-maps/cfper10-000.png"/>
- <svg width="100%" height="100%">
- <text x="50%" y="60%" text-anchor="middle" >
- Gracias
- </text>
- </svg>
+ <h3>Symptoms</h3>
+ <p>Text about symptoms</p>
+ <Collapsible title="How the symptoms affect different parts of the body" ></Collapsible>
+ <h3>Diagnosis</h3>
+ <p>About the ways one can be diagnosed</p>
+ <div className="row align-items-center">
+ <div className="col" >
+ <img src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
+ </div>
+ <div className="col" >
+ How newbornscreening affected the numbers.
+ </div>
+ </div>
+ <h3>Treatment</h3>
+ <img src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
+ <Collapsible title="Different types of drugs" ></Collapsible>
+ <p>Why we still need other options</p>
+ <img src="https://static.igem.wiki/teams/5247/charts-maps/cfper10-000.png"/> */}
</section>
</div>
@@ -55,26 +70,54 @@ export function Description() {
<section id="Our motivation" className="section">
<H2 text="Our motivation"></H2>
<p>We chose to focus on CF and specifically the ΔF508 mutation due to its prevalence and the severe impact it has on patients' lives. Additionally, our team includes members who have close friends affected by this condition, giving us a personal connection and a strong motivation to find a solution. By targeting the ΔF508 mutation, we aim to develop a therapy that could potentially, not only benefit many CF patients and make a significant improvement in their lives, but also can serve as a template, which research groups can use to target other genetic diseases. </p>
+ {/* <div className="row align-items-center">
+ <div className="col" >
+ About del508
+ </div>
+ <div className="col" >
+ <img src="https://static.igem.wiki/teams/5247/placeholders/placehilderperson.jpeg"/>
+ </div>
+ </div>
+ <p>Max</p> */}
</section>
</div>
<div className="col">
<section id="Approach" className="section">
<H2 text="Approach"></H2>
- <img className="img-right img-half" src="https://static.igem.wiki/teams/5247/scientific-figures/complex-abb.png"/>
+ <p>To correct the mutation, we are utilizing Prime Editing technologies. Prime Editing is a genome editing technique that allows precise DNA modifications without causing double-strand breaks<a href="#desc-two"><sup>2</sup></a>. Structurally, the Prime Editing complex consists of a Cas9 endonuclease fused to a reverse transcriptase (RT) and guided by a pegRNA, which directs the complex to the target site in the genome. </p>
+{/* <InfoBox title="Prime Editing">
+ About prime editing
+ </InfoBox> */}
+ <img className="img-right img-half" src="https://static.igem.wiki/teams/5247/scientific-figures/komplex-komplett.png"/>
+
<div>
<p>However, the Prime Editing complex is relatively large, posing challenges for therapeutic delivery<a href="#desc-three"><sup>3</sup></a>. Additionally, Prime Editing has been shown to be relatively inefficient in terms of gene editing rates, which could limit its therapeutic utility<a href="#desc-four"><sup>4</sup></a>. Our project aims to enhance the Prime Editing approach by miniaturizing its components. Fanzor, a recently discovered eukaryotic endonuclease, performs functions similar to Cas9, a crucial part of the Prime Editing complex, but is significantly smaller. We aim to substitute Cas9 with Fanzor. </p>
<p>Additionally, we plan to replace the reverse transcriptase in the Prime Editing complex with a smaller RT variant. Furthermore, MCP proteins will be added to the Prime Editing complex to increase its stability<a href="#desc-five"><sup>5</sup></a>. </p>
- <p>The pegRNA is optimized via an extension by a stem loop, which stabilizes the RNA by protecting it from RNases and serves as a binding site for the MCP, which also supports the secondary RNA structure. Additionally, the pegRNA contains a riboswitch, a sodium ion-controlled regulator that switches off the complex. This represents a major biosafety feature in that the complex is switched off after successful DNA editing and the subsequent increased influx of chloride ions into the cell. The pegRNA is combined with an optimized sgRNA resulting in higher on-target effect. Overall, its optimization leads to a longer shelf life and an increase in the biosafety of the complex. </p>
- <p>To correct the mutation, we are utilizing Prime Editing technologies. Prime Editing is a genome editing technique that allows precise DNA modifications without causing double-strand breaks<a href="#desc-two"><sup>2</sup></a>. Structurally, the Prime Editing complex consists of a Cas9 endonuclease fused to a reverse transcriptase (RT) and guided by a pegRNA, which directs the complex to the target site in the genome. </p>
</div>
+ {/* <Collapsible title="Cas vs. Fanzor" ></Collapsible> */}
+ <p>The pegRNA is optimized via an extension by a stem loop, which stabilizes the RNA by protecting it from RNases and serves as a binding site for the MCP, which also supports the secondary RNA structure. Additionally, the pegRNA contains a riboswitch, a sodium ion-controlled regulator that switches off the complex. This represents a major biosafety feature in that the complex is switched off after successful DNA editing and the subsequent increased influx of chloride ions into the cell. The pegRNA is combined with an optimized sgRNA resulting in higher on-target effect. Overall, its optimization leads to a longer shelf life and an increase in the biosafety of the complex. </p>
+{/* <InfoBox title="Riboswitch">
+ About the Riboswitch
+ </InfoBox> */}
</section>
</div>
<div className="col">
<section id="Delivery" className="section">
<H2 text="Delivery"></H2>
- <p>We chose LNPs as the delivery system of our Next-Generation Prime Editing Technology. Because of their large capacity and less immunogenic side effects compared to other delivery systems like Adeno-associated Viruses (AVV)<a href="#desc-six"><sup>6</sup></a>. Our aim is to optimize the LNP formulation to improve delivery to lung tissue via inhalation. Because of our collaborations, we are able to test and optimize different delivery systems to improve our organ specific therapeutic approach. Therefore, our LNP design focusses on stability and targeting. Stability is achieved by a polyethylene glycol (PEG) coating that protects the LNPs from degradation by the immune system<a href="#desc-seven"><sup>7</sup></a>. Moreover, we use capsaicin in combination with chitosan to improve the uptake of our construct through their mucus-adhesive properties<a href="#desc-eight"><sup>8</sup></a>. </p>
+ <img className="img-left img-half" src="https://static.igem.wiki/teams/5247/scientific-figures/lnp.png" height={"200vw"}/>
+ <div>
+ <p>We chose LNPs as the delivery system of our Next-Generation Prime Editing Technology. Because of their large capacity and less immunogenic side effects compared to other delivery systems like Adeno-associated Viruses (AVV)<a href="#desc-six"><sup>6</sup></a>. Our aim is to optimize the LNP formulation to improve delivery to lung tissue via inhalation. Because of our collaborations, we are able to test and optimize different delivery systems to improve our organ specific therapeutic approach. Therefore, our LNP design focusses on stability and targeting. Stability is achieved by a polyethylene glycol (PEG) coating that protects the LNPs from degradation by the immune system<a href="#desc-seven"><sup>7</sup></a>. Moreover, we use capsaicin in combination with chitosan to improve the uptake of our construct through their mucus-adhesive properties<a href="#desc-eight"><sup>8</sup></a>. </p>
+ </div>
+ <div className="row align-items-center">
+{/* <div className="col">
+ LAgertemperatur der Parts
+ </div>
+ <div className="col">
+ Trocknung
+ </div> */}
+ </div>
<p>We are furthermore optimising the LNPs for pulmonary therapy and investigating delivery by nebulisation as a non-invasive method compared to systemic approaches to make the therapy more convenient for patients. For specific targeting, we are focussing on marker proteins of basal cells and ionocytes that produce particularly high levels of CFTR protein and which we want to target with appropriate antibodies<a href="#desc-nine"><sup>9</sup></a>. Our workflow includes testing our next generation Prime Editing Technology delivered by our optimized LNPs in cell culture lines but also in primary nasal epithelial cells of CF patients to evaluate our optimizations and further improvements in vitro. We can also provide the outlook on the adaptation of the delivery system enabling systemic applications as well. </p>
</section>
</div>
@@ -83,6 +126,7 @@ export function Description() {
<section id="Our vision" className="section">
<H2 text="Our vision"></H2>
<p>We are envisioning a potential integration into a broader therapeutic framework involving customized gene editing tools for various genetic disorders, that present similar problems/difficulties to the F508del mutation, as well as other genetic diseases of different causes. This could include collaborations with pharmaceutical companies to develop new treatment modalities for genetic diseases beyond cystic fibrosis, utilizing advanced delivery systems and personalized medicine approaches. </p>
+
</section>
</div>
{/* Sources */}
diff --git a/yarn.lock b/yarn.lock
index d25f9c3a..48c890b2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -251,7 +251,7 @@
"@emotion/is-prop-valid@^1.2.2":
version "1.2.2"
- resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz#d4175076679c6a26faa92b03bb786f9e52612337"
+ resolved "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.2.tgz"
integrity sha512-uNsoYd37AFmaCdXlg6EYD1KaPOaRWRByMCYzbKUX4+hhMfrxdVSelShywL4JVaAeM/eHUOSprYBQls+/neX3pw==
dependencies:
"@emotion/memoize" "^0.8.1"
@@ -293,7 +293,7 @@
"@emotion/styled@^11.11.5":
version "11.11.5"
- resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-11.11.5.tgz#0c5c8febef9d86e8a926e663b2e5488705545dfb"
+ resolved "https://registry.npmjs.org/@emotion/styled/-/styled-11.11.5.tgz"
integrity sha512-/ZjjnaNKvuMPxcIiUkf/9SHoG4Q196DRl1w82hQ3WCsjo1IUR8uaGWrC6a87CrYAW0Kb/pK7hk8BnLgLRi9KoQ==
dependencies:
"@babel/runtime" "^7.18.3"
@@ -499,7 +499,7 @@
"@gsap/react@^2.1.1":
version "2.1.1"
- resolved "https://registry.yarnpkg.com/@gsap/react/-/react-2.1.1.tgz#219a81c84f93a2631c8aa324c0f5cce03cdf2ed9"
+ resolved "https://registry.npmjs.org/@gsap/react/-/react-2.1.1.tgz"
integrity sha512-apGPRrmpqxvl1T6Io1KgT8tFU+IuACI6z4zmT7t8+PASserJeLVRFJdSNUFA2Xb/eVkZI1noE8LIrY/w/oJECw==
dependencies:
gsap "^3.12.5"
@@ -815,6 +815,11 @@
dependencies:
tslib "^2.4.0"
+"@types/aos@^3.0.7":
+ version "3.0.7"
+ resolved "https://registry.npmjs.org/@types/aos/-/aos-3.0.7.tgz"
+ integrity sha512-sEhyFqvKauUJZDbvAB3Pggynrq6g+2PS4XB3tmUr+mDL1gfDJnwslUC4QQ7/l8UD+LWpr3RxZVR/rHoZrLqZVg==
+
"@types/babel__core@^7.20.5":
version "7.20.5"
resolved "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz"
@@ -1312,6 +1317,23 @@ anymatch@^1.3.0:
micromatch "^2.1.5"
normalize-path "^2.0.0"
+anymatch@~3.1.2:
+ version "3.1.3"
+ resolved "https://registry.yarnpkg.com/anymatch/-/anymatch-3.1.3.tgz#790c58b19ba1720a84205b57c618d5ad8524973e"
+ integrity sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==
+ dependencies:
+ normalize-path "^3.0.0"
+ picomatch "^2.0.4"
+
+aos@^2.3.4:
+ version "2.3.4"
+ resolved "https://registry.npmjs.org/aos/-/aos-2.3.4.tgz"
+ integrity sha512-zh/ahtR2yME4I51z8IttIt4lC1Nw0ktsFtmeDzID1m9naJnWXhCoARaCgNOGXb5CLy3zm+wqmRAEgMYB5E2HUw==
+ dependencies:
+ classlist-polyfill "^1.0.3"
+ lodash.debounce "^4.0.6"
+ lodash.throttle "^4.0.1"
+
"aproba@^1.0.3 || ^2.0.0":
version "2.0.0"
resolved "https://registry.npmjs.org/aproba/-/aproba-2.0.0.tgz"
@@ -2219,6 +2241,11 @@ binary-extensions@^1.0.0:
resolved "https://registry.npmjs.org/binary-extensions/-/binary-extensions-1.13.1.tgz"
integrity sha512-Un7MIEDdUC5gNpcGDV97op1Ywk748MpHcFTHoYs6qnj1Z3j7I53VG3nwZhKzoBZmbdRNnb6WRdFlwl7tSDuZGw==
+binary-extensions@^2.0.0:
+ version "2.3.0"
+ resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.3.0.tgz#f6e14a97858d327252200242d4ccfe522c445522"
+ integrity sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==
+
bindings@^1.5.0:
version "1.5.0"
resolved "https://registry.yarnpkg.com/bindings/-/bindings-1.5.0.tgz#10353c9e945334bc0511a6d90b38fbc7c9c504df"
@@ -2271,7 +2298,7 @@ braces@^2.3.1:
split-string "^3.0.2"
to-regex "^3.0.1"
-braces@^3.0.2:
+braces@^3.0.2, braces@~3.0.2:
version "3.0.3"
resolved "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz"
integrity sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==
@@ -2402,6 +2429,21 @@ chalk@^4.0.0:
ansi-styles "^4.1.0"
supports-color "^7.1.0"
+"chokidar@>=3.0.0 <4.0.0":
+ version "3.6.0"
+ resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.6.0.tgz#197c6cc669ef2a8dc5e7b4d97ee4e092c3eb0d5b"
+ integrity sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==
+ dependencies:
+ anymatch "~3.1.2"
+ braces "~3.0.2"
+ glob-parent "~5.1.2"
+ is-binary-path "~2.1.0"
+ is-glob "~4.0.1"
+ normalize-path "~3.0.0"
+ readdirp "~3.6.0"
+ optionalDependencies:
+ fsevents "~2.3.2"
+
chokidar@^1.0.0:
version "1.7.0"
resolved "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz"
@@ -2433,6 +2475,11 @@ class-utils@^0.3.5:
isobject "^3.0.0"
static-extend "^0.1.1"
+classlist-polyfill@^1.0.3:
+ version "1.2.0"
+ resolved "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz"
+ integrity sha512-GzIjNdcEtH4ieA2S8NmrSxv7DfEV5fmixQeyTmqmRmRJPGpRBaSnA2a0VrCjyT8iW8JjEdMbKzDotAJf+ajgaQ==
+
classnames@^2.3.2:
version "2.5.1"
resolved "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz"
@@ -3510,7 +3557,7 @@ glob-parent@^2.0.0:
dependencies:
is-glob "^2.0.0"
-glob-parent@^5.1.2:
+glob-parent@^5.1.2, glob-parent@~5.1.2:
version "5.1.2"
resolved "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz"
integrity sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==
@@ -3584,7 +3631,7 @@ graphemer@^1.4.0:
gsap@^3.12.5:
version "3.12.5"
- resolved "https://registry.yarnpkg.com/gsap/-/gsap-3.12.5.tgz#136c02dad4c673b441bdb1ca00104bfcb4eae7f4"
+ resolved "https://registry.npmjs.org/gsap/-/gsap-3.12.5.tgz"
integrity sha512-srBfnk4n+Oe/ZnMIOXt3gT605BX9x5+rh/prT2F1SsNJsU1XuMiP0E2aptW481OnonOGACZWBqseH5Z7csHxhQ==
has-ansi@^2.0.0:
@@ -3714,6 +3761,11 @@ ignore@^5.2.0, ignore@^5.3.1:
resolved "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz"
integrity sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==
+immutable@^4.0.0:
+ version "4.3.6"
+ resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.3.6.tgz#6a05f7858213238e587fb83586ffa3b4b27f0447"
+ integrity sha512-Ju0+lEMyzMVZarkTn/gqRpdqd5dOPaz1mCZ0SH3JV6iFw81PldE/PEB1hWVEA288HPt4WXW8O7AWxB10M+03QQ==
+
import-fresh@^3.2.1:
version "3.3.0"
resolved "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz"
@@ -3786,6 +3838,13 @@ is-binary-path@^1.0.0:
dependencies:
binary-extensions "^1.0.0"
+is-binary-path@~2.1.0:
+ version "2.1.0"
+ resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-2.1.0.tgz#ea1f7f3b80f064236e83470f86c09c254fb45b09"
+ integrity sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==
+ dependencies:
+ binary-extensions "^2.0.0"
+
is-buffer@^1.1.5:
version "1.1.6"
resolved "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz"
@@ -3872,7 +3931,7 @@ is-glob@^2.0.0, is-glob@^2.0.1:
dependencies:
is-extglob "^1.0.0"
-is-glob@^4.0.0, is-glob@^4.0.1, is-glob@^4.0.3:
+is-glob@^4.0.0, is-glob@^4.0.1, is-glob@^4.0.3, is-glob@~4.0.1:
version "4.0.3"
resolved "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz"
integrity sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==
@@ -4088,11 +4147,21 @@ locate-path@^6.0.0:
dependencies:
p-locate "^5.0.0"
+lodash.debounce@^4.0.6:
+ version "4.0.8"
+ resolved "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz"
+ integrity sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==
+
lodash.merge@^4.6.2:
version "4.6.2"
resolved "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz"
integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
+lodash.throttle@^4.0.1:
+ version "4.1.1"
+ resolved "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz"
+ integrity sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==
+
lodash@^4.17.4:
version "4.17.21"
resolved "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz"
@@ -4406,6 +4475,11 @@ normalize-path@^2.0.0, normalize-path@^2.0.1:
dependencies:
remove-trailing-separator "^1.0.1"
+normalize-path@^3.0.0, normalize-path@~3.0.0:
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
+ integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
+
npmlog@^5.0.1:
version "5.0.1"
resolved "https://registry.npmjs.org/npmlog/-/npmlog-5.0.1.tgz"
@@ -4625,7 +4699,7 @@ picocolors@^1.0.0:
resolved "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz"
integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
-picomatch@^2.3.1:
+picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.3.1:
version "2.3.1"
resolved "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz"
integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
@@ -4776,6 +4850,13 @@ react-bootstrap@^2.10.2:
uncontrollable "^7.2.1"
warning "^4.0.3"
+react-collapsed@^4.1.2:
+ version "4.1.2"
+ resolved "https://registry.yarnpkg.com/react-collapsed/-/react-collapsed-4.1.2.tgz#a82e5032eeecc085a05d6ed0be63bbc851f2a517"
+ integrity sha512-vusqVnW/VbFCKJx29KNTnjJrwCbV7k3bB/FiO9/0Fj7JNoNarkU1xU7yK4FZHqPW0Q2izB7o6fYzG16zgdDNMQ==
+ dependencies:
+ tiny-warning "^1.0.3"
+
react-d3-library@^1.0.4:
version "1.1.8"
resolved "https://registry.npmjs.org/react-d3-library/-/react-d3-library-1.1.8.tgz"
@@ -4926,6 +5007,13 @@ readdirp@^2.0.0:
micromatch "^3.1.10"
readable-stream "^2.0.2"
+readdirp@~3.6.0:
+ version "3.6.0"
+ resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7"
+ integrity sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==
+ dependencies:
+ picomatch "^2.2.1"
+
regenerate@^1.2.1:
version "1.4.2"
resolved "https://registry.npmjs.org/regenerate/-/regenerate-1.4.2.tgz"
@@ -5120,6 +5208,15 @@ safe-regex@^1.1.0:
resolved "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz"
integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
+sass@^1.77.6:
+ version "1.77.6"
+ resolved "https://registry.yarnpkg.com/sass/-/sass-1.77.6.tgz#898845c1348078c2e6d1b64f9ee06b3f8bd489e4"
+ integrity sha512-ByXE1oLD79GVq9Ht1PeHWCPMPB8XHpBuz1r85oByKHjZY6qV6rWnQovQzXJXuQ/XyE1Oj3iPk3lo28uzaRA2/Q==
+ dependencies:
+ chokidar ">=3.0.0 <4.0.0"
+ immutable "^4.0.0"
+ source-map-js ">=0.6.2 <2.0.0"
+
scheduler@^0.23.2:
version "0.23.2"
resolved "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz"
@@ -5262,7 +5359,7 @@ source-list-map@~0.1.7:
resolved "https://registry.npmjs.org/source-list-map/-/source-list-map-0.1.8.tgz"
integrity sha512-cabwdhnSNf/tTDMh/DXZXlkeQLvdYT5xfGYBohqHG7wb3bBQrQlHQNWM9NWSOboXXK1zgwz6JzS5e4hZq9vxMw==
-source-map-js@^1.2.0:
+"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.2.0:
version "1.2.0"
resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz"
integrity sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==
@@ -5453,6 +5550,11 @@ tiny-invariant@^1.0.0:
resolved "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz"
integrity sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==
+tiny-warning@^1.0.3:
+ version "1.0.3"
+ resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754"
+ integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==
+
to-arraybuffer@^1.0.0:
version "1.0.1"
resolved "https://registry.npmjs.org/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz"
--
GitLab