diff --git a/AAAAAA EMOTIONAL DAMAGE/image1.jpg b/AAAAAA EMOTIONAL DAMAGE/image1.jpg
new file mode 100644
index 0000000..abce7a7
Binary files /dev/null and b/AAAAAA EMOTIONAL DAMAGE/image1.jpg differ
diff --git a/AAAAAA EMOTIONAL DAMAGE/index.html b/AAAAAA EMOTIONAL DAMAGE/index.html
new file mode 100644
index 0000000..2ad78a2
--- /dev/null
+++ b/AAAAAA EMOTIONAL DAMAGE/index.html
@@ -0,0 +1,22 @@
+
+
+
+
+
+
+ Document
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/AAAAAA EMOTIONAL DAMAGE/inwalidacja ale to layout.png b/AAAAAA EMOTIONAL DAMAGE/inwalidacja ale to layout.png
new file mode 100644
index 0000000..44b6cae
Binary files /dev/null and b/AAAAAA EMOTIONAL DAMAGE/inwalidacja ale to layout.png differ
diff --git a/AAAAAA EMOTIONAL DAMAGE/inwalidacja.odt b/AAAAAA EMOTIONAL DAMAGE/inwalidacja.odt
new file mode 100644
index 0000000..ce2596a
Binary files /dev/null and b/AAAAAA EMOTIONAL DAMAGE/inwalidacja.odt differ
diff --git a/AAAAAA EMOTIONAL DAMAGE/script.js b/AAAAAA EMOTIONAL DAMAGE/script.js
new file mode 100644
index 0000000..9e2266a
--- /dev/null
+++ b/AAAAAA EMOTIONAL DAMAGE/script.js
@@ -0,0 +1,120 @@
+let card = document.querySelector('.card-container');
+ let cardLeft = document.querySelector('.card-left');
+ let cardRight = document.querySelector('.card-right');
+ let cardLiked = document.querySelector('.card-liked');
+ let cardDisliked = document.querySelector('.card-disliked');
+ let startX;
+ let startY;
+ let currentX;
+ let currentY;
+ let dragging = false;
+
+ card.addEventListener('mousedown', function(e) {
+ startX = e.clientX;
+ startY = e.clientY;
+ dragging = true;
+ card.classList.add('dragging');
+ });
+
+ document.addEventListener('mousemove', function(e) {
+ if (dragging) {
+ currentX = e.clientX;
+ currentY = e.clientY;
+ let diffX = currentX - startX;
+ let diffY = currentY - startY;
+ card.style.transform = 'translate(' + diffX + 'px, ' + diffY + 'px)';
+ let leftButton = document.querySelector('.button-dislike');
+ let rightButton = document.querySelector('.button-like');
+ if (diffX > 0) {
+ leftButton.style.opacity = 0;
+ rightButton.style.opacity = diffX / (window.innerWidth / 2);
+ } else if (diffX < 0) {
+ rightButton.style.opacity = 0;
+ leftButton.style.opacity = Math.abs(diffX) / (window.innerWidth / 2);
+ }
+ }
+ });
+
+ document.addEventListener('mouseup', function(e) {
+ if (dragging) {
+ dragging = false;
+ card.classList.remove('dragging');
+ card.style.transform = '';
+ let diffX = currentX - startX;
+ if (diffX > window.innerWidth / 3) {
+ card.classList.add('card-right');
+ cardLiked.style.opacity = 1;
+ } else if (diffX < -window.innerWidth / 3) {
+ card.classList.add('card-left');
+ cardDisliked.style.opacity = 1;
+ } else {
+ card.classList.add('card');
+ }
+ setTimeout(function() {
+ card.remove();
+ let newCard = document.createElement('div');
+ newCard.classList.add('card-container');
+ let randomNumber = Math.floor(Math.random() * 100);
+ newCard.innerHTML = `
+
+
+ `;
+ document.querySelector('#container').appendChild(newCard);
+ card = document.querySelector('.card-container');
+ cardLeft = document.querySelector('.card-left');
+ cardRight = document.querySelector('.card-right');
+ cardLiked = document.querySelector('.card-liked');
+ cardDisliked = document.querySelector('.card-disliked');
+ }, 300);
+ }
+ });
+
+ document.querySelector('.button-like').addEventListener('click', function() {
+ card.classList.add('card-liked');
+ setTimeout(function() {
+ card.remove();
+ let newCard = document.createElement('div');
+ newCard.classList.add('card-container');
+ let randomNumber = Math.floor(Math.random() * 100);
+ newCard.innerHTML = `
+
+
+ `;
+ document.querySelector('#container').appendChild(newCard);
+ card = document.querySelector('.card-container');
+ cardLeft = document.querySelector('.card-left');
+ cardRight = document.querySelector('.card-right');
+cardLiked = document.querySelector('.card-liked');
+cardDisliked = document.querySelector('.card-disliked');
+}, 300);
+});
+document.querySelector('.button-dislike').addEventListener('click', function() {
+ card.classList.add('card-disliked');
+ setTimeout(function() {
+ card.remove();
+ let newCard = document.createElement('div');
+ newCard.classList.add('card-container');
+ let randomNumber = Math.floor(Math.random() * 100);
+ newCard.innerHTML = `
+
+
+ `;
+ document.querySelector('#container').appendChild(newCard);
+ card = document.querySelector('.card-container');
+ cardLeft = document.querySelector('.card-left');
+ cardRight = document.querySelector('.card-right');
+ cardLiked = document.querySelector('.card-liked');
+ cardDisliked = document.querySelector('.card-disliked');
+ }, 300);
+});
+
+
diff --git a/AAAAAA EMOTIONAL DAMAGE/style.css b/AAAAAA EMOTIONAL DAMAGE/style.css
new file mode 100644
index 0000000..59740e4
--- /dev/null
+++ b/AAAAAA EMOTIONAL DAMAGE/style.css
@@ -0,0 +1,94 @@
+body {
+ margin: 0;
+ padding: 0;
+ font-family: sans-serif;
+}
+
+#container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+ background-color: #f0f0f0;
+}
+
+.card-container {
+ position: relative;
+ width: 300px;
+ height: 400px;
+ background-color: #fff;
+ border-radius: 10px;
+ box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
+ overflow: hidden;
+ cursor: grab;
+}
+
+.card-container:hover {
+ box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.4);
+}
+
+.card-container:active {
+ cursor: grabbing;
+}
+
+.card {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-size: cover;
+ background-position: center;
+ background-repeat: no-repeat;
+ transition: transform 0.3s ease-in-out;
+}
+
+.card-left {
+ transform: translateX(-200%) rotate(-30deg);
+ opacity: 0;
+}
+
+.card-right {
+ transform: translateX(200%) rotate(30deg);
+ opacity: 0;
+}
+
+.card-liked {
+ transform: translateX(200%) rotate(30deg);
+ opacity: 0;
+}
+
+.card-disliked {
+ transform: translateX(-200%) rotate(-30deg);
+ opacity: 0;
+}
+
+.buttons {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 10px;
+ background-color: rgba(0, 0, 0, 0.4);
+ color: #fff;
+ font-size: 24px;
+ font-weight: bold;
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
+ transition: opacity 0.3s ease-in-out;
+ opacity: 0;
+}
+
+.card-container:hover .buttons {
+ opacity: 1;
+}
+
+.button-like {
+ color: #00ff00;
+}
+
+.button-dislike {
+ color: #ff0000;
+}
\ No newline at end of file