diff --git a/src/App/App.css b/src/App/App.css
index e93047a84d898ac361ba9d599f5c596de36e615a..f146a3ed55b2d5618d34214cced536f669a1aa28 100644
--- a/src/App/App.css
+++ b/src/App/App.css
@@ -77,6 +77,14 @@
max-width: 100% !important;
}
+hr{
+ color: var(--text-primary) !important;
+ margin: 0 !important;
+ opacity: 1 !important;
+ height: 5px;
+ border-width: 3px !important;
+ margin-bottom: 10px !important;
+}
/* * * * * * * */
/* * * BODY* * */
@@ -102,6 +110,9 @@ code{
color:black !important;
}
+.doi{
+ color: var(--text-primary) !important;
+}
.codesnippet{
padding-left: 30px;
padding-top: 5px;
@@ -252,7 +263,7 @@ tr:nth-child(odd) {
background-color: #f3f3f3;
}
tr:nth-child(1) {
- background-color: var(--lightblue) !important;
+ background-color: var(--accent-gradient-one-of-three) !important;
}
/* * * * * * * */
@@ -284,7 +295,7 @@ margin-bottom: 10vw !important;
}
.header-title{
- color: var(--text-primary);
+ color: var(--text-primary) !important;
text-align: left;
align-self: flex-start;
padding: 0 30px;
@@ -303,23 +314,25 @@ margin-bottom: 10vw !important;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
- font-size: 5vw;
+ font-size: 15vh;
letter-spacing:0.1em;
-webkit-text-fill-color: transparent;
-webkit-text-stroke-width: 0.3vw;
-webkit-text-stroke-color: var(--accent-primary);
text-shadow:
- 0.4vw 0.4vw var(--mediumpurple),
- 0.8vw 0.8vw var(--offblack);
+ 0.4vw 0.4vw var(--text-primary ),
+ 1vw 1vw var(--offblack);
+}
+.popart-wrapper{
+ min-height: 5vw;
+ margin-bottom: 20px !important;
}
h2{
font-size: 3rem !important;
- -webkit-background-clip: text !important;
- -webkit-text-stroke-width: 2px !important;
- -webkit-text-stroke-color: var(--text-primary) !important;
background-clip: text !important;
- color: transparent !important;
+ color: var(--text-primary) !important;
padding-top: 15px !important;
+ font-weight: bolder !important;
/* background-image: repeating-linear-gradient(-45deg, var(--text-primary) 0, var(--text-primary) 2px, white 2px, white 4px) !important;
*/}
@@ -409,12 +422,12 @@ footer{
background-color: var(--background);
}
footer a {
- color: white;
+ color: var(--ourbeige) !important;
font-weight: bold;
text-decoration: none;
}
footer a:hover {
- color: white;
+ color: var(--accent-gradient-three-of-three) !important;
text-decoration: underline;
}
diff --git a/src/components/header-box.tsx b/src/components/header-box.tsx
index 3c1dd6406fccee1acd5d0d66094632aaecb772d6..717bf50fc1561c011ae4f25aacf5b48c782c0d10 100644
--- a/src/components/header-box.tsx
+++ b/src/components/header-box.tsx
@@ -1,5 +1,7 @@
+import { Hpopart } from "./headings";
+
interface Props{
- title?: string,
+ title: string,
children?: React.ReactNode,
}
@@ -9,7 +11,7 @@ export default function HeaderBox({children, title}: Props ){
<div className="row">
<div className="col header-container">
<div className="header-title">
- {title}
+ <Hpopart text={title}></Hpopart>
</div>
{children}
</div>
diff --git a/src/components/headings.tsx b/src/components/headings.tsx
index a60fbd5268b9d74041ee99f7811ca1c5e484f2e5..2526a6d244aa5fb48c897971274649956f357531 100644
--- a/src/components/headings.tsx
+++ b/src/components/headings.tsx
@@ -99,11 +99,15 @@ export function Hwave({text}:{text: string}){
export function Hpopart({text}:{text: string}){
return(
- <div className="relative">
+ <div className="row">
+ <div className="col">
+ <div className="relative popart-wrapper">
<div className="absolute popart">
{text}
+ </div>
</div>
</div>
+ </div>
)
}
diff --git a/src/contents/description.tsx b/src/contents/description.tsx
index 6b1980ca216d96617be665640568d0dc5005afdf..5f573d1fe03f781f8028276b776e74cc38a04f10 100644
--- a/src/contents/description.tsx
+++ b/src/contents/description.tsx
@@ -1,4 +1,4 @@
-import { H2 } from "../components/headings";
+import { H2, Hhighlight, Hhopp, Hshadone, Hwave } from "../components/headings";
import { Circle } from "../components/Shapes";
import { Complex } from "../components/svgs";
/* import PieChart from './Graph.tsx'; */
diff --git a/src/contents/proof.tsx b/src/contents/proof.tsx
index 734a1dceab75c179fede0bcd2c797016f20fcbb8..2d08103a35deb38a386088269e57164f6d284d63 100644
--- a/src/contents/proof.tsx
+++ b/src/contents/proof.tsx
@@ -6,24 +6,72 @@ export function Proof() {
<h3>Seeding</h3>
<h3>Transfection</h3>
<h3>Microscopy</h3>
+ <table>
+ <tr>
+ <th>Plasmid</th>
+ <th>Expected results</th>
+ <th>Results</th>
+ </tr>
+ <tr>
+ <th></th>
+ <th></th>
+ <th></th>
+ </tr>
+ </table>
</section>
<section id="pos-control-2000">
<h2>Positiv control and optimization</h2>
<h3>Seeding</h3>
<h3>Transfection</h3>
<h3>Microscopy</h3>
+ <table>
+ <tr>
+ <th>Plasmid</th>
+ <th>Expected results</th>
+ <th>Results</th>
+ </tr>
+ <tr>
+ <th></th>
+ <th></th>
+ <th></th>
+ </tr>
+ </table>
</section>
<section id="pos-control-3000">
<h2>Positiv control and optimization</h2>
<h3>Seeding</h3>
<h3>Transfection</h3>
<h3>Microscopy</h3>
+ <table>
+ <tr>
+ <th>Plasmid</th>
+ <th>Expected results</th>
+ <th>Results</th>
+ </tr>
+ <tr>
+ <th></th>
+ <th></th>
+ <th></th>
+ </tr>
+ </table>
</section>
<section id="poc-3000">
<h2>Preliminary test with lipofectamine 2000</h2>
<h3>Seeding</h3>
<h3>Transfection</h3>
<h3>Microscopy</h3>
+ <table>
+ <tr>
+ <th>Plasmid</th>
+ <th>Expected results</th>
+ <th>Results</th>
+ </tr>
+ <tr>
+ <th></th>
+ <th></th>
+ <th></th>
+ </tr>
+ </table>
</section>
</>
);
diff --git a/vite.config.js b/vite.config.js
index cb7a2805876d44cfdf1079482de55853775d17cc..7001068b5f856d283b5df877ec52c8bfa7833b2a 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,43 +1,30 @@
import { defineConfig, loadEnv } from "vite";
import react from "@vitejs/plugin-react";
import { stringToSlug } from "./src/utils";
-import path from 'path';
// https://vitejs.dev/config/
export default () => {
const env = loadEnv("dev", process.cwd());
+ // Sicherstellen, dass die Umgebungsvariable vorhanden ist
if (!env.VITE_TEAM_NAME) {
throw new Error("VITE_TEAM_NAME environment variable is not defined");
}
+ // Debugging-Log, um den Wert der Umgebungsvariable zu überprüfen
+ console.log(`VITE_TEAM_NAME: ${env.VITE_TEAM_NAME}`);
+
const baseSlug = stringToSlug(env.VITE_TEAM_NAME);
- console.log(`Base URL: /${baseSlug}/`);
- console.log(`Output directory: ${path.resolve(__dirname, 'dist')}`);
+ console.log("VITE_TEAM_NAME:", env.VITE_TEAM_NAME); // Debugging-Ausgabe
+ console.log("Base Slug:", baseSlug); // Debugging-Ausgabe
-
return defineConfig({
- base: `/`,
+ base: `/${stringToSlug(env.VITE_TEAM_NAME)}/`,
plugins: [react()],
- resolve: {
- alias: {
- '@': path.resolve(__dirname, './src'), // Simplifies imports
- }
- },
- css: {
- preprocessorOptions: {
- css: {
- //javascriptEnabled: true, // Enable JavaScript in CSS (useful for certain CSS preprocessor plugins)
- }
- } },
build: {
outDir: "dist",
- rollupOptions: {
- output: {
- assetFileNames: `assets/[ext]/[name]-[hash].[ext]`
- }
- }
- },
+ },
publicDir: 'pubpub',
});
+
};