diff --git a/index.html b/index.html
index c166974..cc41fec 100644
--- a/index.html
+++ b/index.html
@@ -4,10 +4,10 @@
-
-
+
+
-
+
Annika Bisson - Software Developer
diff --git a/src/img/.DS_Store b/src/img/.DS_Store
index c5da131..f4a79f7 100644
Binary files a/src/img/.DS_Store and b/src/img/.DS_Store differ
diff --git a/src/img/icons/github.svg b/src/img/icons/github.svg
new file mode 100644
index 0000000..becd3f9
--- /dev/null
+++ b/src/img/icons/github.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/img/icons/linkedin.svg b/src/img/icons/linkedin.svg
new file mode 100644
index 0000000..70d8e6f
--- /dev/null
+++ b/src/img/icons/linkedin.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/img/screenshots/.DS_Store b/src/img/screenshots/.DS_Store
new file mode 100644
index 0000000..4854c15
Binary files /dev/null and b/src/img/screenshots/.DS_Store differ
diff --git a/tailwind.css b/tailwind.css
index b2d2488..2916846 100644
--- a/tailwind.css
+++ b/tailwind.css
@@ -551,41 +551,203 @@ video {
--tw-backdrop-sepia: ;
}
+.static {
+ position: static;
+}
+
.fixed {
position: fixed;
}
+.absolute {
+ position: absolute;
+}
+
+.relative {
+ position: relative;
+}
+
+.top-0 {
+ top: 0px;
+}
+
+.left-0 {
+ left: 0px;
+}
+
+.z-20 {
+ z-index: 20;
+}
+
+.mb-4 {
+ margin-bottom: 1rem;
+}
+
.flex {
display: flex;
}
+.grid {
+ display: grid;
+}
+
+.hidden {
+ display: none;
+}
+
.h-screen {
height: 100vh;
}
+.h-24 {
+ height: 6rem;
+}
+
+.h-\[40vh\] {
+ height: 40vh;
+}
+
+.h-full {
+ height: 100%;
+}
+
+.min-h-\[40vh\] {
+ min-height: 40vh;
+}
+
+.min-h-\[80vh\] {
+ min-height: 80vh;
+}
+
+.min-h-\[50vh\] {
+ min-height: 50vh;
+}
+
+.min-h-\[20vh\] {
+ min-height: 20vh;
+}
+
.w-screen {
width: 100vw;
}
+.w-24 {
+ width: 6rem;
+}
+
+.w-48 {
+ width: 12rem;
+}
+
+.w-full {
+ width: 100%;
+}
+
+.grid-cols-1 {
+ grid-template-columns: repeat(1, minmax(0, 1fr));
+}
+
+.flex-col {
+ flex-direction: column;
+}
+
+.flex-wrap {
+ flex-wrap: wrap;
+}
+
.items-end {
align-items: flex-end;
}
+.items-center {
+ align-items: center;
+}
+
+.justify-center {
+ justify-content: center;
+}
+
.justify-between {
justify-content: space-between;
}
+.rounded-full {
+ border-radius: 9999px;
+}
+
+.rounded-lg {
+ border-radius: 0.5rem;
+}
+
+.border-4 {
+ border-width: 4px;
+}
+
+.border-zinc-800 {
+ --tw-border-opacity: 1;
+ border-color: rgb(39 39 42 / var(--tw-border-opacity));
+}
+
.bg-zinc-900\/40 {
background-color: rgb(24 24 27 / 0.4);
}
-.bg-\[url\(\'https\:\/\/thiscatdoesnotexist\.com\'\)\] {
- background-image: url('https://thiscatdoesnotexist.com');
+.bg-rose-700 {
+ --tw-bg-opacity: 1;
+ background-color: rgb(190 18 60 / var(--tw-bg-opacity));
}
-.px-48 {
- padding-left: 12rem;
- padding-right: 12rem;
+.bg-zinc-100 {
+ --tw-bg-opacity: 1;
+ background-color: rgb(244 244 245 / var(--tw-bg-opacity));
+}
+
+.bg-zinc-800 {
+ --tw-bg-opacity: 1;
+ background-color: rgb(39 39 42 / var(--tw-bg-opacity));
+}
+
+.bg-rose-700\/60 {
+ background-color: rgb(190 18 60 / 0.6);
+}
+
+.bg-\[url\(\'\.\/src\/img\/andras-vas-Bd7gNnWJBkU-unsplash\.jpg\'\)\] {
+ background-image: url('./src/img/andras-vas-Bd7gNnWJBkU-unsplash.jpg');
+}
+
+.bg-cover {
+ background-size: cover;
+}
+
+.bg-center {
+ background-position: center;
+}
+
+.object-cover {
+ -o-object-fit: cover;
+ object-fit: cover;
+}
+
+.object-left {
+ -o-object-position: left;
+ object-position: left;
+}
+
+.p-8 {
+ padding: 2rem;
+}
+
+.p-4 {
+ padding: 1rem;
+}
+
+.p-2 {
+ padding: 0.5rem;
+}
+
+.px-12 {
+ padding-left: 3rem;
+ padding-right: 3rem;
}
.py-4 {
@@ -598,15 +760,169 @@ video {
padding-right: 1rem;
}
+.py-12 {
+ padding-top: 3rem;
+ padding-bottom: 3rem;
+}
+
+.py-3 {
+ padding-top: 0.75rem;
+ padding-bottom: 0.75rem;
+}
+
+.pb-4 {
+ padding-bottom: 1rem;
+}
+
+.pb-12 {
+ padding-bottom: 3rem;
+}
+
+.text-center {
+ text-align: center;
+}
+
.text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;
}
+.text-6xl {
+ font-size: 3.75rem;
+ line-height: 1;
+}
+
+.text-2xl {
+ font-size: 1.5rem;
+ line-height: 2rem;
+}
+
+.text-lg {
+ font-size: 1.125rem;
+ line-height: 1.75rem;
+}
+
.text-slate-50\/80 {
color: rgb(248 250 252 / 0.8);
}
+.text-zinc-100 {
+ --tw-text-opacity: 1;
+ color: rgb(244 244 245 / var(--tw-text-opacity));
+}
+
+.text-zinc-900 {
+ --tw-text-opacity: 1;
+ color: rgb(24 24 27 / var(--tw-text-opacity));
+}
+
+.opacity-0 {
+ opacity: 0;
+}
+
+.backdrop-blur-md {
+ --tw-backdrop-blur: blur(12px);
+ -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+ backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+}
+
.text-shadow {
text-shadow: 1px 1px 3px #000000e0;
+}
+
+html {
+ scroll-behavior: smooth
+}
+
+@media screen and (prefers-reduced-motion: reduce) {
+ html {
+ scroll-behavior: auto;
+ }
+}
+
+.hover\:border-rose-700:hover {
+ --tw-border-opacity: 1;
+ border-color: rgb(190 18 60 / var(--tw-border-opacity));
+}
+
+.hover\:bg-rose-700:hover {
+ --tw-bg-opacity: 1;
+ background-color: rgb(190 18 60 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-zinc-100:hover {
+ --tw-bg-opacity: 1;
+ background-color: rgb(244 244 245 / var(--tw-bg-opacity));
+}
+
+.hover\:text-rose-700:hover {
+ --tw-text-opacity: 1;
+ color: rgb(190 18 60 / var(--tw-text-opacity));
+}
+
+.hover\:text-zinc-100:hover {
+ --tw-text-opacity: 1;
+ color: rgb(244 244 245 / var(--tw-text-opacity));
+}
+
+.hover\:opacity-100:hover {
+ opacity: 1;
+}
+
+@media (min-width: 768px) {
+ .md\:mb-12 {
+ margin-bottom: 3rem;
+ }
+
+ .md\:flex {
+ display: flex;
+ }
+
+ .md\:h-64 {
+ height: 16rem;
+ }
+
+ .md\:w-64 {
+ width: 16rem;
+ }
+
+ .md\:grid-cols-3 {
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ }
+
+ .md\:rounded-none {
+ border-radius: 0px;
+ }
+
+ .md\:p-24 {
+ padding: 6rem;
+ }
+
+ .md\:p-0 {
+ padding: 0px;
+ }
+
+ .md\:px-48 {
+ padding-left: 12rem;
+ padding-right: 12rem;
+ }
+
+ .md\:px-24 {
+ padding-left: 6rem;
+ padding-right: 6rem;
+ }
+
+ .md\:py-12 {
+ padding-top: 3rem;
+ padding-bottom: 3rem;
+ }
+
+ .md\:pb-0 {
+ padding-bottom: 0px;
+ }
+
+ .md\:text-8xl {
+ font-size: 6rem;
+ line-height: 1;
+ }
}
\ No newline at end of file