x--------x

PUSHING AND UPDATE TO REPO ONCE SAVED:

GET INTO GIT: cd /c/xampp/htdocs/judsonsclocks

1. git status
2. git add (filename) or git add . (for all files)
3. git commit -m "short message goes here"
4. git push
5. git push --set-upstream origin [branch-name] (only if its the first time pushing or you set up a new branch)

x--------x

Day 3:

Project Goal: Explore CSS theme packages, get a handle on HTML / CSS for structuring and organizing webpages by working a splitscreen using XAMPP localhost, create functioning buttons, format existing pages/work on website structure

Tidbits:

1) Stylesheets:
- Reusability: External stylesheets promote reusability and consistency across multiple pages.
- Organization: Internal stylesheets keep styles within the same document, useful for single-page applications or small projects.
- Specificity: Inline styles can override other styling due to their high specificity.

2) CSS Selectors:

- Type Selectors: Selects all elements of a given type. E.g., h1 {} targets all <h1> elements.
- Class Selectors: Targets elements with a specific class attribute. E.g., .button {} targets all elements with class="button".
- ID Selectors: Selects an element based on its unique ID. E.g., #header {} targets the element with id="header".
- Attribute Selectors: Select elements based on attribute presence or value. E.g., input[type="text"] {} targets all text input fields.
- Pseudo-class Selectors: Select elements in a specific state. E.g., a:hover {} changes style when a user hovers over a link.

3) Best practices for creating new webpages using a CSS Stylesheet:
- HTML Template: Consider creating a basic HTML template that includes the link to your CSS framework. Then, use this template as the starting point for all new pages. This helps ensure that every page automatically includes the necessary CSS link.

4) CSS is not a programming language, but a styling language. I feel like I 'knew' this in some way but didn't conceptualize it as that.

Work Log:

- getting quizzed on my html/css knowledge
- learning about correct html page structure
- learning about internal, inline and external stylesheets and their use-cases
- learning more about external css stylesheets and css frameworks for universal application
- researching bootstrap vs tailwind
- decided to halt resarch into using either framework and focus on learning RAW css first
- watching some CSS tutorials: an intro to CSS and a more in-depth 1 hr version
- learning how to adopt font families
- learning how to create style sheets
- creating custom stylesheet
- linking existing pages to stylesheet
- integrating html and css classes into existing blog.php file
- troubleshooting connection issues to mysql database from localhost

CSS HW Notes:

Syntax:

Selectors. Many different types. A CSS style starts with a selector to apply the style to. They begin and end with curly brackets. Everything inbetween the curly brackets are styles that will be applied to the HTML elements that match the selector.

Everything in the {} are properties: the thing that is to be modified, and the modification.

Selectors include but aren't limited to elements, classes, and IDs. Any HTML element can be used as a selector. The style used for that selector will apply to all elements of that type. Class selector is very useful and common. Class selectors let you select HTML elements based on their class attributes.

<h1 class ="big header">
Title
</h1>

All elements can have attibutes. Classes are just an attribute that all elements can have and are used by CSS to distinguish specific elements for styling.

To select an element by class, use a period before the class-name so that it tells the computer 'whatever follows this period is a class name, not an element.' These are great for creating reusable components. Like creating 3 buttons with different colors, using .btn to create the structure of the button and it's basic styling, then .btn-1, 2, etc. to create different versions of that original button. Like using it to create a template.

There are also ID selectors, an HTML attribute that has 1 ID but can have multiple classes. IDs should be unique accross entire webpages. To use an ID as a selector, do #id {property: value }--ensure proper syntax here. Each element can have only 1 ID. Class selectors are best practice to use over ID selecters (opinion from video).