Coder Social home page Coder Social logo

colmar's People

Contributors

brianhook1183 avatar

colmar's Issues

Indentation

Watch your indentation when you are nesting, should be 1 tab inside.

<body>
    <div>
         <h3>

and so on

Grid Flex

Colmar/index.html

Lines 89 to 138 in f4bc140

<div class="grid">
<div class="gridbox">
<img src="images/course-software.jpg" alt="">
<div class="gridboxtext">
<h3>Software engineering</h3>
<span>courses</span>
<p>Web Development, Mobile Development, iOT, APIs</p>
</div>
</div>
<div class="gridbox">
<img src="images/course-computer-art.jpg" alt="">
<div class="gridboxtext">
<h3>Computer art</h3>
<span>courses</span>
<p>Imaging & Design, Web Design, <br />Motion Graphics & Visual Effects, Computer Animation</p>
</div>
</div>
<div class="gridbox">
<img src="images/course-design.jpg" alt="">
<div class="gridboxtext">
<h3>Design</h3>
<span>courses</span>
<p>User Experience Design, User Research, Visual Design</p>
</div>
</div>
<div class="gridbox">
<img src="images/course-data.jpg" alt="">
<div class="gridboxtext">
<h3>Data</h3>
<span>courses</span>
<p>Data Science, Big Data, SQL, Data Visualization</p>
</div>
</div>
<div class="gridbox">
<img src="images/course-business.jpg" alt="">
<div class="gridboxtext">
<h3>Business</h3>
<span>courses</span>
<p>Product Development, Business Development, Startup</p>
</div>
</div>
<div class="gridbox">
<img src="images/course-marketing.jpg" alt="">
<div class="gridboxtext">
<h3>Marketing</h3>
<span>courses</span>
<p>Analytics, Content Marketing, Mobile Marketing</p>
</div>
</div>
</div>

Great use of flex in this section, one of the main focal points of the project, I don't know if flex-direction was needed.

DRY Code

DRY or Don't Repeat Yourself Code is when you reuse code blocks so you don't have to type it over and over, basically the idea behind classes. If you look at the spec, sections 1,2 and 4 are the same, 60% on the left, 40% on the right, with a media container on the left. You can make classes and reuse them for this, try it out.

Summary

Meets Expectations

Great job on this project it comes close to spec. This was very well done, the code was very neat and organized which make it easy to read. The only thing I pointed out was the indentation inconsistencies here and there. Great use of flex with proper divs in this project, and keeping your code DRY. Next, try to add a few more pages, maybe a form for sign in, some of the other pages, you can use w3schools.com for forms guide. unsplash.com or freepik.com for images and themeforest.com for web layout ideas. If you make this a full site you can add this as a great portfolio piece. Keep up the good work.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.