if you'll permit me to be a little extra, much obliged

color 1: #b4c891;
color 2: #ffba80;

for $100 :3

9

i dont believe in organised codes only the illusion of such. (seriously, i highly encourage you to code anyway even if you don't think your codes look. style is a thing that's developed, typically after creating dozens of horrendous, eye-searing codes that probably belong in hell. we also tend to overestimate other people's standards tbh so like, yeah, if you want to code go wild)

7

i want someone else to be the baby once. ruffles my little mew mew uwu

R

3

GRADIENT TEXT

.text {
background: -webkit-linear-gradient(#eee, #333);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-box-decoration-break: clone; //this line is incredibly important for cross-compatibility. your gradient text will cut off after the first line and be unreadable on ios mobile if you do not have this
}

its as simple as that. woo. this is something very easy to look up, but but but, i’m putting it here w/ something that most tutorials forget — the last line, the box-decoration-break is really important because otherwise your gradient text on ios mobile will not work for more than one line of text

just wanted to say that the skin you posted is so cute i love <3

7

random thing I thought but just something I noticed myself doing that might help others learn grid.

First off I split grid into grid-template-rows / grid-template-columns. I don’t use grid-area (the shorthand) because a) I cannot keep track of the order that it goes, b) it doesn’t work on either less or scss/sass I forgot idk

Anyway, whenever I’m trying to remember how grids work, instead of drawing some mathematical grid which helps for shit naught, I think of things as

- for COLUMNS: those Roman/Greek pillars/columns (like the ones outside the Lincoln Memorial). They long cylinders up and down and they’re placed next to each other

- for ROWS: foosball tables or abacuses (which can be made vertically ig but I’ve always thought of them as going horizontal lol). They’re sticks that go left to right and they’re stacked on top of each other.

So if you have difficulty with keeping grid straight, it may help to think of it as physical objects?

additional note because once more, I’m awful @ keeping grid straight, when it comes to defining items on a grid, i usually format it as grid-row/column:{starting column/row #}/span #

So for example grid-row:1/span 2; means for it to start @ line 1 and then span two boxes, which is more in line with how I think of grid. This would be the equivalent of grid-row:1/3; it’s just easier for me to think of grids as the cells rather than the division lines.