Skip to content
OverviewSolutions
17
Comments
18
Mesut Çifci
@mesutcifci

All comments

  • Grady•80
    @grady2002Submitted over 3 years ago

    Please help correct my mistakes if any

    HTML, SCSS, JS

    1
    Mesut Çifci•485
    @mesutcifciPosted over 3 years ago

    Hi Grady Congrats!

    Everything looks good.

    • you can add cursor : pointer property to social media icons.

    • may be you can reduce font-size in mobile view.

    • you should give meaningful class names to html elements. c1 and c2 are not good.

    • if you use it the right way html5 semantic tags are good. I think you used the footer element in the wrong place.

    • instead of placing it under the body, if you want you can place script tag to head section with ```defer```` attribute. If you dont know what is defer just google it.

    • nesting css selectors like this .container .c2 .shift is not best practice. You should avoid this beacuse such use makes it difficult to read code and causes performance problems.

    1
  • YusufWebDev•170
    @YusufWebDevSubmitted over 3 years ago

    im not sure why the background images are not showing up , ive commited this repository twice via github but the background images does not appear.

    i am going attempt this same challenge using css grids.

    as always , i welcome you critique.

    thank you.

    Responsive Hudle Landing Page

    2
    Mesut Çifci•485
    @mesutcifciPosted over 3 years ago

    Hi Yusuf.

    Background images don't loading because the path is wrong. Change path with this url("../images/bg-desktop.svg") and background will show.

    Also you should remove overflow:hidden property from container element.

    0
  • Mesut Çifci•485
    @mesutcifciPosted over 3 years ago

    Hi Mehmet, Congrats!

    Here is some advises to you:

    -Check color, font-weight, font-size of texts. There are different from the original.

    -When i shrink the page , i saw only Supervisor and Calculator cards shrink, maybe you can find better solutions. For idea check my solution click

    1
  • Mesut Çifci•485
    @mesutcifciPosted over 3 years ago

    Hey Adjevise Congrats.

    We have three elements tagged as Fullstack, but when I click on the Fullstack tag I see only two jobs are listed.

    1
  • Mesut Çifci•485
    @mesutcifciPosted over 3 years ago

    Hi mea-cuIpa congrats,

    We have three elements tagged as fullstack, but when I click on the Fullstack tag I see only two jobs are listed.

    0
  • kate•355
    @sunnyandkateSubmitted almost 4 years ago

    I tried a different way to solve this challenge, because I don' t have that much experiences yet in JavaScript. Somehow it does not work on mobile. maybe someone has a solution to this. any other feedback is very welcome

    Job Listings

    1
    Mesut Çifci•485
    @mesutcifciPosted over 3 years ago

    Hey Kate,

    I realized something, click respectively Front-end, HTML and Senior then remove HTML. Normally there is only one job with the senior tag but you will see two job listed.

    0
  • Mesut Çifci•485
    @mesutcifciPosted almost 4 years ago

    Hi Alex Congrats.

    I think you should check width, height and position of background images on mobile view.

    1
  • Mesut Çifci•485
    @mesutcifciPosted almost 4 years ago

    Hi Dilan Congrats!

    Here is some advice for you from me:

    -you should check: font-size, border-radius

    -your phone design looks bigger than original design you should make smaller

    -to fixed broken design of input and button elements write this line of code border 0px or if you want, you can add custom border.

    -open responsive design mode on your browser and look ```1018px`` you will see your images overflow.

    -look 2000px on responsive mode. You will see the phone is stretch. To prevent this you can add max-width property.

    -also if you check mobile design you will see the phone don't shrink

    I know implemented these changes could be hard but if you work hard i think you can develop yourself and design.

    0
  • Mesut Çifci•485
    @mesutcifciPosted almost 4 years ago

    Hi Jibby congrats.

    right: -18% Your layout is overflow beacuse of this line ofcode. To prevent overflow you can add ``` overflow-x: hidden`` to html element. Also maybe you can think another approach of positioning background images.

    1
  • Emre•40
    @emrecirakogluSubmitted almost 4 years ago

    My first challenge and I'm waiting feedbacks.

    Profile Card

    1
    Mesut Çifci•485
    @mesutcifciPosted almost 4 years ago

    Hi Emre congrats!

    -I think you should check background images on desktop version design. It is overlapping each others.

    -If you get stuck to keep position of background images you can create another elements and you can set position of elements to absolute. Then you can set background image to these elements. Finally if you set width and height of these element with relative unit e.g percentage, vh, vw the background images keeps their positions and If you shrink the screen, the background images will also shrink.

    0
  • Raj Mhatre•215
    @RajMhatre20Submitted almost 4 years ago

    In the "stay productive" section how can I change the color of SVG on hover?. Also is there any better way to change the SVG color on hover other than which I used?. Feedback on form validation is also welcomed

    Site using HTML, CSS and JavaScript

    2
    Mesut Çifci•485
    @mesutcifciPosted almost 4 years ago

    Hey, Raj

    Can you examine my solution? I think you will find answer there.

    If you don't understand the solution, please ping me. I explain.

    1
  • Mesut Çifci•485
    @mesutcifciPosted almost 4 years ago

    Hey Thanh, Congrats!

    I have some advices to you:

    -Could you check bg-pattern-desktop is too big than original design

    -I realize when i click arrow the illustrations also moved maybe you can prevent this

    -When i shrink screen, question section overlap on illustraions maybe you can check responsive design again(for see overlaping you can look 1010px wide)

    -on mobile design maybe you can change border-radius

    1