From 473117fdd9cb9faa8dca4a7f4b111b411ed5e4f9 Mon Sep 17 00:00:00 2001 From: Jason Hankins Date: Thu, 9 Nov 2023 23:32:06 -0500 Subject: [PATCH] minimal styling center, color, etcc <3 --- exploring-national-parks/public/index.html | 18 +++++---------- exploring-national-parks/public/style.css | 19 ++++++++++++++++ exploring-national-parks/src/NPSAPI.js | 1 + exploring-national-parks/src/api.css | 26 ++++++++++++++++++++++ 4 files changed, 52 insertions(+), 12 deletions(-) create mode 100644 exploring-national-parks/public/style.css create mode 100644 exploring-national-parks/src/api.css diff --git a/exploring-national-parks/public/index.html b/exploring-national-parks/public/index.html index a16f23f..0920552 100644 --- a/exploring-national-parks/public/index.html +++ b/exploring-national-parks/public/index.html @@ -2,23 +2,17 @@ - React App + Exploring National Parks +
- +
- +

Exploring National Parks

+
+
diff --git a/exploring-national-parks/public/style.css b/exploring-national-parks/public/style.css new file mode 100644 index 0000000..c1ae747 --- /dev/null +++ b/exploring-national-parks/public/style.css @@ -0,0 +1,19 @@ +body{ + background-color: rgb(155, 184, 160); + color: rgb(19, 35, 19); + /*width: 100%; height: 100%; min-height:100vh; + display: flex; flex-direction: column;*/ +} + +#activities{ + margin-left: auto; + margin-right: auto; + width: 30%; + + /*min-width: 500px;*/ +} + +#activitiesDropdown{ + color: black; +} + diff --git a/exploring-national-parks/src/NPSAPI.js b/exploring-national-parks/src/NPSAPI.js index 5ab2d99..6ae959a 100644 --- a/exploring-national-parks/src/NPSAPI.js +++ b/exploring-national-parks/src/NPSAPI.js @@ -1,4 +1,5 @@ import React, {useState, useEffect} from 'react'; +import './api.css'; function Activities() { const [posts,setPosts] = useState([]); diff --git a/exploring-national-parks/src/api.css b/exploring-national-parks/src/api.css new file mode 100644 index 0000000..0423ac4 --- /dev/null +++ b/exploring-national-parks/src/api.css @@ -0,0 +1,26 @@ + +button{ + width: 50%; +} + +a{ + text-decoration: none; +} + +a:hover{ + text-decoration: underline; +} + +.data-container{ + padding: 10px 10px 10px 10px; + /*max-inline-size: 100px;*/ + border-style: dotted; +} + +.post-card{ + height: 30px; + text-align: center; + margin-left: auto; + margin-right: auto; + width: 30%; +} \ No newline at end of file