Evopark - 1

In this example below you will see how to do a Evopark - 1 with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by cyrilf, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright cyrilf ©

Technologies

  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>Evopark - 1</title>
  
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">

  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <div id="root"></div>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.min.js'></script>

  

    <script  src="js/index.js"></script>




</body>

</html>

/*Downloaded from https://www.codeseek.co/cyrilf/evopark-1-xdPPNP */
@import url('https://fonts.googleapis.com/css?family=Open+Sans');
body {
  margin-top: 50px;
  color: white;
  font-family: 'Open Sans', sans-serif;
  background: #234f79;
}
ul {
  height: 200px;
  width: 300px;
  margin: auto;
  overflow-y: scroll;
  background: #4f8fcc;
  border-radius: 7px;
  border: 1px solid #1d4265;
}
ul li {
  padding: 20px;
  border-bottom: 1px solid white;
}
ul li:last-child {
  border-bottom: none;
}


/*Downloaded from https://www.codeseek.co/cyrilf/evopark-1-xdPPNP */
var List = function List(props) {
  return React.createElement(
    'ul',
    null,
    props.children
  );
};

var EvoparkApp = function EvoparkApp() {
  var parkings = ['Parkhaus Dom', 'Grossgarage Hemmersbach', 'Parkhaus Brückenstraße', 'Parkhaus Augustinerplatz', 'Rheinautiefgarage', 'Rotonda Parkhaus', 'Parkhaus Heumarkt'];

  return React.createElement(
    List,
    null,
    parkings.map(function (parking) {
      return React.createElement(
        'li',
        { key: parking.toString() },
        parking
      );
    })
  );
};

ReactDOM.render(React.createElement(EvoparkApp, null), document.getElementById('root'));

Comments