search

macs300 / Agency-Portal-Home-Page-Feedback

Agency Portal Home Page
1 stars 0 forks source link

CSS Report #1

Open macs300 opened 5 years ago

macs300 commented 5 years ago

@1024px: Margin-top on logo is incorrect. Items aren't in-line. Current:

Screenshot 2019-06-19 at 16 43 33

Update to:

Screenshot 2019-06-19 at 16 43 22

@990px: Mobile Menu icon isn't showing below 990px. Current:

Screenshot 2019-06-19 at 16 45 37

Update to:

Screenshot 2019-06-19 at 16 45 20

@650px: Current:

Screenshot 2019-06-19 at 16 49 59

Update to:

Screenshot 2019-06-19 at 16 50 07

@500px: Current:

Screenshot 2019-06-19 at 16 53 01

Update to:

Screenshot 2019-06-19 at 16 53 15
macs300 commented 5 years ago

Please pay attention to making the Logo, "Agency Portal", navlinks, and buttons all in-line.

300-michael commented 5 years ago

Someone has changed the code from what I had wrote. The line in: display.scss:12 .d-none { display:none!important} should not exist, this is preventing the mobile icon button from being displayed when the width is decreased.

300-michael commented 5 years ago

You have also left out the mobile menu pane code 

<div class="mobile-menu d-none d-t-block mobile-menu--active">
  <div class="container">
    <div class="mobile-menu__logo">
        <img class="menu__logo-img" src="assets/img/APIMG/img_icon_ap.png">
    </div>
    <button type="button" class="mobile-menu__close">
      <span><i class="mdi mdi-close" aria-hidden="true"></i></span></button>
    <nav class="mobile-menu__wrapper">
      <ul class="mobile-menu__ul">
        <li class="mobile-menu__li"><a href="#" class="link link--dark-gray link--gray-active">Home</a></li>
        <li class="mobile-menu__li"><a href="02_features.html" class="link link--dark-gray">Features</a></li>
        <li class="mobile-menu__li"><a href="03_pricing.html" class="link link--dark-gray">Pricing</a></li>
        <li class="mobile-menu__li"><a href="04_resources.html" class="link link--dark-gray">Resources</a></li>
        <li class="mobile-menu__li"><a href="#" class="link link--dark-gray">Contact</a></li>
        <li class="mobile-menu__li"><a href="https://www.agencyportal.co.uk/agency/register" class="btn-nav__mobile btn-nav-blue site-btn site-btn--green">Sign up</a></li>
        <li class="mobile-menu__li"><a href="https://www.agencyportal.co.uk/agency/login" class="btn-nav__mobile btn-nav-blue site-btn site-btn--accent">Log in</a></li>
      </ul>
    </nav>
  </div>
</div>
300-michael commented 5 years ago

Don't forget to put the appropriate links in the tags for the buttons/links, for Home, Features, Pricing, Resources, Contact, Sign up and Log in.

shancasperon commented 5 years ago

This has been completed

300-michael commented 5 years ago

Only the links being highlighted and being in-line have been completed. You haven't paid attention to this functioning properly like in the original code:

MENU

@media screen and (max-width: 500px) MAX-WIDTH not min-width left = live website, right = our code

.menu {padding-top:60px;} @media screen and (max-width: 500px) {{.menu{padding-top:10px;}} @media screen and (max-width: 500px) {{button.menu__mobile-button {margin-top: 0px;}}

Screenshot 2019-07-01 at 09 32 44

below 800px the mobile button shows on top of the Sign up and Log in Buttons.

Screenshot 2019-07-01 at 09 49 01 Screenshot 2019-07-01 at 09 48 52

at 900px + the Sign up and Log in Buttons go below the Agency Portal logo please fix this so they are always on the right side of the page links

Screenshot 2019-07-01 at 09 17 25
300-michael commented 5 years ago

There has been no progress on this for almost 3 weeks, these changes are only CSS issues and should have been fixed already.