fix: profile page wasn't very responsive

frontend/src/App.vue

@@ -589,6 +589,7 @@ body {
 
 #root {
 	height: 100%;
+	max-width: 100%;
 }
 
 .content-wrapper {
@@ -759,6 +760,7 @@ textarea {
 
 .upper-container {
 	height: 100%;
+	max-width: 100%;
 }
 
 .main-container {
@@ -766,6 +768,7 @@ textarea {
 	min-height: 100vh;
 	display: flex;
 	flex-direction: column;
+	max-width: 100%;
 
 	&.main-container-modal-active {
 		height: 100% !important;

frontend/src/pages/Profile/index.vue

@@ -166,12 +166,6 @@ onMounted(() => {
 </template>
 
 <style lang="less" scoped>
-@media only screen and (max-width: 1250px) {
-	.bottom-section .content {
-		width: 650px !important;
-	}
-}
-
 @media only screen and (max-width: 900px) {
 	.info-section {
 		margin-top: 0 !important;
@@ -229,8 +223,22 @@ onMounted(() => {
 	}
 }
 
+@media only screen and (max-width: 500px) {
+	.bottom-section {
+		padding: 12px;
+		:deep(.content) {
+			padding: 30px 25px !important;
+			margin-left: 0;
+			margin-right: 0;
+		}
+	}
+}
+
+:deep(.container) {
+	max-width: 100%;
+}
+
 .info-section {
-	width: 912px;
 	max-width: 100%;
 	margin-left: auto;
 	margin-right: auto;