[OUTDATED] ★ Tetra's CSS Guide ★

Awesome guide! Very informative! I haven't coded in a long time (over 2 years) ever since losing my computer I did have, so I'm really rusty and don't remember a bunch lol. Oops.

I am curious though. I really want to code my own profile and den. I have an idea on the way I want both pages to look, but the only way for me to do that presently is by using my phone (android). Unfortunately I don't have access to a computer.. 😓 I know it's possible, but more difficult to do than if I was able to use a computer.

It's okay if you have no answer, but do you have any advice on what I could do to make it possible to effectively code on my phone? I have no idea on where to start when it comes to using my phone to code 😅

hi! i'm back after me having asked an entire page of questions at one point :^)

My questions now are, that I can't for some reason change the color of the entire header section(with the top bar, status bar with currency and modbox, and the breadcrumb thing)

is there something I may be doing wrong that I don't know about? thanks!

@Destiny

To be gravely honest I have never tried coding on mobile so I can't really give an accurate answer, but I did do a little research.

Technically as long as you have somewhere to type it shouldn't be impossible to code, but the biggest issues are 1) readability and 2) exporting. Typing into your device's notepad means doing so with autocorrect on, and with a font that is not monospaced and therefore may be difficult to read and edit. Plus, you would need to be able to save the code as a proper .css file for use, a function which I doubt the default mobile notepad is able to support.

But since I'm also on Android, I did some research on the Play Store and found this app! It's a code editor that allows for conveniences like syntax highlighting. I tried creating a .css file and it seems to work perfectly - when you save your file and it asks you for a name, be sure to type .css at the end of it. And even if this app doesn't work out for you somehow, there seems to be many other also-free alternatives on the Play Store. So I guess this gets rid of the big issues!

I don't usually like to give advice on things I'm not familiar with but I hope this information is helpful for you :,)

@Nekkoya

The .navbar-status is another one of those stubborn elements that require !important. Have you tried this?

.navbar-status {

    background: rgb(116, 124, 156) !important;

}

It worked, thanks very much!! since i'm here i'm going to drop a couple more questions that i definitely didn't completely forget to ask before-

Changing the progress bars doesn't seem to work for me either- are these also some stubborn ones that need the !important modifier?
And also, the row below the row that has the den title(for the different dens on your den page, it says name stats info currents), what's the selector name for that?

@Nekkoya

I think I might have written down the wrong selector for the progress bars! It is actually .progress-bar, and .progress is just the gray background beneath it. That being said, colors can only be applied using the background property - you had used color. Try this block:

.progress-bar {

    border-radius: 10px;

    background: linear-gradient(rgb(155, 153, 227), rgb(195, 154, 231));

}

For your second question, the selector should be .subheader

you've literally reached helpfulness levels that shouldn't be possible thank you so much--

Oh wow! Thank you for the advice! Really do appreciate it! Yeah, I tried using the device's notepad on mine about several days ago and realized real quick that using it was not going to work from the above reasons you stated. Lmao 😅

I've installed that app you found and I'll have to try it out here in a little while, thank you so much! This helps 😁

hello! i literally feel so dumb coming back here for the millionth time, but i think these should be the rest of my questions for a while!

so, changing the progress bar colors doesn't work for me. i can't figure it out? here are the blocks i used:

I also can't get the subheader to work, here is the block:

and finally, changing the status bar hasn't seemed to work for me either

I do think I should say that i've tried basically everything, even adding the !important thing, and asking you for help and taking away from your time really is a last resort for me ;-;

edit: sorry it's so hard to read!! for some reason the formatting didn't go through ;;

Hey, i'm back after already asking like a page of questions ahh i just have 2 more. how do i round the corners of everything? (like the image below, including the wolf pictures) 

2. How do i make the text (in the image, 'Silent Oak') bigger and more centered?

(this isnt my css, css is by katie! just used it as an example to ask the questions and provide visual)