Oxygen 3.7 Released and Some Speculation

[Music] [Music] foreign [Music] [Music] [Music] [Music] [Music] [Music] uh let's see what about now hey everybody hopefully i fixed it now everybody's blown up no sound thank you guys i changed up my setup here as you can probably tell and oh my gosh my chair is creaking like crazy um i changed my setup here so i am trying this overlay thing thank you guys for uh tossing this in hey everybody so good to see you avalon super stoked to see you welcome in glad to have all you guys this is awesome and really excited about this so obviously the point of this stream is oxygen 3.7 has released today officially and so i'm pretty stoked about that hopefully you guys are too there's a lot of really cool stuff so we'll briefly talk about that i wanted to bring up a couple of points and then we had a pretty cryptic post in the facebook group from somebody special to the oxygen community and so we'll cover that as well before i get started i wanted to mention that this is something i've wanted to do for a while kind of have like news and sort of update streams and more like discussion focused stuff so if you guys enjoy this definitely let me know and i'm new to this so obviously as you saw i messed up the intro with the mic and whatnot but here we are so uh if you haven't seen it yet oxygen 3.7 has officially dropped today which is pretty exciting so of course we get css grid many of you are probably familiar with that already especially if you've seen the other videos that i've done um i released one on css grid the day it came out at least in beta and um or well i guess it was alpha back then but the it was really exciting and so i made a video that day and it feels like forever ago that that actually dropped um so avalon i'm glad it's not just me and you're a professional at this you have a huge audience so you have more at stake i guess um but yeah so so 3.7 came out at least in the alpha state what it feels like forever ago in fact i made some notes over here so i'm going to pull those up real quick um so well i actually made a note of when it officially released which is today which is kind of silly so that doesn't really help us but i basically wanted to um you know just just walk through what 3.7 means for me at least and also for you guys and then some cool stuff which i think ray says thank you for all the wonderful oxygen tutorials you're so welcome really appreciate it uh last time i had people donate in the chat which is pretty amazing so if you guys are feeling generous you're welcome to do that but obviously no pressure appreciate it very much um so basically what we have is 3.7 brings us grid and composite elements now the composite elements if you're not familiar are super cool because what they allow you to do is uh get updates from oxygen without actually having an oxygen release for new elements so you guys have seen the video on the mega menu that i did account drop down was another one um there's a bunch of them out there so we can take a look at those in fact i have the page pulled up right here so composite elements obviously is all of these different things but what's so cool about this to me is that you don't have to wait for a full oxygen release for them to come out so that's going to be pretty sweet and i think we're going to see a lot more of this coming now one thing that's really interesting and i don't know if you guys noticed this is it's actually a subscription so let me see if i can find it um it is let's see where is the pricing i guess it's maybe under the get it now tab i was looking for like a pricing button like there is on every oh wow 504 here so i bet i bet the oxygen website is getting absolutely hammered right now with um with people trying to get the latest download so let's see real quick if i can get to it i bet i bet elijah is watching let's see oh yeah there he is right there elijah says we already have several other new composites in the works that's super exciting i figured you guys would have a lot of that coming so what's really interesting to me about the composite elements is that it's actually a 29 a year add-on so for all of us prior to 3.7 releasing that bought it i guess it was the rc one you get the composite elements included like they always promised and then they did tell us that you were going to essentially not get the composite elements included after that date so what's cool about this to me is hopefully it will silence some of the critic oh i can't i can't show you guys what am i doing i'm so bad at this i'm trying to use this new stream deck and how do i share my desktop here this is what i meant so this is what i wanted you guys to see so as you can see on your screen here basically the composite elements are an annual subscription of 29 so not that bad but hopefully it will silence some of the critics that were always harping on about oxygen not having any kind of recurring subscription how can they possibly sustain themselves so this is a little bit of silence to them finally so with that the composite elements for all of us like i said before it's included and now you're going to have to pay that additional fee but what that means for me is that or at least from my perspective is that they're going to be adding more to this so clearly this is a popular edition and they're going to be doing a lot more of this and with that um they the post that i saw in the facebook group was actually from lewis so if you guys aren't familiar luis is the ceo of sofly the parent company of oxygen and also the parent company of wp all import and um he was around a lot in the facebook group and stuff you know basically early in the oxygen 2.0 days he was really um really kind of the face of of everything back then and then elijah kind of took over and then he post this just a few days ago so february 19th so four days ago he says we're looking to hire a builder element designer so this is super interesting and this to me tells me that they're investing heavily in what's going to come in you know the future composite element updates so he wants very specific stuff and i know just based on the way that he runs his businesses and just kind of the vibe he puts out he's going to expect the absolute best of the best and that to me is really fantastic so i think what we're going to see is a lot of amazing composite elements coming especially if they're bringing somebody on just to design those because it specifically says right here designing the elements using whatever you want basically so figma sketch etc and then it says right here our development team would then turn these elements into html and css that the users of our website builder could add to their websites so they're looking for somebody that's exceptional in design but doesn't necessarily have to have the coding chops to convert that into a you know a functioning piece of code which is pretty amazing because if they can come up with the concept then you know the oxygen team behind the scenes can make that code you know turn into a fully functional element so that to me is insanely exciting because there's just a million possibilities so before we go down that rabbit hole i wanted to quickly mention how long it's taken them to get oxygen 3.7 out and that to me also tells there's a bunch of stuff going on behind the scenes so if i pull up my notes real quick here so oxygen 3.4 came out july 3rd so then let's see just a few weeks later in august 3.5 came out and then basically 60 days later in november 3.6 came out and then we've been silent now for about four months four to five months and 3.7 has come out so what's so exciting about that to me is that that says that there's a lot of um you know a lot of stuff coming behind the scenes so i'm pretty stoked about that les says sounds like a job for jonathan uh i have a feeling that there's gonna be a lot of stuff coming that i'm gonna need to make videos on and want to make videos on of course so that's really exciting now of course i already mentioned grid came out composite elements have been out for a while we've kind of played with that but this is a really interesting post so i hope you guys are intrigued with this and i've kind of gone ahead and made a list of some of the things that i feel like we might see in the future so i went ahead and pulled up some of the most common uh wordpress themes on themeforest to kind of see some of the stuff that they have and so i was really interested in things like galleries sliders um things like especially for woocommerce meta information customization so like if we let me pull up something here i'm gonna find like a shop page so uh product page we'll go overview oh no i'm just trying to find something here so we can actually look at this yeah so like this isn't the best looking theme ever but if we were able to customize more of woocommerce like your add to cart and quantity selectors and those sorts of things like if those become more individual elements or more customizable that would be pretty cool that may not end up as a composite element and may just end up as a core addition later on but the point remains that if they're looking for somebody to design this stuff i have to suspect it's either going to end up in a design set or composite element or something to that effect so not really too sure how that would work but that's just an idea that i had product quick view modals is another thing i wrote down so a bunch of these things from aveda i started to look through and think man that would be some cool stuff here so like there was a quick view i forget where i saw it i wish i had saved it now but basically you know if you're looking at like a category page quick view let's see where did it go i know i saw it on this exact website quick oh there it is right here so product quick view so basically like you know you have a little pop-up model maybe that's possible now i haven't really tried to be honest but the idea would be that you could just stick a i don't know maybe like a short code or maybe have some sort of like pop-up container that would appear on your product archive page which would be pretty cool another thing they could possibly include would be live search so having like a better search functionality because right now you either have to use the default wordpress search which is super basic and super limiting as many of you know but if there was some sort of more comprehensive search functionality like if you could tie it in with a repeater and kind of change your query in connection with that that might be pretty cool you can do a lot of stuff with the default wordpress search and the oxygen repeater but there are limitations to it so that was something i was thinking maybe they would do something with search so we talked about the quick view here previous and next navigation so over here on aveda if we look at let's see next page this is something that you would see on a lot of popular blogs but basically you would have like the previous and next pagination for like blog posts or like multi-page articles i guess that would work as well but like at the bottom of the blog post it would say continue reading or like next up would be maybe like the next oldest post or maybe the newest post so something like that would be super cool again some of this stuff has already been achieved and people have used custom code implementations to get this in their sites but if you could realistically just have that out of the box and it were a composite element then it's not bloating up core by any means and you also have that right out of the box so that would be pretty cool now another one would be tool tips so i have added this in the material design light design set that i've released but that's another set of code that you have to pull from google and tool tips would be pretty cool because it allows you a lot of flexibility these ones right here are super basic they're just simple tool tips on like a text element but in the oxygen implementation i'm sure they would make it extremely flexible so you could basically trigger a tool tip on anything and probably make it pop up on anything which would be pretty cool um i mentioned galleries and sliders i kind of went quickly over that what i mean with those is if they added things like better sliders for like product archives um it's let me go back over here i think i saw or maybe it was on the flatsome page let's see it was where was it um i guess i lost it i was looking for like a product slider that i saw earlier which basically had multiple products at the bottom of the page after you got to the end i can't remember exactly where it went but you know if you're like on an ecommerce website you get to the bottom and it says more products like this instead of it being like a static three blocks it could you know continuously swipe through which i guess maybe you could do with the dynamic slider right now but that to me is a little clunky because it uses the um swiper.js which i mean it works but it's just it's a little bit difficult especially if you're not familiar with the javascript like me it's it's like possible to piecemeal it together but it's just not really the most comprehensive thing in the world um so avalon i knew you'd be after all these kind of like woocommerce stuff so pop-up modal for products would be fantastic especially if you could do kind of like the quick view compare you know you see those in other wordpress themes where you can compare multiple products if you could have it in a pop-up or maybe like if you added them to some sort of favorites and a pop-up and then you could go sort of look at them uh in one particular spot that would be really cool um i would love to hear what you guys would be interested in williams says search and filtering so yeah that's actually one i didn't think of so right now you have um either facet wp which is you know it works but it's a little clunky and then of course you also have um you have wp grid builder so that one works it's a fair bit more flexible than fast wp and i have a video on that on the channel as well but i still think there is room for a filtering plug-in that works in the oxygen way and actually i guess if it's a composite element it wouldn't even be a plug-in but i think that that would be a really useful addition would be search and filtering uh let's see i'm gonna look in chat real quick here so yeah i am not good at design at all i am not a designer by any means so all of you guys that love the design of that website that i did for avalon she was the one that designed it we just turned it into a functioning website for her so i have to give her all the credit on the design there um so that's a that's a good point william he says the additions like facet wp and grid builder in particular are super expensive so i'm not sure what the technical kind of implementation would look like for a filtering plug-in but based on the fact that oxygen already has the repeater which essentially will do the the custom query for you maybe there's a way for them to tie that in that would be pretty cool i didn't think about filtering now i think that this release is really interesting because i already mentioned this just briefly but i want to go back to what i said in terms of the release times so we saw about one month between well i guess it's nearly two so about two months and then august september november then just shy of two months and then they were quiet for almost four months so there was a pretty big jump we were seeing about two months for every full release and then it was double that it was four months for 3.7 to come out so it just makes me wonder like what else is going on behind the scenes that we don't know about and never will know about until the day that it's released i'm really interested to hear and i think for me personally i don't know about for all of you like the reason why there's a lack of woocommerce content on my channel is just because i don't feel at this point like oxygen has exactly the right fit of what i need in terms of customization for woocommerce yes it's totally viable and you do have a lot more customization than a typical theme but it just doesn't feel like oxygen enough to me if that makes any sense i don't know if you guys feel that way but in terms of it being like sort of fully fleshed out in the same way i don't think i would agree with that so avalon's raising their hands in chat like i mean it's it's totally viable but if you're trying to run like a fully featured ecommerce store it just doesn't quite seem like the perfect solution now with that said i will cut you guys in on a secret which is that i'm gonna try out a video on uh creating a printful woocommerce store so printful is like a drop shipping print service and i'm gonna see if that works and you know just play with that a bit so hopefully you guys would be interested in that video but um yeah so anyway let's see what else so in my notes here i already mentioned woocommerce galleries and sliders um hooks is something that i guess needs to be addressed as well because there's a lot of woocommerce hooks but you can already implement those with like code snippets better search product quick we already looked at that previous index so really i mean the possibilities are wide open and i'm just totally speculating about what they could add in the composite elements library but to me that's what's so cool about this is that they they're like totally flexible so we don't have to wait for full releases those composite elements will just pop up and we'll just get them one day which is pretty exciting so drop in chat which you guys are interested in i am definitely uh i am definitely interested in your input you know what do you guys want to see what do you feel like is missing from oxygen that would need to be added avalon says you made the dream a reality you dreamt it we just pressed the right buttons to make it happen for you i'm just so happy that it worked now i really find this post so interesting like from from louis j1 mtv asks can we make our own composite elements um i don't think so i could be mistaken i'm pretty sure that it's not like a like a thing that you can tap into necessarily because it's essentially from what i understand composite elements are essentially just a design set so it's almost like it's a design set that's baked into the ad panel so that then the oxygen team can just add stuff into it and it just automatically populates for you so there's elijah in there he says nope i didn't think that was the case and elijah correct me if i'm wrong on that uh whether or not it's considered a design set it's like i think that it's just basically a design set that's not down there in the design sets tab now one thing i was going to mention let's see what happened to my oxygen install here so i wanted to go get an oxygen real quick and take a look at one thing that i don't like about the composite elements and i wish that there was a control for this too so this is a bit unrelated to 3.7 but once i get an oxygen here i want to i want to show you guys what i'm talking about so i don't know about for you but most of the time i click add and i immediately start typing so text is frustrating because sometimes i just want a regular text element so if i type in t e x then text link is right there so i come over here to click on text but if i type in the t to finish the word of course it didn't do it i'm trying to get it to basically swap spots t e x t why is it not doing it now it's making me a liar so often i go to type text and then i go to click what i think is the proper one the text and it switches to text element but anyway the more specific example that i'm after here is with the composite elements if i type an re oh i don't have composite elements what am i doing here oh yeah yeah yeah short code well i gotta go activate my license um i'm gonna take my oxygen window over here real quick so i can get my license as always i love you guys but i don't want to share my license even though it's unlimited all right so download oxygen settings i might actually already have the uh license on this screen here let's go to license invalid copy that bad boy um license submit all right so this is a good actual like a good um test here because i don't think i have to input the composite element library key since i have the license from before but we will find out here pretty shortly waiting for it to load come on there we go all right so let me move this back over here and then i'm going to go back into oxygen so hopefully you guys kind of understand what i'm after here i am basically just trying to get it to uh do that like incorrect typing on search so with the composite element hopefully this works yeah there we go so we have the composite elements now if i type in re for repeater it brings up review box i'm like no that's not what i wanted so you guys know me i go way too fast so i'm like ari boom review box not what i wanted so then i gotta delete that and then you know add my repeater pretty much the biggest first world problem there could ever be but i do wish there was a way i could like just drag that over and i understand it's like sorted in such a way but i don't quite have that so elijah said short code if i type in short yeah so if i guess it's shortcode space makes it change to shortcode wrapper but if i just type in like sh yeah there we go so if i type in sh i want a short code not a shortcode wrapper anyway that's my that's my biggest complaint of the day hopefully you guys can echo that sentiment and maybe they will configure a way for us to adjust that left-hand sidebar a little bit that would be great uh andrew mentions hydrogen shortcut yes you're totally right that's just a habit of mine because even with hydrogen i still find myself using the add panel and doing things manually just because i've done it for two years without hydrogen so it's a hard habit to break john says why is rev before rep not alphabetical that is a good question it's also the same thing with like these containers so if it was alphabetical what i guess you would think it would be columns then div and then section but if you could just reorganize that that'd be kind of cool or like show and hide elements like if you're not going to use stuff maybe you could collapse it into its own panel something like that that would be kind of nice so i mean realistically i've covered all what i wanted to discuss with 3.7 the main things is that we have css grid officially now which is amazing so all of you guys that were waiting you can definitely put it on your live sites and take advantage of it then we also have our composite elements and then this cryptic post from lewis i find absolutely fascinating so if you guys didn't see this it's really really interesting to me because again like i've already said i think it's going to bring some pretty fantastic designs we're going to see some super cool stuff obviously in the oxygen way we're pretty much not going to know about it until it already shows up but i think it will be really really cool whenever it does come now if you guys want i can uh walk through doing css grid on the on you know the oxygen install that we have set up before we close out here and i guess i might as well just go ahead and do that so it's been a bit since i've done this let me go back over here to wordpress and we're going to use the faker press plugin to install some fake posts i'm going to toss in 18 of them and then what we're going to do is use lauren pixum as our image provider lauren pixum and then that'll be good so we'll just do some of these posts real quick get those added to our site and then we'll play with the css grid let's actually go back to themeforest real quick and see if we can find like a magazine layout that we can try to replicate so i did this in a video before but i wasn't as familiar with grid back then and also there was a few few less controls at that point so let's see i'm just going to open up a few of these guys and we'll take a look and see if we can find something that looks decent so this one is an interesting layout uh this one is also pretty cool that one is neat there's a bunch of them with the power of css grid means you can pretty much do any of these layouts actually this one's pretty cool this one is fairly unique so let's try to replicate this now my images aren't going to be the right size uh so j1m asked what was the speculation so my speculation is all of the stuff that's about to come in composite elements so i just rambled off a few things that i would like to see a lot of woocommerce related stuff like galleries and sliders meta info customization product quick view modal stuff like that then i also mentioned better search than previous and next navigation for like your archive templates so if somebody is or not your archive templates your singular post templates for instance if somebody's reading a post they get to the end then you can add the previous and next buttons to keep them you know continuing reading a lot of that stuff you can already add with custom code and people have created solutions for it but if it's baked into oxygen i just think that will be really awesome so what i want to do is recreate this real quick so we have our posts in there we have 18 of them and what i want to do here is just go to like my posts template i'm just going to call this blog archive and then i don't really care about the master template we're just going to go actually this is going to be our singular post so we want to go other blog post index publish this bad boy and then open with oxygen so we're going to try to replicate that layout let's take a look real quick at what they've done so i'm going to use hoverify real quick so inspect this guy and see if there's anything special here so i imagine this isn't a dynamic layout to be honest probably not yeah i don't think it is okay so moving back over here let's add in a section we're going to go to repeater and then it should pull in our permanent link is not available for current post archive make sure the parameter has archive for the post to set the true what did i do wrong why did i why did i mess that up doo doo doo post oh it's because i checked the post type box whoopsie all right so update edit with that see these are the things you guys wouldn't see in a typical video i would have i would have gone backward redone that and edited that part out uh but there is i do have an interest in doing some of this stuff live so you can kind of see some of the things that i run what did i what am i doing wrong here hmm see even your whatever i'm just going to go custom post is this going to work probably not because the templates messed up oh my gosh so let's just go post post and then i'm going to take off blog post index it might be because i don't have a page set in my wordpress settings and once again that would be typically not something that you guys would see because i would edit that out but i have had people tell me a lot of times that they do want to see the mistakes and that would make me go a bit slower so sometimes people request that as well but in any case here we go so now in our example we have basically the featured image we have the title and then the minutes red that would be another thing that would be a composite element i know that exists in oxy extras the like you know read time component but again that could be implemented as a composite element for sure also a favorites or read it later so you can see there read it later is kind of interesting that would be a cool one to have i have been considering what to do for favorites for a long time there's one plugin out there that is super basic but it does work but if it was implemented in the oxygen way i keep saying that i think it would be really really cool all right so anyway let's move over here and we're going to add in let's just use a div as our background so we're going to go featured image size will be large and then let's see how tall these are so hoverify inspect so it's 370 tall so let's just use like a minimum height for now so min height is going to be 370 and then it was like 240 or something i think oh no height minimum width was like 240 i believe 275 so we'll do that so 275 and then for some reason that background image didn't pull in our featured image maybe this particular post doesn't have one uh yeah william i think i saw that that alex would be the one applying to that that would be pretty cool the plugin i'm using for inspect is called hoverify so if you go look on my channel there's another video on that where i walk you through a specific tour on that and uh it's pretty cool it's got a lot of really really cool features so i won't go into that now but it does basically make a better version of the chrome inspect tool really really flexible and has a lot of cool stuff so um what i'm going to do here for whatever reason my template is not quite working the way i want it to i'm going to actually just switch over to a page and that way i can sort of reliably set up this repeater i don't know exactly why it's not working and i don't want to keep you guys waiting watching essentially nothing so let's delete this section we're going to go section and repeater and then let's set this query to post we have our post there we go i think we're on to something now so i'm going to go div set the background to the featured image here is this going to work now yes it is all right so now we go taylor what's up dude happy to see you guys here all right so we're going to set this div to min height of i forget what it was now 340 and 270 is what i'm going to do and oh maybe i need to do it on that image min height 370 240 and then let's go to background we're going to set it to cover and we're going to go left 50 top 50 and then here in the example we have basically a small like vertical two a super wide one so what is this going to be like one two three rows basically so let's go to repeater grid layout enable grid we're gonna go to column count i think that's going to be a four wide column count like that right yep i think so and then minimum width is already set gap is 20. let's bring that down to like five and then our gap here we're also going to do five um the composite element library keys should be in your oxygen account i would believe i don't know hopefully elijah's still here and he can shed some light on that so now what we're going to do is for our child span here that one is going to be 1 1 and then our third one here we're going to go column span of 2 and then i think we want row span of two elijah says yeah you don't need a key if you got composite elements for free so that would basically be before release candidate one dropped if i'm not mistaken correct me on that too so then this bottom one there we have that as basically a two wide guy so column span would be two and then let's see so our third our third div there how do we make that guy wider i guess i need to change my widths here from defined to like a hundred percent so width would be one hundred percent and i need to do the same thing on my background div here i guess i don't actually need a background div in this case because we have that overlay so let's go 100 and then minimum height we do need to keep that so like 240 so minimum height 240 that's too small 370 i think is more like what it was and then maybe these are actually going to be a row of 2 and this one is going to be 1. so let's go back to our repeater our grid layout here this guy is going to be row span of one these ones are going to be two i believe so this isn't exactly it um row span of one let's see anthony says i have agency license where do i get composite license so i need to deactivate and reactivate honestly not entirely sure elijah said yes anyone with agency equivalent license prior to february 12th gets composite elements when they activate their license normally yeah so for me all i had to do was stick my oxygen license key in i left the composite blank and then composite shows up which is perfect so taylor says working on a custom favorites events dashboard system using acf that is sweet events is something i get asked about all the time ray says i would like tool set repeater support to the level that the acf repeater has yeah there's quite a few people out there that ask for tool set but i don't really know all that much about it i've never spent any time with it just because acf works so well now do i need to take off the minimum height and then how would i define the height maybe you would have to do it based on your image so here those are too high do we need to set a minimum height of whatever this is so like 190 minimum height and then how do i make those two taller i guess i could use the grid here and we can go will row span three do anything row span three and then that one would be row span three oh that basically achieved the same thing so the problem here is that i need these to be taller so do you have to use css for that or am i just doing this wrong a bunch of a bunch of chat going on here about pods and tool set and acf they definitely there isn't any integration with pods or toolset as far as i'm aware andrew says i'm doing some interesting things with your restaurant menu repeater wonder how grid could be utilized yeah you could make some interesting layouts with pretty much anything with grid that restaurant menu video i've been meaning to update for a while because i think it would be cool if it was like you know if it looked better so i need to go back and redo that john says make the first two too high the third one is three yep i think you're right let me go back here two two and three and then that one the row span of three first two photo column and last one one i'm getting some help here in chat i don't quite understand shibu says first two and then column three and last one one sorry don't know what that means i don't quite understand i'm definitely interested in what i'm doing wrong though because like what i want oh maybe i need to change this height to 100 percent instead of a minimum height that's my problem i bet yeah yep yep yep yep yep there we go so then do i still need a minimum height i think i do so minimum height of two four there we go there we go closer yeah so well actually no we're not we're we're a bit closer i guess hey stratos good to see you man uh sheba says first two photo column height three and then like this oh elijah says it can be super confusing with an implicit grid so is that the auto function elijah explicit column span and row span so what if you set using the ratios example you css ratio one to one for those top left images uh stratos to answer your question what am i trying to do i'm trying to build this layout here and play with css grid more i thought this one was kind of interesting because we have sort of what i'm considering like a too high you know image on the left right here um and then this small one down here is actually that's that's the tricky part in this case so i am open to suggestions anybody that can share how to achieve this layout i am uh interested to hear so let's see all i need to do is get these taller and make this one smaller so what am i doing wrong first row two columns i'm going to delete these a bit because i've confused myself now with all these numbers so i'm going to go oops yeah actually let's reset this so this is these two are good this one needs to be a column span of two like that and then it should be a row span of 2 and then this one is a column span of 2. that's i mean that's almost it but it needs to be a row span of one right and then wouldn't that mean that this one needs to be a row span of three and then these need to be a row span of two oh no that gets us to exactly the same point i just don't understand how i can make these two taller and this one basically half of its height you know first photo row span two isn't that it is not what i have right here bigger one is three there's a bunch of chat messages here [Laughter] um maybe reduce rows yeah possibly so so this is the original stratos so i'm envisioning this as basically three blocks yeah i feel like it should work i i think this is pretty close to how it should be so it would be like one and then two and then three so it should be a row span of three should it not last photo span one um so here isn't that is that what it is i'm not sure what am i doing wrong elijah elijah come save the day dude so it seems like it seems like it's just a problem with this with this one here because in the back end in the back end oh is it to do with the fact that i set height at 100 percent well no because i have to have that for that right hand side minimum height is 240. 240. elijah says i just sent you a demo using explicit uh do to do oh let's see let's see if i can get this pulled up real quick here i appreciate all you guys chiming in to help this is pretty cool explicit rows is the key here he says oh all right so let's take a look at this so grid set to column count of four there's a jet going by so hopefully you guys can hear me so explicit count of four okay okay so grid explicit row count of four and then go back here so row span of three row span of four row span three row span three and that one's four and then this one here is columns band 2 and then no row span right uh what did i do wrong so there's no width defined on those is it something to do with the fact that i have a width and a height set on these set the min height and max height for your rows as well oh so min height 100 what what's that the minute where do i set that elijah rose setting up midnight 100 max1 from his yeah do like 100 pixels min height and one fr max height 100 pixel min height and one for wow how fancy huh okay so now why is it so stretched what did i do wrong here is it my rose band yay it only took me how long has this been i don't know 20 minutes more than i anticipated but it works um you have a lot of elements returned oh yeah i do so would i just change my repeater query count to i don't know i'm not sure exactly we have six let's just do that real quick so one two three four is all we need right three four yeah so let's just change this to post per page four and then yeah the background images are set to cover go back to initial 4x3 layout and then this one we don't need i guess that's an extra guy there the only thing i'm confused about is why it's so tall oh remove my minimum settings we go wow how incredible yeah so that that does the trick isn't that essentially what we have over here oh wait this one we have that right there yep yeah carol franchise french differentially okay so then the only other thing that we would need to make it somewhat realistic is basically some padding yeah that was a community effort so really appreciate all you guys chiming in there see this is the kind of thing that i would have gone through before off camera i would have basically figured it all out and then gone back and done it again so appreciate all you guys helping there matt i appreciate you hanging out i know this is probably like watching a i don't know try to repair a car um so the only other thing we have was like the heading so it's probably i guess it was probably like i don't know h2 or something and then it was white and obviously way way smaller than that so then we would go 20 pixels and make this bottom and maybe go center and then i don't think we need 20 pixels of padding 25 is too much let's go like eight or something like that and then insert data post title bam yeah i know i have a lot of people um i know i have a lot of uh people who say they like watching the live stuff but it's really interesting because for me personally i prefer watching like a really polished video which is why i typically release really polished things but if you guys like this kind of stuff i will definitely do more of them i said way earlier on in the stream that i've been considering setting up a printful like drop shipping woocommerce store i played around with a little a little bit but haven't done that much with it but i thought about doing that live so if you guys want to see that i will definitely um i will definitely do that strata says no center for the title you are correct so it is a left align and not center now the only other thing is the the like heading over here is bigger and there's also a hover effect so i don't know exactly how you would stick that in this one there i'm assuming maybe you could do that with css and target like in child third right that would be the way that you do it um so while says seeing the not so polished stuff helps us know the mistakes as well as avoiding yeah totally sometimes it makes it extremely long taylor says uh merch you know i've thought about that but i don't know i i want to make like a mug and a hat and that kind of stuff elijah says get into that in child css jonathan you're right yeah because i think can't you realistically use chrome inspect and then on that div you basically could just be like copy selector and then what is that output for us oh no not quite i was thinking it would do it for you but i guess maybe not in this case what about on the oxygen side or have i saved this yet i wanted to see real quick does this spit out the nth selector for you if i go copy selector no not quite look at some of the wacky stuff we did with our easy post preset yeah yeah that's a good place to start so um the hover effects here we have just an underline on that heading which is pretty basic and then that little favorites thing pops up so you could basically just have an icon there that has an opacity of zero and then on hover it transitions to 100 with that kind of mouse over effect which is pretty cool and then um this one is essentially the same thing but just larger so i think that would just be in child third if i'm not mistaken so let's see i think i've missed some of this stuff in chat williams says yeah it's cool to learn from mistakes as well you can find the fixes easier yep you're definitely right i'm into the idea of that firefox has the best dev tools for grid yeah probably so i would imagine that is the case so um i don't know if you guys want me to keep going we can get this hover effect so if you want me to keep going let me know i ain't got nowhere to be so if you guys want to keep hanging out we can i shouldn't be presumptuous because there could totally be some ladies in here so if you are at elijah i mean uh avalon if you're still here do you guys plan on let's see andrew asks elijah do you guys plan on bringing back the ability to limit posts on easy posts and not have any pagination killing me with the requirement to do manual query good question i don't know i pretty much don't ever use uh the easy posts so a bunch of people saying yes please let's keep going strata says non-stop six more hours you know i think the the longest stream i've done up to this point is exactly three hours and my voice and like my brain are just completely dead after that um so i don't think i could go much longer than three hours but maybe in maybe in chunks over the course of a few days so let's see here also if you guys hear my stomach grumbling i apologize in advance but hopefully not all right so everybody's saying keep going so let's do it now what i want to do is this hover effect so this is just looks like a one pixel hover we have that icon that changes to the gold let's use hoverify real quick to figure out what color that's switching to so if i use hoverify i can just copy this gold color elijah's elijah says live food review get lunch and create content uh quite honestly i certainly could because i usually walk to the kitchen and i come back and sit right back down and i'm like one-handed trying to like type and move the mouse and stuff all right so they're calling this the bookmark class which is a pretty good idea and then let me look at this heading here so on hover it says it changes on hover which it definitely doesn't so i'm going to ignore that and then we'll just go back over here to our heading the font isn't the same but that's okay so let's see uh navi says sometimes i have needed to use the easy post over the repeater because isotope doesn't really play as nice with the repeater gotcha yeah that makes sense all right so what we're going to do here is first of all i'm going to add a class called ps transition which we don't really need to add a class in this case because it's the repeater but i'm just going to do it anyway so we're going to go to effect transition will be 0.2 ease and actually yes we do need to add a class because we're going to have that same transition effect for the border and also on that icon so uh what we're going to do now is on the heading we're going to go to hover border bottom we're going to set it to white one pixel solid and then in this case this heading has a taller line height so if we just set that to one it's going to compress it to be a lot closer to the actual bottom of the text kind of like it is in the example um have you strata says have you tested the composite elements yet i've played with them quite a bit i don't know if you're referring to me or somebody else in chat but i have played with them a decent bit does repeater still have the problem with pagination i switched to easy post because of that uh good question i don't know i don't think it's that bad if it does have a problem so now what i'm going to do is on my heading here i'm going to wrap this guy with a div and then our icon i don't remember exactly what it was there's another example of when you're typing something that used to be really quick i would go ic and hit enter and then the icon button is now in the way instead of the actual icon element so small little small little annoyance there not that big of a deal set this to white we're going to make it super small and then i'm assuming it's called like favorite uh what would that thing be called what is it over here i forget i said it and then i forgot bookmark book there yeah there it is bookmark all right so then we will set this div to horizontal middle align for some reason it's super tall what did i do wrong why is it got that crazy hover effect i wonder if it does it on the front end let's go see oh i bet i i bet i set the uh line height on the heading on the hover state i sure did so get rid of the line height on the hover state and put it back on the original side whoopsie daisy so there we go now we have that effect and then i also need to go back to the original state and i'm going to set the border to white oh not on all not on all whoops that's not what i meant to do we're going to go to bottom white set that to 1 and solid so we don't have that jump or sorry not white we're going to set it to zero percent opacity white so we don't have that jump effect so now the border will pop up and our heading won't jump by one pixel like that so then i think our icon is still way bigger than it is on the example we're going to set it to like 15 pixels what is it actually on this one here it's 12. so kind of small and then it's got a padding on the left side of two so icon padding two and then it looks like there's a slight bit of line height underneath that there's like a little bit of spacing it's just ever so slightly off but maybe it's because of that border so i'm going to set a bottom opaque border of one i don't know if this is going to work but it should make it line up yeah i think that's good i think that's about good all right so then what else happens on hover so we have the icon doesn't appear until you hover in that whole div or somewhere actually this entire div that's pretty interesting so what we're going to need to do is take this icon go fancy icon i'm going to stick in a code block we're going to go well basically let's stick our icon selector in there and then we're going to go to let's see our repeater go to dynamic list so dynamic list and then i am not the greatest with css so i apologize in advance if i'm doing this wrong so fancy icon it's gonna be hover i believe and then color will be white right like that is this going to work oh if i spell hover correctly that would help so then we need to go to our icon and we're going to set this on the original state to effects opacity will be zero and then i'm going to add our transition class so ps transition and then nope i am wrong what did i do is it that guy i always have to do this i'm such a noob and you guys are watching it in real time do i have to add a class to it oops dynamic list hover or else do i need to do the other div i hate this i hate when i get this stuff wrong it makes me so upset both must be id isn't that what they are uh you have to add the oh right you guys are right oh pass city is it just opacity i don't actually know what the css class for that is you guys are watching me straight noob out here take the div that's inside the repeater oh okay i wasn't sure if that was going to work because i guess it's the same id so it's not going to matter you need to use but for the id that's what i thought there we go there we go okay cool i wasn't sure i thought you used that one for the first one for the id but not the second one i didn't think that mattered all that much okay so let me go ahead and comment out this php here sometimes people think i'm a wizard but i'm totally not i just fumble around on the keyboard until stuff happens that i want so there we go there is that hover effect which is only going to happen when you put well i say only it's going to happen everywhere you put your mouse on that but the problem with that is in this example it only happens when you hover over that specific div so [Music] is that going to be a limitation of the repeater since it duplicates the id yeah pedro pedro says when you're using the id you always use the pound sign the dot is for classes only that's what i thought but i was confused i always have to switch it back and forth because i never remember you have to take the div inside the repeater oh yeah i guess i could just use this div block right oh wait it's not going to be that div because it's the entire div so it's this one so div block 1312 is our master as i'm going to call it and then the css here will be that guy yep that looks like it's gonna work so let's save real quick and take a look at the front end there we go that's what we wanted so now it's only going to apply on that specific div whenever you hover over that elijah says it took me longer than i'm proud to admit to remember the difference between the pound and dot when writing css yet to be honest with you i wouldn't even know any css if it weren't for oxygen so i'm proud of what i know j1 mtv says select your parent container and use nth child to target the third child yes definitely so now on our example we have that the only thing that needs to change is on that icon it needs to go to that goldish color whatever that is so this one here click to copy we'll go back to our icon and then on the id i'm going to go to hover and then icon color will be that so now is it is it working i can't tell i don't know it's not background color is that a problem with the is that a problem with the icon let me change it to something like really crazy i saw it for a brief second what's wrong so hover icon style this is a cascade problem the color color on the um icon hover here are you talking about for this i don't want the icon to change until later and i also don't want it to change unless it's hovered directly over the icon if you add a class to it and then add another pseudo class use hover.class yeah i'm not sure which like the div a class in another class i'm confused not sure what you guys mean exactly like stick a clasp on the icon so it would be like icon hover like this it's like it works for a brief second add the pseudo to the whole card what pseudo are you talking about though if you add a class to it and then add another pseudo class yes class on the icon set opacity okay so effects not transition that's out of habit for sure cool kevin's gonna make a quick video all right so i'm gonna keep going we need to get the nth third here looks like you set up your icon color on your code block no yes i did you're right so if i get rid of that then oh yeah yeah that's all it was that's all it was it's just the fact that the icon color was set in the code block all i needed to do was have the opacity and not the actual color so that actually works out just fine so now when i hover over the icon it's going to take that color that we wanted from earlier which is not lime green it was this color whatever that is some sort of tan and i need to get rid of one of those pound signs so there we go that's really subtle but i think we'll be able to see it better on the black it's super super light so i wonder if maybe that icon is a bit thicker it's definitely more noticeable on these for some reason unless the color is different let's use a little color palette tool and see i'm going to use this one because it's a bit more visible here yeah that's perfectly fine not quite as orange we'll make it a bit more like tan but i just want to be able to see it all right so now if we go back over here do we have the desired result no oh lordy oh well i'm i'm not going to worry about that i'm tired of dealing with that particular thing so now what i want to do is in child third i'm gonna look that up so we're gonna take in child will be our pseudo so then we're gonna take this particular div i believe this code block css all right nth child and then is it this div here or it's going to be our dynamic list actually so in child three and then if we go uh let's see i'm gonna need to target that heading uh david says what tool are you using in the browser for the color picker and inspector yeah it's hoverify so there's a video on the channel here and then should we add a class to this heading i suspect we might want to so i'm just going to do that or i can just take the id i'm just going to try that um [Music] so then we'll go font oh wait i also need hover i believe that's that's not gonna work headline can you do stacked pseudo classes like that because i'm already targeting nth child three and then i want it to be on hover so how do you do that font size is going to be let's just try something crazy like 24 pixels i don't know if you guys can tell my voice is getting tired nope [Music] is that selector too high i'm not exactly sure here this is kind of a pitiful stream so i apologize the css stuff here is turning out to be a bit more complicated than i thought some of you guys are probably laughing because it's like you know supposed to be simple but i'm not i'm not a coder by any means dynamic list check the video at 507 what what video i don't see a link maybe it got cut out of chat if you popped it in chat i don't think i can see it maybe on facebook or something like that let's try this div instead it reloaded so fast i couldn't even tell um dave block 1312. url is on chat always without the https oh okay yeah that would be an easy way to do it so just drop the the beginning part and then i'll be able to get it so this one has like a lift effect where that stuff pops up i'm not going to worry about that right now i just want the font size to be bigger is all try adding hover after the heading id selector nth child three oh whoops i accidentally took that off in child three oh that's interesting so it thinks that our third one oh it in the back end it thinks that our third one is this div right here but it's actually the third and then on the front end it's that one so 32 make it a bit bigger and more visible here so yeah i was curious elijah if you have this selector here it says in child then how do you do the hover effect do you have to do like another div question mark question mark so i at least have roughly what i'm after with the heading over here being bigger but what we would need is that hover effect because then you have that transition for all this stuff that appears down below there oh okay cool so in this case i don't actually need the font size to be bigger on hover what i would need is essentially this and then hover and then wouldn't we want uh let's see all right so once we have that div hovered then we would have another div that would translate up right like a transition up effect also on our example here that bottom border looks a bit thicker there i think it's two pixels in that case so let's go border bottom solid two pixels it might even be three it's definitely a bit thicker except why didn't it oh so i needed to go down there you guys are watching me fumble hardcore it's kind of embarrassing but hopefully it's helping somebody out there i sincerely hope so so is it headline hover like that yep that's pretty cool i'm learning something new today hopefully you guys are learning as well so on this what i just did here was basically just have the the border hover increase in thickness here can you not just set display block to section that appears on hover when you hover main post div um i don't know i guess you could probably add in another div and then could you make that div only appear when the nth child third selector is hovered so you could basically build your layout like you know basically duplicate this and then what's in our example here so it's the author and then read time so i'm just gonna go let's stick in an icon well we actually already have an icon but i'll just stick in another one i don't know if this is going to work but i'm going to try i'm going to try so we'll change this to white real quick make it 25 pixels and we'll find a face or a group a people people person i hate the icon names they often don't make sense it's real it guesses user yeah user is fine and then i'm just going to add a text block that's going to say 5 minute read now you get to play with not in child three getting in the weeds here oh okay so elijah is this not is this not the way to do it because what i was thinking is you could just have this whole div here like be display none and then use your css to then basically show that div when nth child 3 is hovered right or is that not the way to do it thank you guys for popping in the icon name i appreciate that so div alright so i'm going to try this and then also we need like a translate up effect which i'm guessing i'm going to have to do on the hover effect on the on the hover class i mean thinking ahead here before i start making a bunch of mistakes so what was the other thing in the example so there was author the read time and then a read more link so that's kind of cool i guess i'll go ahead and stick that in too so text and then text link we'll set that to post permalink and then read more and i'll just do the arrow i'm going to set this div to width 100 and then we'll go space between and then i want this text color to be white perfect um all right so now i'm going to take my div here go to my code block and then so div hover and then we'll go display flex and then take this div and go layout display none save refresh all right all right all right roughly we gotta add the layout here so let's see we're gonna go it'll be layout flex and then justify content so justify content will be space between and then flex direction will be i always forget it's column c-o-l-u-m-n and then we want a hover effect so then i'm just going to stick that class taylor on this div yeah um so create a class called transition and have it translate up i already have a transition class so i'm going to use ps translate transition and then i'm going to go ps translate up as my other class so effects um let's see text shadow transform translate how do you do the slide up i forget rotate translate perspective scale box shadow it's a transform right so it's going to go translate x yeah there is an up transition where is that rotate x under transition there's an up transition transform translate y oh okay translate y so what is it going to be like 25 pixels 125. i have no idea if this is going to work x is left and right y is up and down z is forward and backward okay cool so that works but i oh okay so you had might have to set it to one x and one z as well so then so that works it does push it up but then the content is not visible so did i just stick it in the wrong spot i just totally guessed on 125 pixels i have no idea how high it actually needs to come up i guess i need to go back to my id real quick and look at my layout and see where it's going to be right oh okay okay so we need to go back to our translate up class we're going to switch to effects and i'm on the right state here yeah ps translate up transform i was thinking scale oh wait oh i see i see what you're saying so it's still translate up but it's going to be i wish i could see it in the back end we're so close it's so close um do i have to set it to display flex i already did that though so maybe my translate y is messing it up what what is going on here so if i look on hover can i actually see it so hover [Music] it's not working what am i actually hovering over to activate it it's anything in that div but it's still not visible so just what am i doing wrong here i feel like it's so close there's like one tiny little thing oh man can i see it with hoverify it's almost like it's not appearing that div properly it's like not all the way up wait maybe i don't actually need to translate it why any thoughts here guys i am more than welcome to take them i'm gonna get rid of that real quick and just see where i'm at so it already kind of bumps it up i wonder first of all why is my transition not taking effect that's what i want to know can i go css property all oh i guess maybe i have to add it to that selector transition 0.2 ease in out right can i do that i'm not sure if you're using display none to show hide but you can't transition oh okay that's that's the reason why then that's exactly what i did if you try to animate display i think it's not possible that's exactly the problem then yeah unfortunately that is the problemo so we'd have to find a different solution for that could i just go um what about if i did this i'm going to go div go back to our original thing here so instead of display none we'll set it to flex and then can we just use negative margin to push it out not 225 we'll go like negative 125 negative 50. this might be kind of a janky way to do this but it's going to work in my head so that's what we're going to do translate off canvas yeah taylor i was thinking using opacity but wouldn't that leave the spacing there because then there's still going to be that block of empty space it's just like basically changing the visibility of it so i have negative 90 and then on my translate up i'm going to go effects transform translate y 90 right and then one is this gonna work oh no of course not i was really hoping that would work so visibility hidden so layout visibility hidden and then on hover do you just go visible save no unfortunately not i think you could use max height of zero and remove that restriction on hover oh that's a good idea all right so i guess i would need to do it code block is going to be hover div block max height of zero pixels and then we would just go this guy again here it says negative margin will work if you have overflow hidden on the container gotcha okay uh and then and then div hover can you do like stacked hover effects like that i guess you can andrew says gotta run for meetings fun watching thanks for hanging out i appreciate it this was way longer and way more in-depth than i anticipated it to be but i appreciate you hanging out can i just change the max height to auto in this case i don't know if this is going to work i kind of feel like it's not so i did something wrong it's going the wrong direction i wonder if i kept that translate on the div i'm going to get rid of that translate up class because i think i messed that up i think i messed up the css here from earlier display flex yeah elijah that that's something i tell people all the time that there's so many different ways to solve css problems you have to set the max height to zero on the element by default on hover remove it so andre says go to the div amanda good to see you happy to have you here i'm going to get rid of this and just do it on the div itself so can i do it this way you have to set the max height to zero on the element by default so max height zero and then on hover you go to max height is it i thought there was an unset isn't there an unset somewhere or can i just go to none auto i'm gonna use auto nope can't do that so do i need to use unset on the css then instead of using it actually in oxygen i guess probably so choose none and type on set oh wow there might still still be some messed up css here so yeah for some reason it's just pushing it ever so slightly off the page so i gotta backtrack real quick and figure out what did i do that's so cool i didn't know you could do that you can just choose none and then unset that's super awesome okay so what did i do here to make that push down to the bottom did i use margin somewhere i forget why it's stuck down there oh maybe it's something in my css i obviously don't need this what did i do to make this div be stuck down there hmm pedro i'm glad you're learning stuff this is cool for me too i haven't i haven't really played with something like this this in depth so this is good because quite honestly if i was trying to film this video i would have already scrapped it and stopped working on it by now um what if i i just don't understand why it's like way down there off the page overflow hidden on this div now it's like completely gone here's the website url up here for you guys anyone have a good wear used tool for oxygen i find it difficult to find where something is referenced amanda i'm glad you like it i was talking about this earlier before you showed up that i don't typically do it this way because i personally like to watch polished videos but every once in a while i'm going to start introducing one of these where we're kind of working on it live together it's so cool to be able to have community help i appreciate everybody's help on this so i did overflow hidden and that didn't quite work because then the hover effect is gone oh the demo you're copying it's this tf01.themeruby.com i guess that is something i hadn't considered is looking at this whole div here i wish there was a way in hoverify to go like up a step because what i want is the container that wraps this stuff but i can't quite get it so if i go grid maybe can i select its container overlay holder so there's the media queries trying to see overlay holder those are just the media queries hmm i'm late to the party but did you add a translate on the top on the position to drop it um maybe i did we were messing with some stuff earlier i forget what i did now did i accidentally add it as a transform in there no flex direction columns face between display marco yeah i says i use dev tools until i have a solution usually instead of clicking in oxygen and getting confused yeah i usually try to walk backward through what i was working on and try to figure it out from there but you're right that would be a more viable solution indeed let's try this so why is this whole div pushed down oh it's the max height of zero so i'm going to change that so max height of zero instead of using that i'm gonna go negative oh we already tried negative margin didn't we i wonder if i can go uh can i go absolute bottom and then negative i don't think that's going to work that seems like a terrible idea what about if i set this div to relative so absolute let's go negative 75 negative 80 negative 85. easy post has this exact effect by the way as a template oh you're right maybe we can take a look at that here in a second now what if i go hover and then i set this to absolute bottom of zero that's not going to work though because i don't think it's going to push up the stuff that we want like i don't think that heading is going to go up can i add margin on top of this no it doesn't work because it's set to absolute i think this will sort of work this is a super hack job way to do it nope doesn't work crap that's a good idea taylor i'm going to go steal that easy post layout so there's a grid one by default that's pretty cool it's negative bottom margin then on hover you set the margin bottom to zero oh all right so let me get rid of this garbage that i'm working on here alright so you want to remove the child's max height constraint when hovering over the parent so taylor's popping in some css there so then i need to put it i'm going to paste this in just so i have it and then that's going to go on this div and then which div block is it it's this guy i don't want to get myself confused so i'm just going to go take this right out of there so that and then hopefully some of this other stuff i'm actually just going to go here to this and completely erase everything we've done just to make it clean and not have any potential side effects here so save this guy you can target child classes by hovering over the parent item opacity is zero oh so that's that's actually going to be on the non-hover effect isn't it and then what is it when you hover um so annoying when this stuff doesn't work out exactly like you want it to i appreciate everybody helping i hope this isn't frustrating for you all because i would have definitely taken a break by now had you all not been here supporting do you just go opacity set that to one now on hover uh opacity is gonna be one and then max height on hover opacity one max height four hundred appreciate your help taylor you're always extremely helpful imagine if they had this exact solution as a composite element tomorrow elijah's been quite kind of quiet lately so he might be working on this as we speak all right so we have it there it is right there i just have a small problem with my code because i don't have like it's appearing on these other ones so i messed up the studio class somewhere so taylor thank you so much dude it's a little bit slow because on the example it's much quicker so i need to change that that timing duration or that timing function i think because there's already a transition here in this css so let's go back to our div i'm going to take off the transition class and then so nth child 3 hover yeah there's already that transition there so let's see what am i doing wrong to make this div pop up on everything when we only want it on the third one because none of the other ones have that except this third one so i need to go not third right and display none it i think elijah popped that in chat earlier unless i already have an equivalent there yep i think it's not in child to the rescue here so we're going to take this roughly except we don't need it on hover thank you sir elijah coming in clutch with the not nth child and then we just basically need to display none that block right use nth type not display taylor says don't use display none right because you guys were saying earlier we can't we can't apply transitions to that class is that correct i can't remember i think it's going to affect the other div as well is it not oh no that works so yeah now it doesn't have that hover effect on the bottom over there but for this one it does yeah you can use display none as long as you're not transitioning it okay which you're not on everything that's not the third child got it we did it that is what i call a community effort y'all that is awesome so real quick i'm going to take off this display none because i want to go back to my div here and set this to horizontal go middle align and then space between and then i'm going to go back to the code block stick in the display none tab that in or space it so i'm not a savage and then make some of this stuff spaced properly because i like it to be consistent i would come back and fix that elijah i appreciate you saying that commitment because it did cross my mind to stop doing this oh so oh i have an issue on the hover so i set this stuff up earlier which i guess maybe i duplicated this div yeah i did so i actually don't need this stuff right here so save there we go so it's kind of slow but it does work that is super super cool that was that was a doozy i'm not gonna lie to you guys that was way way more difficult than i thought it was gonna be so this effect right here turns out is i i would have never guessed that it would have been that difficult and that is something that i'm gonna save and never try to do manually again i know stratos my hair is ridiculously long i haven't had it cut in quite a while i was getting haircuts like six weeks every six or eight weeks prior to covid and then after that i'd basically stopped getting haircuts i've had like one in the last year so anyway that is roughly our effect from earlier granted the styling is not exactly like it is over here there's definitely some some tweaks to be made and obviously i don't have the like min red thing but in terms of it being you know viable and working it does work which is pretty neat elijah i agree he says be easier next time you tackle it that's the best way to practice appreciate all you guys hanging out this is not actually what i intended this stream to turn into but i'm glad it did because i'll probably end up chopping this and maybe doing it again stratos earlier i was mentioning just all of the the the big stuff that could come in composite elements so there's just a million things the the world is oxygen's oyster at this point at this point with the oxygen composite elements and also because of the the post that lewis made in the facebook group and then also um the fact that you know there the composite elements are paid it's a paid add-on to me that indicates there's some really really big stuff coming and i don't know what that looks like just yet but i think it's going to be really exciting so just want to say thank you guys to everybody for hanging out i'm going to go ahead and close this out hopefully you all enjoyed this tuesday mid-day stream depending on where you are in the world it might be much later it might be much earlier i appreciate everybody hanging out um until next time i want to say thank you as always and i'll see you in a future video bye for now everybody

Channel: Permaslug

Views: 3,556

Keywords:

Id: bvSJMM8s-N8

Length: 106min 32sec (6392 seconds)

Published: Tue Feb 23 2021