diff --git a/README.md b/README.md index 10a92bc..9709ded 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# Bootstrap lab +# Bootstrap lab BUT MY VERSION ## Project 1: Build a responsive cookie store web page diff --git a/css/styles.css b/css/styles.css index 8b13789..0fac9bc 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1 +1,36 @@ +img { + border-radius: 50%; + justify-content: space-between; + display: flex; + white-space: normal; + + } +.background{ + background-size: 800px 600px; +} + + + * { + box-sizing: border-box; + text-align: center; + } + + .col { + float: right; + width: 66.66%; + padding: 5px; + } + /* Clearfix (clear floats) */ + .row row-cols-4::after { + content: ""; + clear: both; + display: table; + } + + /* Responsive layout - makes the three columns stack on top of each other instead of next to each other */ + + @media (min-width: 576px) { + .col { + width: 100%; + } } diff --git a/index.html b/index.html index e2bedec..85a696a 100644 --- a/index.html +++ b/index.html @@ -1,47 +1,93 @@ + + + + + Cookie Store - + + +

Cookie Store

Buy our awesome cookies. All proceeds go to charity!

- +

The Cookies

-

Thin Mint Cookies

-

Tasty mint chocolate cookies

- +
+
+ +
  • +
    +

    Thin Mint Cookies

    +

    Tasty mint chocolate cookies

    + + + +
    +
    • -

    Peanut Butter Cookies

    +
  • +
    +

    Peanut Butter Cookies

    Yummy peanut buttery goodness!

    - - -

    Short Bread Cookies

    -

    Santa's favorite classic.

    - - -

    Smore's Cookies

    -

    Camp fire favorite!

    - - -

    About us

    -
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod -tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, -quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo -consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse -cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non -proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    - -

    Contact us

    -
    - 100 Broadway Avenue,
    - New York, NY 10001
    - (212) 555-1234 + + + +
    +
    • +
  • +
    +

    Short Bread Cookies

    +

    Santa's favorite classic.

    + + + +
    +
    • +
  • +
    +

    Smore's Cookies

    +

    Camp fire favorite!

    + + + +
    +
    • + +
    + +
    + +
    +

    About us

    + Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod + tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, + quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo + consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse + cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non + proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    +
    +
    +

    Contact us

    + 100 Broadway Avenue,
    + New York, NY 10001
    + (212) 555-1234
    +
    + + + + + + diff --git a/project/css/styles.css b/project/css/styles.css new file mode 100644 index 0000000..cebd0d3 --- /dev/null +++ b/project/css/styles.css @@ -0,0 +1,67 @@ +body { + font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; + font-size: 14px; + line-height: 1.42857143; + color: #333; + background-color: #fff; + text-decoration: #4700cc; +} + +.footer { + background-color: #0099cc; + color: #ffffff; + text-align: center; + font-size: 12px; + padding: 15px; + } + + /* For mobile phones: */ +[class*="col-"] { + width: 100%; + } + + @media only screen and (min-width: 600px) { + /* For tablets: */ + .col-s-1 {width: 8.33%;} + .col-s-2 {width: 16.66%;} + .col-s-3 {width: 25%;} + .col-s-4 {width: 33.33%;} + .col-s-5 {width: 41.66%;} + .col-s-6 {width: 50%;} + .col-s-7 {width: 58.33%;} + .col-s-8 {width: 66.66%;} + .col-s-9 {width: 75%;} + .col-s-10 {width: 83.33%;} + .col-s-11 {width: 91.66%;} + .col-s-12 {width: 100%;} + } + @media only screen and (min-width: 768px) { + /* For desktop: */ + .col-1 {width: 8.33%;} + .col-2 {width: 16.66%;} + .col-3 {width: 25%;} + .col-4 {width: 33.33%;} + .col-5 {width: 41.66%;} + .col-6 {width: 50%;} + .col-7 {width: 58.33%;} + .col-8 {width: 66.66%;} + .col-9 {width: 75%;} + .col-10 {width: 83.33%;} + .col-11 {width: 91.66%;} + .col-12 {width: 100%;} + } + + /*.aside { + background-color: #33b5e5; + padding: 15px; + color: #ffffff; + text-align: center; + font-size: 14px; + box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); + }*/ + * { + box-sizing: border-box; + } + .item{ + text-align: justify; + } \ No newline at end of file diff --git a/project/img/Boubacar.jpg b/project/img/Boubacar.jpg new file mode 100644 index 0000000..595f23e Binary files /dev/null and b/project/img/Boubacar.jpg differ diff --git a/project/index.html b/project/index.html new file mode 100644 index 0000000..c3e89bb --- /dev/null +++ b/project/index.html @@ -0,0 +1,158 @@ + + + + + + + + Boubacar Tapsoba's Porfolio + + + + + + + + +
    +
    + +

    Boubacar Tapsoba

    +
    + + +
    + + + +
    +
    +
    + +
    + +
    +

    Presentation

    +

    🍻 Cheers, I am + Boubacar + ,
    + a student at CUNY Lehman College + + , currently living in New York. I + 've worked with + delivery compagny + like + + Grubhub and + + Doordash +

    +
    +
    +
    +
    + +
    +
    +

    EDUCATION

    +

    +

      +
    • Lehman College - City University of New York (CUNY) Bronx, NY + Bachelor of Science in Computer Science
      Expected December 2021 +
      Relevant Coursework: Discrete Structures and Algorithms, C++ Programming, Database + Fundamentals, Java, Data Structures +
      • +
    • University Of Ouaga 2 Burkina Faso +
      License in Macroeconomics and Development Management June 2014 +
      • +
    + + +

    +
    +
    +
    +
    +
    + +
    +
    +

    TECHNICAL SKILLS

    +

    +

      +
    • Programming : C++, HTML, CSS, Python, JavaScript, Java
      • +
    • Technologies : Xcode, Git/GitHub, Eclipse, Linux
      • +
    • PROJECTS + Class Scheduling ,April 2020 +
        +
      • Implemented a webpage in a team of two that schedules sections of courses for + Computer Information Systems department.
        • +
      • Accomplished the project in multiple phases (planning, system analysis and + requirement, system design, development, testing, implementation)
        • +
      • Developed the user interface using HTML, CSS, and PHP to create the scheduling + which + assigns room and time to a section of a course.
        • +
      +
      • +
    + +

    +
    +
    +
    +
    + +
    +
    +

    RELEVANT EXPERIENCE

    +

    + + CUNY Tech Prep New York, NY +
    Fellow, Software Development June 2021 – Present +
    Learn in-demand technologies like React, Node + Express, and PostgreSQL as well as + industry + best practices for design, implementation, and deployment such as MVC, version control with + Git/GitHub, agile & Scrum with Trello and Slack, test driven development, and CI/CD +

    +
    +
    +
    +
    +
    + + + + + + + + + +