New UI

[stephaniequintana]

This is the working draft of the new interface for the sandbox page of infragram.org.
It is the first PR to be implemented from the Infragram - Full-Screen User Interface project #415 (Planning and Discussion).
Functionality will be added and the UI will be updated as necessary in upcoming PRs.

This PR replaces #417, the code has been updated:

• added infragram2.css
• fixed many responsive issues and cleaned up code (comments, un-used selectors...)

Make sure these boxes are checked before your pull request (PR) is ready to be reviewed and merged. Thanks!

• PR is descriptively titled 📑 and links the original issue above 🔗
• tests pass -- look for a green checkbox ✔️ a few minutes after opening your PR
• code is in uniquely-named feature branch and has no merge conflicts 📁
• screenshots/GIFs are attached 📎 in case of UI updation
• ask @publiclab/reviewers for help, in a comment below

[gitpod-io]

[stephaniequintana]

@jywarren, @TildaDares, @cesswairimu

This is the draft UI that we will use to build upon. All feedback, opinions and suggestions are greatly appreciated. At this point, I do not feel like there is a visual hierarchy to this new UI, but perhaps once we add in steps we can achieve this.

Please let me know if you would like any specific changes before moving forward.

[jywarren]

Hi @stephaniequintana I first tried merging the README changes we did in #419 -- i see that in the list of commits here, those are listed at the top. That means they were made in relation to the main branch from around the time of #259 -- see how they come just before it:

My guess is that since I hadn't merged #419, and those 3 commits aren't squashed into a single commit (which is what happens by default when we merge a PR in GitHub), they were somehow made on top of a non-updated local main branch. I'm not totally sure how all the other commits then got added after that. But the key is that we can fix it pretty easily in a couple ways, and we can avoid it in the future too.

First the fixes -- I think we could either just rebase this over a completely up-to-date version of the main branch, OR we could cherry-pick out the following commits which are your new work:

• adding html file fec23f3
• adding css file f63e5e1
• adding images abb802a
• added another image 3586277
• created new branch for PR merge 78d3997

I'll try a rebase to see how it goes... i remember you said it didn't look easy, but I'll first be sure I have an updated main branch, so we'll see...

[stephaniequintana]

Great, I'm glad you made sense of it for me. I'm on the road right now, but will be able to take a closer look at it this afternoon. Thanks, @jywarren

[jywarren]

So what I found was that in GitPod, I tried checking out the main branch git checkout main, then I ran git pull origin main, but it said it pulled from stephaniequintana/infragram, not publiclab/infragram -- and when I checked recent commits with git log it showed those separate commits that hadn't been squashed:

commit f804c26bcfca34613c5bb45d0a3647a4eaf41811 (HEAD -> main, origin/main, origin/HEAD)
Author: Stephanie Quintana <81270711+stephaniequintana@users.noreply.github.com>
Date:   Thu Jun 16 08:45:36 2022 -0500

    Update README.md
    
    Great addition, @jywarren - this'll come in handy when including them as samples on the sandbox page, too.

commit cc0868c6dda2fe063197f881db957e9df826f915
Author: Stephanie Quintana <81270711+stephaniequintana@users.noreply.github.com>
Date:   Wed Jun 15 04:38:45 2022 -0500

    Update README.md

So what I really want to do is rewind the main branch to get back in sync with the publiclab/infragram main branch. First, I look back in git log results to find the last commit that was also on the publiclab/infragram main branch -- before it went out of sync. I think that's:

commit 13fcd4539f0c40a3366b4884a18ccbcf0ab8124a
Merge: 6094993 ceab311
Author: Tilda Udufo <mathildaudufo@gmail.com>
Date:   Thu Mar 31 17:10:28 2022 +0100

    Merge pull request #290 from daluclemas/patch-2
    
    updated config.yml file as requested in issue #284

I can rewind to that commit with git reset --hard 13fcd4539f0c40a3366b4884a18ccbcf0ab8124a -- a slightly risky command because it discards later commits. But I'm double checking (with git status) that I'm running this on the main branch -- your features in the new-ui branch is still safe.

When i run the reset I then run git pull https://github.com/publiclab/infragram.git main to fetch the latest commits from the publiclab/infragram main branch, so my local is completely in sync with the publiclab/infragram remote. We can check git log, where i see the last commit is from #419 -- all good! Now I can git checkout new-ui and try rebasing again over the latest synced main branch.

And although it's not completely smooth -- i still had to resolve the conflicts in the README manually -- a bit annoying, took a few steps. Maybe I could've run the "skip" command on some of these. But we'll be able to see if any of the README changes went wrong when I open a new PR.

Now it's rebased:

Auto-merging README.md
CONFLICT (content): Merge conflict in README.md
error: could not apply 5f19b08... Update README.md
hint: Resolve all conflicts manually, mark them as resolved with
hint: "git add/rm <conflicted_files>", then run "git rebase --continue".
hint: You can instead skip this commit: run "git rebase --skip".
hint: To abort and get back to the state before "git rebase", run "git rebase --abort".
Could not apply 5f19b08... Update README.md
gitpod /workspace/infragram (new-ui|REBASE 1/10) $ vi README.md 
gitpod /workspace/infragram (new-ui|REBASE 1/10) $ git add README.md 
gitpod /workspace/infragram (new-ui|REBASE 1/10) $ git rebase --continue

OK -- so, looks like it worked but a couple commits somehow persisted in the middle -- i'll try redoing the rebase skipping these.

Added link of tutorial for creating a PULL REQUEST f53ab45
Bump minimist from 1.2.5 to 1.2.6 (publiclab#346)  ddf9819

OK -- that worked -- i just added "drop" to the commits that weren't relevant, during an interactive rebase git rebase -i main.

OK sooooo -- that PR looks great: #426

Now -- how do we avoid this again? Here's the clue -- #419 says: jywarren merged 3 commits into publiclab:main from stephaniequintana:main -- that means, that PR had been made from your local main branch, and you had pushed it up to your remote main branch on the stephaniequintana/infragram fork. That means you were then doing work on top of an out-of-sync main branch -- it had the #419 commits on it.

That's a pretty common issue, it happens to folks all the time. You just have to remember to be opening new PRs from a named feature branch and not your main branch. AND you need to occasionally go into your local main branch and git pull https://github.com/publiclab/infragram.git main to be sure it's up to date. That said, usually as long as your local main branch doesn't have any commits that the root fork (publiclab/infragram), GitHub will just figure it out and you don't need to keep updating your local main.

Sorry for such a long comment, but I hope walking through each step makes sense! Please let me know if there are things you didn't get here and we can dig into it a bit more. I'm going to merge #426 now!

[stephaniequintana]

@jywarren, thank you! Thanks to your explanation, I see where I went awry. I was certain I had set the remote on my main branch to PL's main branch, but this must have gotten out of sync when I forgot to open a new branch for the #419 README.md update. I apologize for the time you had to take for this, but I do have a much stronger grasp on how/why things ended up the way they did and I will stay on top of what I'm doing and from where.

I'm currently working on my planning issues and milestones and hope to be opening the first PR that begins connecting the functions back up soon.

[jywarren]

No worries at all, I'm glad it makes sense! Sounds good and looking forward to what comes next!!

…

On Thu, Jun 23, 2022, 9:44 PM Stephanie Quintana ***@***.***> wrote: @jywarren <https://github.com/jywarren>, thank you! Thanks to your explanation, I see where I went awry. I was certain I had set the remote on my main branch to PL's main branch, but this must have gotten out of sync when I forgot to open a new branch for the #419 <#419> README.md update. I apologize for the time you had to take for this, but I do have a much stronger grasp on how/why things ended up the way they did and I will stay on top of what I'm doing and from where. I'm currently working on my planning issues and milestones and hope to be opening the first PR that begins connecting the functions back up soon. — Reply to this email directly, view it on GitHub <#423 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAAF6J2XKJ6LMFBLTSDRBUTVQSA4FANCNFSM5ZNLCHYA> . You are receiving this because you were mentioned.Message ID: ***@***.***>