Marko profile page header responsiveness ( userprofile img, searchbox, connectwallet) #151

markosavicmidusa · 2022-03-06T00:00:52Z

Pull Request Template

Description

Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.

Fixes # (issue)

Type of change

Please delete options that are not relevant.

Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds functionality)
Breaking change (fix or feature that would cause existing functionality to not work as expected)
This change requires a documentation update

How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration

Test A
Test B

Test Configuration(if any):

Firmware version:
Hardware:
Toolchain:
SDK

Checklist:

My code follows the style guidelines of this project
I have performed a self-review of my own code
I have commented my code, particularly in hard-to-understand areas
I have made corresponding changes to the documentation
My changes generate no new warnings
I have added tests that prove my fix is effective or that my feature works
New and existing unit tests pass locally with my changes
Any dependent changes have been merged and published in downstream modules
I have checked my code and corrected any misspellings
-Edited pull request

…site into marko-profile-page-responsiveness

vercel · 2022-03-06T00:00:55Z

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/minorityprogrammers/mpa-webapp/Hg2BAMTUazsZm7qDo4X8APtigoCK
✅ Preview: https://mpa-webapp-git-marko-profile-page-re-fa2046-minorityprogrammers.vercel.app

…ll be called...same functionallity will be called when user clicks with cursor on search icon...(functionallity is added for mobile size screens too)

Ebube111

In my opinion, the search border color should have a normal color or a dim or different color, then when on focus it should have that purple border color (try adding a little bit of transition as well) , or what do you think??
Also, the font looks too large for a search bar of that width
the color of the placeholder looks like text already. try making it gray or something dim

Ebube111 · 2022-03-09T21:03:59Z

components/homepage/HomepageNav.js

+        <div style={{border:"1px solid red"}} className="nav__mobile-profile tw:z-10">
+          <div style={{border:"1px solid red"}} className="nav__mobile-img">


since you're just adding a border and not manipulating the DOM, why not add it to the className instead, or better still use tailwind, so we can stick to classNames. for consistency. WDYT ??

these are my oriantation borders, before I was interducing tailwind...I forgot to delete them

Ebube111 · 2022-03-09T21:05:10Z

components/homepage/HomepageNav.js

+    /*router.push({
      pathname: router.pathname,
      query: { _q: encodeURI(e.target.value) },


Clean up, if commented out code would not be used in the future

markosavicmidusa · 2022-03-13T01:15:35Z

In my opinion, the search border color should have a normal color or a dim or different color, then when on focus it should have that purple border color (try adding a little bit of transition as well) , or what do you think?? Also, the font looks too large for a search bar of that width the color of the placeholder looks like text already. try making it gray or something dim

I think I solved these points...This is a first time using tailwind...
So there was few points where I lost lot of time... and maybe I think only these points were left - unhandled by developer who worked on it ...Example : I need tw-mt-7 (but it doesn't work)...And what is very strange tw-mt-6 , and tw-mt-8 are working....For some reason they don't work, also the some other tw-classes too...
But nevermind...hope for good reviews

Ebube111 · 2022-03-13T11:43:41Z

In my opinion, the search border color should have a normal color or a dim or different color, then when on focus it should have that purple border color (try adding a little bit of transition as well) , or what do you think?? Also, the font looks too large for a search bar of that width the color of the placeholder looks like text already. try making it gray or something dim

I think I solved these points...This is a first time using tailwind... So there was few points where I lost lot of time... and maybe I think only these points were left - unhandled by developer who worked on it ...Example : I need tw-mt-7 (but it doesn't work)...And what is very strange tw-mt-6 , and tw-mt-8 are working....For some reason they don't work, also the some other tw-classes too... But nevermind...hope for good reviews

Yeah thats how tailwind is- tailwind deals with only even-numbers in terms of padding, margin and anything that has to do with numbers, there are no odd numbers

…screen users and desktop users

markosavicmidusa · 2022-03-14T14:51:39Z

Finished:
Centerize connect wallet on mobile screens
Bringing back the old code for search input logic

markosavicmidusa · 2022-03-17T01:18:12Z

Commented the search box-on mobile screens

Marko Savic added 3 commits March 4, 2022 01:27

positioning elements from connect wallet -NavBar

5167573

Merge branch 'main' of https://github.com/MinorityProgrammers/MPA-web…

ad32467

…site into marko-profile-page-responsiveness

changing the margin in user not signed-in

5371d59

adding functionallity onKeyDown, when user hits enter the function wi…

60f7cca

…ll be called...same functionallity will be called when user clicks with cursor on search icon...(functionallity is added for mobile size screens too)

vercel bot deployed to Preview March 8, 2022 22:08 View deployment

Ebube111 self-requested a review March 9, 2022 20:52

Ebube111 reviewed Mar 9, 2022

View reviewed changes

Marko Savic added 6 commits March 11, 2022 00:58

removing orientation borders

9076069

changing the style of the text

31d408b

changing the size of the text

da93488

changing the size of the text

a8b9168

changing the style of the connect button

20789c9

changing teh scale of the nav-bar input, connect-wallet and img.

f58f0e9

vercel bot deployed to Preview March 13, 2022 00:57 View deployment

deleting the orientation-borders

7a4ced0

vercel bot deployed to Preview March 13, 2022 01:05 View deployment

bringing back the old code for search-logic

a11780c

vercel bot deployed to Preview March 14, 2022 14:11 View deployment

connect button styling with small changesin text size between mobile …

b1a2857

…screen users and desktop users

vercel bot deployed to Preview March 14, 2022 14:46 View deployment

commented searchbox input

1761cbb

vercel bot deployed to Preview March 14, 2022 19:44 View deployment

commented the search box on mobile sreens

a625009

vercel bot deployed to Preview March 17, 2022 01:15 View deployment

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Marko profile page header responsiveness ( userprofile img, searchbox, connectwallet) #151

Marko profile page header responsiveness ( userprofile img, searchbox, connectwallet) #151

markosavicmidusa commented Mar 6, 2022 •

edited

Loading

vercel bot commented Mar 6, 2022 •

edited

Loading

Ebube111 left a comment

Ebube111 Mar 9, 2022

markosavicmidusa Mar 13, 2022

markosavicmidusa Mar 13, 2022

Ebube111 Mar 13, 2022

Ebube111 Mar 9, 2022

markosavicmidusa Mar 13, 2022

Ebube111 Mar 13, 2022

markosavicmidusa commented Mar 13, 2022

Ebube111 commented Mar 13, 2022

markosavicmidusa commented Mar 14, 2022

markosavicmidusa commented Mar 17, 2022

		<div style={{border:"1px solid red"}} className="nav__mobile-profile tw:z-10">
		<div style={{border:"1px solid red"}} className="nav__mobile-img">

Marko profile page header responsiveness ( userprofile img, searchbox, connectwallet) #151

Are you sure you want to change the base?

Marko profile page header responsiveness ( userprofile img, searchbox, connectwallet) #151

Conversation

markosavicmidusa commented Mar 6, 2022 • edited Loading

Pull Request Template

Description

Type of change

How Has This Been Tested?

Checklist:

vercel bot commented Mar 6, 2022 • edited Loading

Ebube111 left a comment

Choose a reason for hiding this comment

Ebube111 Mar 9, 2022

Choose a reason for hiding this comment

markosavicmidusa Mar 13, 2022

Choose a reason for hiding this comment

markosavicmidusa Mar 13, 2022

Choose a reason for hiding this comment

Ebube111 Mar 13, 2022

Choose a reason for hiding this comment

Ebube111 Mar 9, 2022

Choose a reason for hiding this comment

markosavicmidusa Mar 13, 2022

Choose a reason for hiding this comment

Ebube111 Mar 13, 2022

Choose a reason for hiding this comment

markosavicmidusa commented Mar 13, 2022

Ebube111 commented Mar 13, 2022

markosavicmidusa commented Mar 14, 2022

markosavicmidusa commented Mar 17, 2022

markosavicmidusa commented Mar 6, 2022 •

edited

Loading

vercel bot commented Mar 6, 2022 •

edited

Loading