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
  • gonve175/tddc88-c4website
1 result
Show changes
Commits on Source (3)
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
This diff is collapsed.
{
"name": "C4-vamsy",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^13.0.0",
"@testing-library/user-event": "^13.2.1",
"@types/jest": "^27.0.1",
"@types/node": "^16.7.13",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"phosphor-react": "^1.4.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"styled-components": "^5.3.5",
"typescript": "^4.4.2",
"web-vitals": "^2.1.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
public/favicon.ico

3.78 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>
public/logo192.png

5.22 KiB

public/logo512.png

9.44 KiB

{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:
.App {
text-align: center;
max-height: 5000vh;
background: radial-gradient(circle at 50% 40%, #1c0328, #260238, #15031e, #160324, #17022a, #030105, #160136, #14013c, #120042, #0d0049);
}
.App-header {
line-height: 2;
font-family: 'Verdana';
font-display: bolder;
color: white;
display: flex;
flex-direction: column;
justify-content: center;
font-size: calc(20px + 2vmin);
font-weight: bolder;
padding: 15px;
letter-spacing: 2.2px;
font-size: 47px;
font-weight: 600;
text-shadow: rgb(148, 7, 7) 0 0, blanchedalmond 0 0;
transition: text-shadow 190ms;
text-shadow: 0px 1px 0px #919191,
1px 1px 1px #919191,
1px 3px 1px #919191,
1px 4px 1px #919191,
1px 1px 1px #919191,
1px 3px 1px #919191,
1px 2px 1px #919191,
1px 3px 1px #919191,
1px 1px 1px #919191,
1px 1px 1px #919191,
1px 18px 6px rgba(11,11,11,0.4),
1px 22px 6px rgba(11,11,11,0.2),
1px 25px 35px rgba(11,11,11,0.2),
1px 20px 20px rgba(11,16,16,0.4);
}
.App-header:hover {
text-shadow: red -3px 0, blue 3px 0;
}
.slogan{
font-weight: 600px;
font-display: bolder;
font-style: italic;
font-size: 25px;
color: white;
}
.about{
font-family: 'Verdana';
font-display: bolder;
color: white;
display: flex;
flex-direction: column;
justify-content: center;
font-size: calc(20px + 2vmin);
font-weight: bold;
padding: 15px;
letter-spacing: 2px;
font-size: 47px;
font-weight: 600;
text-shadow: red 0 0, blanchedalmond 0 0;
transition: text-shadow 190ms;
text-shadow: 0px 1px 0px #919191,
1px 1px 1px #919191,
1px 3px 1px #919191,
1px 4px 1px #919191,
1px 1px 1px #919191,
1px 3px 1px #919191,
1px 3.5px 1px #919191,
1px 3px 1px #919191,
1px 1px 1px #919191,
1px 1px 1px #919191,
1px 18px 6px rgba(11,11,11,0.4),
1px 22px 6px rgba(11,11,11,0.2),
1px 25px 35px rgba(11,11,11,0.2),
1px 20px 20px rgba(11,16,16,0.4);
}
.about-wrapper:hover
{
text-shadow: red -3px 0, blue 3px 0;
}
.cards-wrapper{
display: grid;
grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
grid-template-rows: repeat(auto-fill, minmax(250px, 1fr));
grid-column-gap: 0px;
grid-row-gap: 0px;
margin-top: 50px;
}
footer {
color: whitesmoke;
font-weight: 100;
font-size: 20px;
padding: 7px 10px;
background: rgba(233, 233, 233, 0.816);
}
import React from 'react';
import { render, screen } from '@testing-library/react';
import App from './App';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});
import React from "react";
import "./App.css";
import "./style.css";
import { Phone, Envelope } from "phosphor-react";
function App() {
return (
<div className="App">
<header className="App-header">
RDX Solutions
<header className="slogan">
"Software so good, you'll have to C4 yourself!"
</header>
</header>
<div>
<div className="about"></div>
<header
className="App-header"
style={{
fontSize: "34px",
padding: "10px 50px",
color: "white",
lineHeight: 3.4,
textShadow: " text-shadow: red -3px 0, blue 3px 0;",
}}
>
Meet the team
</header>
{/* Name, Photo and Employee details start here */}
<div className="cards-wrapper">
<div className="card">
<div className="card-image">
<img
src={require("./images/OliviaJacobsson.jpeg")}
alt="Profile"
/>
</div>
<p className="name">Olivia Jacobsson</p>
<p>Manager - P&S</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46733872960{" "}
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" olija587@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/JohannaLundin.jpg")} alt="Profile" />
</div>
<p className="name">Johanna Lundin</p>
<p>Project Manager</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46761918218
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" johlu784@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/JakobSalemyr.jpg")} alt="Profile" />
</div>
<p className="name">Jakob Salemyr</p>
<p>Communication Support</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46707436655
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" jaksa546@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Axel.png")} alt="Profile" />
</div>
<p className="name">Axel Mannerson</p>
<p>Lead Analyst</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46707556983{" "}
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" axema783@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Erik.jpg")} alt="Profile" />
</div>
<p className="name">Erik Kristiansson</p>
<p>Analyst</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" erikr278@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Siri.jpg")} alt="Profile" />
</div>
<p className="name">Siri Selander</p>
<p>Analyst</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46704447278
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" sirse488@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Erika_Hansson.jpg")} alt="Profile" />
</div>
<p className="name">Erika Hansson</p>
<p>Product Manager</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46{""}
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" eriha368@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Dante.jpg")} alt="Profile" />
</div>
<p className="name">Dante Davill Glas</p>
<p>Tester</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46707589120
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" danda691@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Joel.jpg")} alt="Profile" />
</div>
<p className="name">Joel Nilsson</p>
<p>Lead Tester</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46707315944
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" joeni320@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/gustavn.jpg")} alt="Profile" />
</div>
<p className="name">Gustav Nordlander</p>
<p>Tester</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46760242724
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" gusno450@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Vincent.jpeg")} alt="Profile" />
</div>
<p className="name">Vincent Bring</p>
<p>Quality Coordinator</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46737725952
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" vinbr948@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Adam.jpg")} alt="Profile" />
</div>
<p className="name">Adam Åström</p>
<p>R&D Manager</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46738213030
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" adaas672@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Elias.jpg")} alt="Profile" />
</div>
<p className="name">Elias Leijonmarck</p>
<p>Lead Architect</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46762133348
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" elile642@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/AxelE.jpeg")} alt="Profile" />
</div>
<p className="name">Axel Ekblom</p>
<p>Architect</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46738444546
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" axeek668@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/FredrikH.jpg")} alt="Profile" />
</div>
<p className="name">Fredrik Hammarbäck</p>
<p>Development Manager</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46705512556
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" freha662@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Madeleine.jpg")} alt="Profile" />
</div>
<p className="name">Madeleine Jacobson</p>
<p>Process Manager - R&D</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46702878707
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" madja351@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/RickardP.png")} alt="Profile" />
</div>
<p className="name">Rickard Peters</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46730547333
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" ricpe737@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Martin.jpg")} alt="Profile" />
</div>
<p className="name">Martin Hörnberg</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46733952022
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" marho558@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/MagB.jpg")} alt="Profile" />
</div>
<p className="name">Magdalena Bohlin</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46762009226
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{"magbo734@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/vamsy.jpg")} alt="Profile" />
</div>
<p className="name">Vamsy GVS</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46793500700
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email: gonve175@student.liu.se
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/JakobB.jpeg")} alt="Profile" />
</div>
<p className="name">Jakob Berggren</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46739011096
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" jakbe841@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/hugo.jpeg")} alt="Profile" />
</div>
<p className="name">Hugo Björk</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46707232389
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" hugbj806@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/Anton_Nordin.png")} alt="Profile" />
</div>
<p className="name">Anton Nordin</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46738392044
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" antno521@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/AxelJ.jpg")} alt="Profile" />
</div>
<p className="name">Axel Jönsson</p>
<p>Developer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46708880121
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" axejo347@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/oscar.jpg")} alt="Profile" />
</div>
<p className="name">Oscar Erik Josef Söderlund</p>
<p>Technical Writer</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46738517617
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" oscso651@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/gustav.jpeg")} alt="Profile" />
</div>
<p className="name">Gustav Kindgren</p>
<p>Deployment Manager</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46768012360
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" guski416@student.liu.se"}
</h4>
</ul>
</div>
<div className="card">
<div className="card-image">
<img src={require("./images/FilipKindell.jpg")} alt="Profile" />
</div>
<p className="name">Filip Kindell</p>
<p>Integrator</p>
<ul>
<h4 style={{ display: "flex", gap: 10, marginBottom: 10 }}>
<Phone size={20} />
Phone: +46763073289
</h4>
<h4 style={{ display: "flex", gap: 10 }}>
<Envelope size={20} />
Email:{" filki478@student.liu.se"}
</h4>
</ul>
</div>
</div>
</div>
<footer>
<h5>Last Updated &#9201; on 16 September 2022</h5>
<h5>Designed and Developed using ReactJS/CSS. By, Vamsy GVS &#128578;.</h5>
</footer>
</div>
);
}
export default App;
src/images/Adam.jpg

44.2 KiB

src/images/Anton_Nordin.png

925 KiB

src/images/Axel.png

180 KiB

src/images/AxelE.jpeg

2.12 MiB

src/images/AxelJ.jpg

97.4 KiB

src/images/Dante.jpg

1.97 MiB

src/images/Elias.jpg

66.1 KiB

src/images/Erik.jpg

394 KiB