[00:00:00] Hi welcome back to you in last a separate tax. It's now the archive and it's containing items. So let's start off by signing the newsletter archive itself. We look at our design. Looks like it's going to require a margin of some size so thirty eight point five pixels. So let's just see. MARTIN top thirty eight point five pixels and then want to see what else we need. We need to solve this title here. So let's give a color of color red and then let's say font size is the same pixels font weight should be bold looks like. And given a y height of 23 pixels and of course you need a pretty subtle but it's very similar to the work you see at the top here. So we run out of numbers was going to be one pixel solid E6 66. Okay. No we just give it padding of some value. Let's look at what it is for this for pixel Tsotetsi for pixels that can give us some padding between our board and our actual text so it will look like that. Now that should be good for that one the donor list a bit. This looks like a browser so far so far we're going to have to import this as well. I mean it's us let's say I import slash use her archive. Looking Kinchela check it out in browser now. And yeah we have the sounds we want. Looks pretty dang close to this. Nine identical. That's the font. OK. [00:01:53][112.8]
[00:01:54] I'm going to try copying the final bringing in sieging seeing if it inherits appreciating it is save and see if that changes at all. Okay. It's still nice of family now with style. I started sailing the 200 last year to get rid of those dots to say is margin 0 and then padding 0. Now what. So we have 30 first use your save list style type and say no and now get rid of the dots and then I believe we have to do this. We might have already played this globally. Yeah I think we did. We check in meantime. Yes. You'll see rising margins of your own Hattingh 01 all on our list and we also want to just say with time is 9 because no anger in the. We want this to be nice so we don't even have to put these styles for the list because we know we want them already globally. OK now we want to do this on less style these items so we can do that very quickly. One thing I just noticed is this is about C 16 pixels from the top. So let's give this unordered list a margin 6 team that's just emerging top 16 pixels. That way we can throw it down a bit. Okay that's nice. Now style these these links it's pretty simple. Oh it is kind of like this. So just walking up that change remember that because I don't want to copy it over that seems sketchy. So let's let's start the item now let's just say archive so we we all have a look at kind of distance between them like you see here there is no distance. [00:03:57][122.6]
[00:03:58] So I am sure that it looks like it's 16 pixels similarly to this. And the reason they didn't apply the 16 pixels is all the items on the top is because well I guess I could theoretically just throw this in here and it would work. Yeah that works great actually to do is just say OK this one needs to be and toxic chemicals and then the same margin. All of these iOS 8 margine top wall Margene pixels 0 now will puts 8 on bottom and top but then the top 1 has a default of 16 pixels so that's really the same effect as this. Oh I guess it's slightly different. I wonder why. It's really strange that it is different because with the margin 8 pixels 0 pixels it should apply. Top and Bottom Marjanovic pixels which would give us what we want and think it doesn't. Let's check in here and see what looks good 16 pixels 16 pixels. Yeah I think that should be just the way we have it. If we really want to change it you can do the other method. It's just weird that someone like the title will say the 40 40 40 which we import a dozen or we have made a variable earlier. So let's kill everyone and then the font size was 14 pixels. No line 17 pixels at that time. And clean. Yeah. All those things are good. Now that the D styles so obviously colors color and the family is different. So yeah. Yeah. So it's condensed so let's just copy the family is in good sense condensed which we imported into our next ECMO. [00:06:17][138.8]
[00:06:18] The only time we have access to see a size 13 pixels and finally line 16 pixels. Let's go and say check her out because she's got going on. Okay so that looks like nice but we have this nasty we text you we can get that easily. We did it before. I think all we had to do was say Caulerpa. Well that's what we did. But the last time we did it was it was within a long time. So I guess what we can do is we could try wrapping the day with a wink and see what happens rather than deal with the leak and see if it gives us I think it's great. Now do we want this. However we probably should he it because just so it indicates that as long as they have he has a kind of a rub. So we will do that to see if there's a. No there's not. But we can. So we just wanted to kind of get bigger when we were on it. So and that's the I Am I would clean this up intact. But I just want to quickly see that word and it did so we can clean up effort it needs. OK. Now let's say our title. I'm title. Yeah we will climb scaling will transform. So the transparency on the whole transition is as you're saying. Title and Coldharbour you say transform scale. One point two I want to say one but that's pretty vague and then I would like the font size was also a bit older so it's just a font size. [00:08:28][130.2]
[00:08:29] This whole gray area is just a transition to Transform transform its transform wall transitions completely transition point three seconds. I was thinking these let's say that you are here and test it out. Yeah looks kind of nice but we love that blue link. Change the text decoration to text decoration color to something else. See text decoration color and let's call it that. See the color reminds my work because this is within. Yes definitely. But what we can do is we can say we can get closet or archive here. I'm in the same class name is equal to archive link. And then we'll have to archives here to see your argumentum archive Rappard. I think this work man to it takes decoration color and color when well actually he doesn't have it in here so we can get rid of that season however but it looks like that worked. Yeah but it definitely works. That's nice. I'm just happy that let's get rid of that though head the archive get rid of the class name the rapper wink and then that was actually we still need it. We have the crapper because we need to relive the accelerations and of syntax decoration colored Wiggins's is really just syntax decoration style and we can say nothing and we just fall into that uninteresting text decoration text decoration line. Oh I think it might be white when we discovered that Zebra's is the line OK. Ours too but honestly the line same line tonight works well. That works too. How curious to get rid of that so we don't have to be so close. [00:11:00][150.6]
[00:11:05] So Worksman who's still picking it up as line interesting title because like I'm really curious why those two selectors. Maybe this tech generation. Now obviously the sites that region probably is more like the color of John. So technically you mine probably keeps the color but there is none. Again does doesn't show it art anyway let's let's just get this working now let's get it to Harvard to the right because like a lot of us when we hover over it it's going to last. It's not actually in all of this just that it's scale. So all we have to do is just say in this translucency translate in gets an array of pixels on the x axis and pixels. Let's try that wall. Actually you could probably compute this gave millions the wrong translate x 10 pixels almost perfect probably like 12 would work. I mean if it's Wakey times bigger then we can assume that all it's kind of obvious that the width of the entire item is way too to transfiguring and then we could just say Okay time's that by 122 kernel with no Rover. The difference is that with but not exact but I'm trying to think we don't have an issue with this and just free for you. So if I inspected me who would find out. Not that I'm seeing. Oh I guess it's 161. And then when you said we could just move it over 2 times. It's like if you go one point to 161 times one point to it's 193. So if we move over the difference I think that'll work. It's like 30. You know it doesn't make sense then divided by 2 maybe 31 due to sixteen point one maybe. [00:13:19][133.3]
[00:13:19] I think I'm doing this terribly wrong but we'll see I'm pretty decent. Amitiza. Okay so let's just stick with like 12 X's because that's pretty damn close to 10 pixels was close. Yeah bollox could talk pixels it's real Haline might be going over just a tiny bit too much. Do I know if that's too much Ginal left once put into a lamp by 5. Okay that looks pretty fantastic. Let's now just make sure we're getting the perfectly case so on. There's a little that goes beer maybe beer. Now I see him playing 3 just like this is deeply moving lower tendon. I'm not trying computers. I just feel it. Tech design right. I'll just stick with 1 2 2 5 Tsoukalas like let's when you because it's the little things that eases figures like fancy. And now point five seconds wages are simply too fast for yeah that's pretty nice. I think it looks good. You can change it to pleasing. I think it looks pretty accurate and there's clean air but that's just because of the tags we have here it's really bad. It looks like this color is right to be honest and the tech and down here 0 0 should be the same. Look significantly brighter in my opinion. Like a lot brighter. So he changed the essay on the day it's the color of color red. Which was his passion. The lasers are going to hover over this change in lighter that looks way better. Looks like it's actually the same now. Wow that's curious. Let's just keep it at that. [00:16:05][166.3]
[00:16:06] And if you want to do that you can. It's RGV 218. Maybe looks a little brighter than all of us. He doesn't matter at this point. Let's just move on with the case so we saw our archive. That looks fantastic. We click on it takes us to our item what's come in our code go click and hop into the next deisel status. Get it let's say styled the archive complete list. Archive list art are the newsletter archive components list and contained containing newsletter sic archived patents. OK so we have all styled up. Looking pretty nice. We got a nice little hover animation on it now. This page looks like it's complete. There's obviously things that we might be missing such as the resizing but we can fix that when we get around to the more responsive stuff. We haven't really messed around too much with the images and text here so there's prob there might be caches in there. Now that's looking pretty nice to me. Let's move on it and in the next guy we have a few things we need to silane here we have her added We need to style. We are detail on her newsletter and then we have our letter so we'll do is since the are pretty similar. My goal is that goal what we'll do is we'll just handle the detail in the next guide style. So then we can just knock out these other two real quick. So the next few guys or however many takes we will get through the rest of the newsletter route. [00:18:02][116.3]
[00:18:03] It's how we can silo's and then move on to requests and then we'll pretty much be done with styling and then we'll take we'll take care of permissions and then uploading images correctly and then authentication a little bit more which are all pretty simple things permissions should go really quickly uploading images should go pretty quickly I'm not sure and it will be relatively quickly as well. But these styles are the biggest. Last thing we have to do and basically all the functionalities. So don't you worry about that as much except for the images. So yeah I'm really kind of making this guy go on too long so lets go on the committed code and talking to the next guy. See you then. [00:18:03][0.0]
[1070.8]