From de8f12d74faef5fa3f9e38d1340948cab2d06ea3 Mon Sep 17 00:00:00 2001 From: Georgios Andreadis Date: Wed, 1 Jul 2020 13:33:31 +0200 Subject: Manually generate IDs --- frontend/src/components/home/ContactSection.js | 122 ++++++++++----------- frontend/src/components/home/ContactSection.sass | 20 ++-- frontend/src/components/home/ContentSection.js | 26 ++--- frontend/src/components/home/ContentSection.sass | 10 +- frontend/src/components/home/IntroSection.js | 72 ++++++------ frontend/src/components/home/JumbotronHeader.js | 34 +++--- frontend/src/components/home/JumbotronHeader.sass | 32 +++--- frontend/src/components/home/ModelingSection.js | 42 +++---- frontend/src/components/home/ScreenshotSection.js | 58 +++++----- .../src/components/home/ScreenshotSection.sass | 8 +- frontend/src/components/home/SimulationSection.js | 44 ++++---- frontend/src/components/home/StakeholderSection.js | 72 ++++++------ frontend/src/components/home/TeamSection.js | 101 ++++++++--------- .../src/components/home/TechnologiesSection.js | 50 ++++----- 14 files changed, 346 insertions(+), 345 deletions(-) (limited to 'frontend/src/components/home') diff --git a/frontend/src/components/home/ContactSection.js b/frontend/src/components/home/ContactSection.js index f6c9c5d8..1ac2202c 100644 --- a/frontend/src/components/home/ContactSection.js +++ b/frontend/src/components/home/ContactSection.js @@ -1,64 +1,64 @@ -import React from "react"; -import FontAwesome from "react-fontawesome"; -import "./ContactSection.css"; -import ContentSection from "./ContentSection"; +import React from 'react' +import FontAwesome from 'react-fontawesome' +import './ContactSection.css' +import ContentSection from './ContentSection' const ContactSection = () => ( - -
-
- - -
- atlarge-research/opendc - -
-
- - - -
-
-
- TU Delft -
-
-
-
- A project by the   - - @Large Research Group - . -
-
-
-
- -
- OpenDC is an experimental tool. Your data may get lost, overwritten, or - otherwise become unavailable. -
- The OpenDC authors should in no way be liable in the event this happens - (see our{" "} - - - license - - ). Sorry for the inconvenience. -
-
- -); + +
+
+ + + + +
+
+ TU Delft +
+
+
+
+ A project by the   + + @Large Research Group + . +
+
+
+
+ +
+ OpenDC is an experimental tool. Your data may get lost, overwritten, or + otherwise become unavailable. +
+ The OpenDC authors should in no way be liable in the event this happens + (see our{' '} + + + license + + ). Sorry for the inconvenience. +
+
+ +) -export default ContactSection; +export default ContactSection diff --git a/frontend/src/components/home/ContactSection.sass b/frontend/src/components/home/ContactSection.sass index 2cde7391..997f8d98 100644 --- a/frontend/src/components/home/ContactSection.sass +++ b/frontend/src/components/home/ContactSection.sass @@ -1,15 +1,15 @@ .contact-section - background-color: #444 - color: #ddd - - a + background-color: #444 color: #ddd - a:hover - color: #fff + a + color: #ddd + + a:hover + color: #fff - .tudelft-icon - height: 100px + .tudelft-icon + height: 100px - .disclaimer - color: #cccccc + .disclaimer + color: #cccccc diff --git a/frontend/src/components/home/ContentSection.js b/frontend/src/components/home/ContentSection.js index 2e24ee10..ba2e4ec3 100644 --- a/frontend/src/components/home/ContentSection.js +++ b/frontend/src/components/home/ContentSection.js @@ -1,19 +1,19 @@ -import classNames from "classnames"; -import PropTypes from "prop-types"; -import React from "react"; -import "./ContentSection.css"; +import classNames from 'classnames' +import PropTypes from 'prop-types' +import React from 'react' +import './ContentSection.css' const ContentSection = ({ name, title, children }) => ( -
-
-

{title}

- {children} +
+
+

{title}

+ {children} +
-
-); +) ContentSection.propTypes = { - name: PropTypes.string.isRequired -}; + name: PropTypes.string.isRequired, +} -export default ContentSection; +export default ContentSection diff --git a/frontend/src/components/home/ContentSection.sass b/frontend/src/components/home/ContentSection.sass index 67541179..a4c8bd66 100644 --- a/frontend/src/components/home/ContentSection.sass +++ b/frontend/src/components/home/ContentSection.sass @@ -1,9 +1,9 @@ @import ../../style-globals/_variables.sass .content-section - padding-top: 50px - padding-bottom: 100px - text-align: center + padding-top: 50px + padding-bottom: 150px + text-align: center - h1 - margin-bottom: 30px + h1 + margin-bottom: 30px diff --git a/frontend/src/components/home/IntroSection.js b/frontend/src/components/home/IntroSection.js index 59f5face..a799272a 100644 --- a/frontend/src/components/home/IntroSection.js +++ b/frontend/src/components/home/IntroSection.js @@ -1,40 +1,40 @@ -import React from "react"; +import React from 'react' const IntroSection = () => ( -
-
-
-
-

The datacenter (DC) industry...

-
    -
  • Is worth over $15 bn, and growing
  • -
  • Has many hard-to-grasp concepts
  • -
  • Needs to become accessible to many
  • -
+
+
+
+
+

The datacenter (DC) industry...

+
    +
  • Is worth over $15 bn, and growing
  • +
  • Has many hard-to-grasp concepts
  • +
  • Needs to become accessible to many
  • +
+
+ +
+

OpenDC provides...

+
    +
  • Collaborative online DC modeling
  • +
  • Diverse and effective DC simulation
  • +
  • Exploratory DC performance feedback
  • +
+
+
- -
-

OpenDC provides...

-
    -
  • Collaborative online DC modeling
  • -
  • Diverse and effective DC simulation
  • -
  • Exploratory DC performance feedback
  • -
-
-
-
-
-); + +) -export default IntroSection; +export default IntroSection diff --git a/frontend/src/components/home/JumbotronHeader.js b/frontend/src/components/home/JumbotronHeader.js index 8a5312b3..d519e840 100644 --- a/frontend/src/components/home/JumbotronHeader.js +++ b/frontend/src/components/home/JumbotronHeader.js @@ -1,20 +1,20 @@ -import React from "react"; -import "./JumbotronHeader.css"; +import React from 'react' +import './JumbotronHeader.css' const JumbotronHeader = () => ( -
-
-
-

- OpenDC -

-

- Collaborative Datacenter Simulation and Exploration for Everybody -

- OpenDC -
-
-
-); +
+
+
+

+ OpenDC +

+

+ Collaborative Datacenter Simulation and Exploration for Everybody +

+ OpenDC +
+
+
+) -export default JumbotronHeader; +export default JumbotronHeader diff --git a/frontend/src/components/home/JumbotronHeader.sass b/frontend/src/components/home/JumbotronHeader.sass index b88b79f7..1b6a89fd 100644 --- a/frontend/src/components/home/JumbotronHeader.sass +++ b/frontend/src/components/home/JumbotronHeader.sass @@ -1,24 +1,24 @@ .jumbotron-header - background: #00A6D6 + background: #00A6D6 .jumbotron - background-color: inherit - margin-bottom: 0 + background-color: inherit + margin-bottom: 0 - padding-top: 120px - padding-bottom: 120px + padding-top: 120px + padding-bottom: 120px - img - max-width: 110px + img + max-width: 110px - h1 - color: #fff - font-size: 4.5em + h1 + color: #fff + font-size: 4.5em - .dc - color: #fff - font-weight: bold + .dc + color: #fff + font-weight: bold - .lead - color: #fff - font-size: 1.4em + .lead + color: #fff + font-size: 1.4em diff --git a/frontend/src/components/home/ModelingSection.js b/frontend/src/components/home/ModelingSection.js index 17834b0b..cdbb5a44 100644 --- a/frontend/src/components/home/ModelingSection.js +++ b/frontend/src/components/home/ModelingSection.js @@ -1,24 +1,24 @@ -import React from "react"; -import ScreenshotSection from "./ScreenshotSection"; +import React from 'react' +import ScreenshotSection from './ScreenshotSection' const ModelingSection = () => ( - -

Collaboratively...

-
    -
  • Model DC layout, and room locations and types
  • -
  • Place racks in rooms and nodes in racks
  • -
  • - Add real-world CPU, GPU, memory, storage and network units to each node -
  • -
  • Select from diverse scheduling policies
  • -
-
-); + +

Collaboratively...

+
    +
  • Model DC layout, and room locations and types
  • +
  • Place racks in rooms and nodes in racks
  • +
  • + Add real-world CPU, GPU, memory, storage and network units to each node +
  • +
  • Select from diverse scheduling policies
  • +
+
+) -export default ModelingSection; +export default ModelingSection diff --git a/frontend/src/components/home/ScreenshotSection.js b/frontend/src/components/home/ScreenshotSection.js index 42b8ac77..fdb55020 100644 --- a/frontend/src/components/home/ScreenshotSection.js +++ b/frontend/src/components/home/ScreenshotSection.js @@ -1,32 +1,32 @@ -import classNames from "classnames"; -import React from "react"; -import ContentSection from "./ContentSection"; -import "./ScreenshotSection.css"; +import classNames from 'classnames' +import React from 'react' +import ContentSection from './ContentSection' +import './ScreenshotSection.css' const ScreenshotSection = ({ - name, - title, - imageUrl, - caption, - imageIsRight, - children -}) => ( - -
-
- {children} -
-
- {caption} -
{caption}
-
-
-
-); + name, + title, + imageUrl, + caption, + imageIsRight, + children, + }) => ( + +
+
+ {children} +
+
+ {caption}/ +
{caption}
+
+
+
+) -export default ScreenshotSection; +export default ScreenshotSection diff --git a/frontend/src/components/home/ScreenshotSection.sass b/frontend/src/components/home/ScreenshotSection.sass index a349ad48..2f454cb4 100644 --- a/frontend/src/components/home/ScreenshotSection.sass +++ b/frontend/src/components/home/ScreenshotSection.sass @@ -1,5 +1,5 @@ .screenshot - outline: 2px black solid - padding-left: 0 - padding-right: 0 - margin-bottom: 5px + outline: 2px black solid + padding-left: 0 + padding-right: 0 + margin-bottom: 5px diff --git a/frontend/src/components/home/SimulationSection.js b/frontend/src/components/home/SimulationSection.js index 3961e549..0fa21c34 100644 --- a/frontend/src/components/home/SimulationSection.js +++ b/frontend/src/components/home/SimulationSection.js @@ -1,25 +1,25 @@ -import React from "react"; -import ScreenshotSection from "./ScreenshotSection"; +import React from 'react' +import ScreenshotSection from './ScreenshotSection' const ModelingSection = () => ( - -

Working with OpenDC:

-
    -
  • Seamlessly switch between construction and simulation modes
  • -
  • - Choose one of several predefined workloads (Big Data, Bag of Tasks, - Hadoop, etc.) -
  • -
  • Play, pause, and skip around the informative simulation timeline
  • -
  • Visualize and demo live
  • -
-
-); + +

Working with OpenDC:

+
    +
  • Seamlessly switch between construction and simulation modes
  • +
  • + Choose one of several predefined workloads (Big Data, Bag of Tasks, + Hadoop, etc.) +
  • +
  • Play, pause, and skip around the informative simulation timeline
  • +
  • Visualize and demo live
  • +
+
+) -export default ModelingSection; +export default ModelingSection diff --git a/frontend/src/components/home/StakeholderSection.js b/frontend/src/components/home/StakeholderSection.js index 6d25fd86..e547ebe0 100644 --- a/frontend/src/components/home/StakeholderSection.js +++ b/frontend/src/components/home/StakeholderSection.js @@ -1,42 +1,42 @@ -import React from "react"; -import ContentSection from "./ContentSection"; +import React from 'react' +import ContentSection from './ContentSection' const Stakeholder = ({ name, title, subtitle }) => ( -
- {title} -
-

{title}

-

{subtitle}

+
+ {title} +
+

{title}

+

{subtitle}

+
-
-); +) const StakeholderSection = () => ( - -
- - - - - -
-
-); + +
+ + + + + +
+
+) -export default StakeholderSection; +export default StakeholderSection diff --git a/frontend/src/components/home/TeamSection.js b/frontend/src/components/home/TeamSection.js index b86655b4..2b7bb69d 100644 --- a/frontend/src/components/home/TeamSection.js +++ b/frontend/src/components/home/TeamSection.js @@ -1,56 +1,57 @@ -import React from "react"; -import ContentSection from "./ContentSection"; +import React from 'react' +import ContentSection from './ContentSection' const TeamMember = ({ photoId, name, description }) => ( -
- {name} -
-

{name}

-
{description}
+
+ {name} +
+

{name}

+
{description}
+
-
-); +) const TeamSection = () => ( - -
- - - - -
-
- See{" "} - - atlarge.science/opendc - {" "} - for the full team! -
-
-); + +
+ + + + +
+
+ See{' '} + + atlarge.science/opendc + {' '} + for the full team! +
+
+) -export default TeamSection; +export default TeamSection diff --git a/frontend/src/components/home/TechnologiesSection.js b/frontend/src/components/home/TechnologiesSection.js index fdcfc522..13d8ca02 100644 --- a/frontend/src/components/home/TechnologiesSection.js +++ b/frontend/src/components/home/TechnologiesSection.js @@ -1,42 +1,42 @@ -import React from "react"; -import FontAwesome from "react-fontawesome"; -import ContentSection from "./ContentSection"; +import React from 'react' +import FontAwesome from 'react-fontawesome' +import ContentSection from './ContentSection' const TechnologiesSection = () => ( - -
    -
  • + +
      +
    • - + Browser - JavaScript, React, Redux, Konva -
    • -
    • + JavaScript, React, Redux, Konva +
    • +
    • - + Server - + Python, Flask, FlaskSocketIO, OpenAPI -
    • -
    • +
    • +
    • - + Database - MariaDB -
    • -
    • + MariaDB +
    • +
    • - + Simulator - Kotlin -
    • -
    -
    -); + Kotlin +
  • +
+
+) -export default TechnologiesSection; +export default TechnologiesSection -- cgit v1.2.3