Hi, I want to give another aspect to the user detail page:

• I would like to put the map to the right of the user data, as I show in the screenshot.
• For the structure I want 'user-detail' and 'user map' to be inside the 'inner' div as shown in the screenshot.
• The map and the user's details must have the same height.
• And for smaller screens place user-details and user-map one below the other.
• Reduce the elements of 'user-detail' with vh units for show data at all times for screens bigger than lg.

Requirements:

• Please do not rename or move the files.
• Please just keep the same indentation and nomenclature that is in the whole project (lint, prettir, BEM...)
• Use vh sizes and reduce the size of the text inside 'user-detail__content' and the image 'user-detail__image'.
• For the responsive design use the mixin media -> @include media("lg").
  

If you have any questions, do not doubt to ask

Task

Change the user-button styles to make the mobile version simpler and more compact.

To make this change:

1. Go to the UserButttons.vue file located in the ./src/components/User/ folder.
2. See the CopePen reference styles
3. Update the styles for the media query 'md' (Using the mixin @include media('md') {})

Reference

See the following styles in this link to CopePen, as a reference for a similar result:
https://codepen.io/abxlfazl/pen/VwKzaEm

Screenshots

Current desktop version

Current mobile version

In the view users the street information is not showing well. It looks in json format. I think the API changed because it didn't look like this before.

I need solved as the second screenshot.

To do it create a branch with the name of hotfix/api, I am using git flow.
The command it is:
git flow hotfix start api

There is also another error, when the page reloads stops working.

Thanks!!

BUG DESCRIPTION

When reloading the browser page an error occurs:

1. If you are on the user page, the user data is lost.
2. If you are on the user page and recharge you are redirected to the user page.
   In the browser path you can see how the name of the user you were viewing disappears.

SCREENSHOTS

SOLUTION

I think that in order to fix it, the data obtained should be saved in the Local Storage.

When you scroll down in the user list and click on one the user (more info) the detail user component loads in the middle of the screen.
It is necessary that when loading the component resets the scroll and starts at the top of the page.

In the view users the map is not showing. Ask for the key. How can I display a custom map without a key to test as a developer?

To do it create a branch with the name of hotfix/map, I am using git flow.
The command it is:
git flow hotfix start map

Tasks:

• Create a new component vue called SwitchTheme.
• Create the structure as used in this repo: git-bible
  
• Places the SwitchTheme inside the PageHeader, to the right of the navigation menu.
  
• The SwitchTheme adds a css class is-theme-dark or is-theme-light to the html tag for overwrides the elements of the page.
  
• Overwrite the background-color, color and fill css properties for the dark mode, inside each component

Important

• For the colors use scss variables and scss functions as mix($color-white, $color-brand-1, 90%).
• When finished, execute the command npm run lint to format the code.

Designs

SwitchTheme component

is-theme-light

is-theme-dark

Pages is-theme-dark

Home

Users

User

The svg files in the fonts folder are also being included in the sprite.

Description in this issue:
Create a sprite with the svg from a specific folder #1

Show this commit

Hi! I need help to remove these annoying security alerts on the dependencies.
I would like to upgrade the packages to a stable version.

Security Alerts:

• ansi-regex
• nth-check
• set-value
• ansi-html

Many of these alerts indicate this to me:
⚠ Dependabot cannot update set-value to a non-vulnerable version

I don't know if I should:

1. update the stable version you indicate me, manually in the package-lock.json file.
2. Install it as a dependency so that it appears in the package.json file with npm install.
3. Search for a more stable version of the package or its dependencies.

I appreciate any PR and advice