diff --git a/100-days/full-week.html b/100-days/full-week.html new file mode 100644 index 0000000..48654b4 --- /dev/null +++ b/100-days/full-week.html @@ -0,0 +1,21 @@ + + + + + My Upcoming Challenges + + + + + + +

My Upcoming Challenges

+ View Today's Challenge +

Repeat what I learned about HTML & CSS

+

Do the exercises on HTML & CSS

+

Dive deeper into HTML & CSS and build more complex websites

+ + \ No newline at end of file diff --git a/100-days/images/challenges-trophy.jpg b/100-days/images/challenges-trophy.jpg new file mode 100644 index 0000000..b762115 Binary files /dev/null and b/100-days/images/challenges-trophy.jpg differ diff --git a/100-days/index.html b/100-days/index.html new file mode 100644 index 0000000..07a718f --- /dev/null +++ b/100-days/index.html @@ -0,0 +1,25 @@ + + + + + + + + + + + My Daily Challenge + + + A trophy +

Max' Challenge for Wednesday, August 4th

+

+ Learn about the basics of web development - specifically dive into HTML & + CSS. +

+

Explore the full week.

+ + \ No newline at end of file diff --git a/100-days/styles/daily-challenge.css b/100-days/styles/daily-challenge.css new file mode 100644 index 0000000..4bd8b4f --- /dev/null +++ b/100-days/styles/daily-challenge.css @@ -0,0 +1,15 @@ +body { + margin: 50px; + } + + img { + width: 200px; + height: 200px; + border-radius: 100px; + } + + #todays-challenge { + color: rgb(170, 96, 83); + font-weight: bold; + font-size: 52px; + } \ No newline at end of file diff --git a/100-days/styles/full-week.css b/100-days/styles/full-week.css new file mode 100644 index 0000000..e69de29 diff --git a/100-days/styles/shared.css b/100-days/styles/shared.css new file mode 100644 index 0000000..dadb138 --- /dev/null +++ b/100-days/styles/shared.css @@ -0,0 +1,23 @@ +body { + background-color: rgb(233, 215, 207); + text-align: center; + color: rgb(83, 75, 75); + } + + h1 { + font-family: 'Oswald', sans-serif; + } + + p { + font-family: 'Fira Sans', sans-serif; + } + + a { + font-family: 'Fira Sans', sans-serif; + text-decoration: none; + color: rgb(167, 1, 78); + } + + a:hover { + text-decoration: underline; + } \ No newline at end of file diff --git a/getting-started/form.php b/getting-started/form.php index e69de29..7b3be05 100644 --- a/getting-started/form.php +++ b/getting-started/form.php @@ -0,0 +1,13 @@ + + +
+ User name:
+ Password:
+ + +
\ No newline at end of file diff --git a/react-complete-guide/src/App.js b/react-complete-guide/src/App.js index 8fdecd7..67ab5b8 100644 --- a/react-complete-guide/src/App.js +++ b/react-complete-guide/src/App.js @@ -1,4 +1,4 @@ -import Expenses from "./components/Expenses"; +import Expenses from "./components/Expenses/Expenses"; function App() { const expenses = [ diff --git a/react-complete-guide/src/components/ExpenseDate.css b/react-complete-guide/src/components/Expenses/ExpenseDate.css similarity index 100% rename from react-complete-guide/src/components/ExpenseDate.css rename to react-complete-guide/src/components/Expenses/ExpenseDate.css diff --git a/react-complete-guide/src/components/ExpenseDate.js b/react-complete-guide/src/components/Expenses/ExpenseDate.js similarity index 100% rename from react-complete-guide/src/components/ExpenseDate.js rename to react-complete-guide/src/components/Expenses/ExpenseDate.js diff --git a/react-complete-guide/src/components/ExpenseItem.css b/react-complete-guide/src/components/Expenses/ExpenseItem.css similarity index 93% rename from react-complete-guide/src/components/ExpenseItem.css rename to react-complete-guide/src/components/Expenses/ExpenseItem.css index d15ea91..2c6dea2 100644 --- a/react-complete-guide/src/components/ExpenseItem.css +++ b/react-complete-guide/src/components/Expenses/ExpenseItem.css @@ -2,10 +2,8 @@ display: flex; justify-content: space-between; align-items: center; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25); padding: 0.5rem; margin: 1rem 0; - border-radius: 12px; background-color: #4b4b4b; } diff --git a/react-complete-guide/src/components/ExpenseItem.js b/react-complete-guide/src/components/Expenses/ExpenseItem.js similarity index 80% rename from react-complete-guide/src/components/ExpenseItem.js rename to react-complete-guide/src/components/Expenses/ExpenseItem.js index 9a304fb..b1fac6d 100644 --- a/react-complete-guide/src/components/ExpenseItem.js +++ b/react-complete-guide/src/components/Expenses/ExpenseItem.js @@ -1,4 +1,6 @@ import ExpenseDate from './ExpenseDate'; +import Card from '../UI/Card'; + import './ExpenseItem.css'; function ExpenseItem(props) { @@ -7,13 +9,13 @@ function ExpenseItem(props) { const expenseAmount = 294.67;*/ return ( -
+

{props.title}

${props.amount}
-
+ ); } diff --git a/react-complete-guide/src/components/Expenses.css b/react-complete-guide/src/components/Expenses/Expenses.css similarity index 63% rename from react-complete-guide/src/components/Expenses.css rename to react-complete-guide/src/components/Expenses/Expenses.css index f4f0186..4da4e3c 100644 --- a/react-complete-guide/src/components/Expenses.css +++ b/react-complete-guide/src/components/Expenses/Expenses.css @@ -4,6 +4,4 @@ margin: 2rem auto; width: 50rem; max-width: 95%; - border-radius: 12px; - box-shadow: 0 1px 8px rgba(0, 0, 0, 0.25); } \ No newline at end of file diff --git a/react-complete-guide/src/components/Expenses.js b/react-complete-guide/src/components/Expenses/Expenses.js similarity index 90% rename from react-complete-guide/src/components/Expenses.js rename to react-complete-guide/src/components/Expenses/Expenses.js index 1be8440..7eb0af3 100644 --- a/react-complete-guide/src/components/Expenses.js +++ b/react-complete-guide/src/components/Expenses/Expenses.js @@ -1,9 +1,10 @@ import ExpenseItem from "./ExpenseItem"; +import Card from "../UI/Card"; import "./Expenses.css"; function Expenses(props) { return ( -
+ -
+ ); } diff --git a/react-complete-guide/src/components/UI/Card.css b/react-complete-guide/src/components/UI/Card.css new file mode 100644 index 0000000..e182a3e --- /dev/null +++ b/react-complete-guide/src/components/UI/Card.css @@ -0,0 +1,4 @@ +.card { + border-radius: 12px; + box-shadow: 0 1px 8px rgba(0, 0, 0, 0.25); +} \ No newline at end of file diff --git a/react-complete-guide/src/components/UI/Card.js b/react-complete-guide/src/components/UI/Card.js new file mode 100644 index 0000000..aa2002e --- /dev/null +++ b/react-complete-guide/src/components/UI/Card.js @@ -0,0 +1,9 @@ +import './Card.css'; + +function Card(props) { + const classes = 'card ' + props.className; + + return
{props.children}
+} + +export default Card; \ No newline at end of file