diff --git a/gitignore/.gitignore b/.gitignore similarity index 91% rename from gitignore/.gitignore rename to .gitignore index 435d7ea..ce8af7d 100644 --- a/gitignore/.gitignore +++ b/.gitignore @@ -1,7 +1,7 @@ .vscode node_modules .node_modules -references +assets .gitpod.dockerfile .gitpod.yml package-lock.json diff --git a/cards/index.html b/cards/index.html deleted file mode 100644 index 9c13cb2..0000000 --- a/cards/index.html +++ /dev/null @@ -1,52 +0,0 @@ - - - - - - - - Profile cards - - - - -
-

Who Let These Dogs Out?

- -
-
-
-
- -
Emp name and Position
-
-

I manage stuff

-
- -
-
- -
Emp name and position
-
-

I clean stuff

-
- -
-
- -
Emp name and position
-
-

I'm the leader of naps!

-
-
- - - - - \ No newline at end of file diff --git a/cards/style.css b/cards/style.css deleted file mode 100644 index c7e5500..0000000 --- a/cards/style.css +++ /dev/null @@ -1,174 +0,0 @@ -* { - margin: 0; - padding: 0; - box-sizing: border-box; -} - -img { - display: block; - max-width: 100%; - height: auto; -} - -.nowrap { - white-space: nowrap; -} - -html { - scroll-behavior: smooth; -} - -body { - font: 1.5rem "Menlo", monospace; - min-height: 100vh; - background-color: #475569; - background-image: radial-gradient(whitesmoke, #475569); - display: flex; - flex-direction: column; -} - -header, -footer { - position: sticky; - text-align: center; - color: whitesmoke; - background-color: #1e293b; -} - -header { - top: 0; -} - -nav { - background-color: #fff; - padding: 0.5rem; - border-bottom: 2px solid #000; - font-weight: bolder; - display: flex; - justify-content: space-evenly; -} - -nav a:any-link { - color: #000; -} - -nav :is(a:hover, a:focus) { - color: hsla(0, 0%, 20%, 0.6); -} - -nav a:active { - color: #8a2be2; -} - -main { - flex-grow: 1; - display: flex; - flex-direction: column; - padding: 1rem; - align-items: center; - gap: 1.5rem; -} - -footer { - bottom: 0; -} - -.card { - scroll-margin-top: 8rem; - width: min(100%, 350px); - background-color: #cbd5e1; - border: 2px solid #000; - padding: 1rem; - border-radius: 15px; - display: flex; - flex-direction: column; - align-items: center; -} - -.card figure { - display: flex; - flex-flow: column nowrap; -} - -.card img { - border: 5px double #333; - border-radius: 50%; -} - -.card figcaption { - font-weight: bolder; - font-size: 2rem; - margin: 1rem; - text-align: center; -} - -@media screen and (min-width: 576px) { - main { - justify-content: center; - flex-flow: row wrap; - padding: 1rem; - } - - .card:last-child { - order: -1; - } -} - -@media screen and (min-width: 768px) { - nav { - display: none; - } - - .card { - width: min(100%, 325px); - } - - .card figure { - flex-flow: column-reverse; - } - - .card p { - margin-top: 1rem; - } -} - -@media screen and (min-width: 992px) { - .card { - width: min(100%, 400px); - } - - .card:nth-child(2) { - order: -1; - } -} - -@media screen and (min-width: 1200px) { - .card { - width: min(calc(33% - 1rem), 500px); - } -} - -@media screen and (max-height: 425px) and (min-aspect-ratio: 7/4) { - h1 { - font-size: 1.5rem; - } - - nav { - display: none; - } - - main { - flex-flow: row nowrap; - justify-content: space-evenly; - align-items: stretch; - } - - .card { - width: min(calc(33% - 0.25rem), 200px); - } - - .card figcaption, - .card p { - font-size: 1.25rem; - } -} \ No newline at end of file diff --git a/index.html b/index.html index 8af087c..b0fef47 100644 --- a/index.html +++ b/index.html @@ -12,6 +12,7 @@