These are chat archives for FreeCodeCamp/Help

25th
Jan 2019
Randell Dawson
@RandellDawson
Jan 25 01:08
So I have a navigation bar which looks something like this. I have two problems which I need assistance on. First, if I mouse over the li element, I want the background color to change for the entire vertical area above and below the link text instead of just the background of the link text. Second, I want the App Title to be centered on the page, just as the Centered Text is. I think I am close, but obviously missing something about flex-box probably. I anyone can give me a point in the right direction, that would be great A hint is fine.
Christopher McCormack
@cmccormack
Jan 25 01:30
@RandellDawson I did the first question here by letting the anchor padding do the work of filling the space
Randell Dawson
@RandellDawson
Jan 25 01:32
@cmccormack What if I wanted to make the link text color on mouseover along with changing the background color?
Christopher McCormack
@cmccormack
Jan 25 01:33
do both in the a:hover selector?
apparently I did some of that with JS for some reason, probably due to theming
Christopher McCormack
@cmccormack
Jan 25 01:46
@RandellDawson for the second, I was able to get it centered by changing it from h1 to span and adding this class to it:
.title {
  font-size: 2rem;
  position: absolute;
  left: 50%;
  transform: translate(-50%);
}
Randell Dawson
@RandellDawson
Jan 25 01:52
@cmccormack OK, thanks.
Putting the final touches on the Dashboard app ui.
I think it will look ok now.
abraham anak agung
@padunk
Jan 25 01:55
@RandellDawson I hate refactoring, so i forked your pen, here is the final touch
Christopher McCormack
@cmccormack
Jan 25 01:58
@padunk nice
@RandellDawson may want to trim the image a bit so it doesn't have padding at the bottom
hmm it's an SVG nm
abraham anak agung
@padunk
Jan 25 02:01
@cmccormack :thumbsup:
Learn animations is hard :smile:
Randell Dawson
@RandellDawson
Jan 25 02:01
@cmccormack Once we get it up running, you can clean it up more.
Christopher McCormack
@cmccormack
Jan 25 02:01
yeah I bet
@RandellDawson yay
Randell Dawson
@RandellDawson
Jan 25 02:01
Should be in the next day or so.
Christopher McCormack
@cmccormack
Jan 25 02:01
hehe
Randell Dawson
@RandellDawson
Jan 25 02:01
UI is not my expertise.
Richard
@rylew0925
Jan 25 05:52
In the "Basic CSS: Understand Absolute versus Relative Units" lesson, how does em increase the padding instead of the font size of the text?
Am I in the wrong chat room?
Yashwardhan Pauranik
@yashwp
Jan 25 06:21
May Kittens Devour Your Soul
@diomed
Jan 25 09:17
@rylew0925 it's simple. reason is - because you add that value to padding property, and not to font :smiley:
and you're not in the wrong room. not your fault rooms are so inactive these days
[it's like you'd say - ok lets increase space between] . I think lesson shows that em is just a measure, which can be applied to various things, such as padding in this case.
Parth Nayak
@ParthCodeDev
Jan 25 09:22
Hello all
May Kittens Devour Your Soul
@diomed
Jan 25 09:28
hello human @ParthCodeDev
Parth Nayak
@ParthCodeDev
Jan 25 09:40
HaHaha.. Why your name is too long
psyperl
@psyperl
Jan 25 10:08
test
hello world
May Kittens Devour Your Soul
@diomed
Jan 25 12:36
let us not forget a great wisdom
BuntyBru
@BuntyBru
Jan 25 13:32
loan_id {
order:4
},
bucket_type{
order:5
},
product_type{
order:3
},
I need to sort the above objects based on their order key
psyperl
@psyperl
Jan 25 14:17
that doesn't look like a common js data structure
BuntyBru
@BuntyBru
Jan 25 14:49
@psyperl
its a very big object
And it was supposed to be sorted at the backend
but what can you do
i have kind of solved it
I wish i was doing things at backend
psyperl
@psyperl
Jan 25 15:17
yeah sorting and mapping is a structure sensitive operation so it's difficult without knowing the original data structure
you can try sorting directly using the keypath to that property
Richard
@rylew0925
Jan 25 17:29
@diomed Thanks