develop

src/app/styles/pages-styles.scss

@@ -112,6 +112,10 @@
 			font-size: 28px;
 			font-weight: 700;
 			margin-bottom: 5px;
+
+			&.btn {
+				user-select: none;
+			}
 		}
 
 		&-label {
@@ -136,6 +140,38 @@
 			display: flex;
 			justify-content: center;
 		}
+
+		&-drop-down-list {
+			position: absolute;
+			left: 80%;
+			top: 50%;
+			max-height: 0;
+			color: #fff;
+			font-size: 16px;
+			border-radius: 20px;
+			padding: 0;
+			border: none;
+			width: 200px;
+			z-index: 1;
+			font-weight: 500;
+
+			background: #ffffff00;
+			overflow: hidden;
+			transition: all 0.5s ease;
+			transform: translateY(-50%);
+
+			&.opened {
+				max-height: 500px;
+				padding: 20px;
+				box-shadow: 0 4px 20px #ffffff34;
+				background: #7165b6;
+			}
+
+			a:hover {
+				font-size: 17px;
+				transition: all 0.3s ease;
+			}
+		}
 	}
 
 	&-switch {
@@ -156,6 +192,8 @@
 	display: grid;
 	grid-template-columns: repeat(5, 1fr);
 	--boder-collor: #f3f4f6;
+	border-bottom: 1px solid var(--boder-collor);
+	align-items: center;
 
 	.stats-item.images {
 		--card-color-1: #f08c00;
@@ -199,8 +237,8 @@
 			}
 		}
 
-		&.last-row {
-			border-bottom: 1px solid var(--boder-collor);
+		&.second-row {
+			border-top: none;
 		}
 
 		&.left-top-corner {
@@ -651,4 +689,11 @@
 		font-weight: bold;
 		margin-left: 5px;
 	}
+}
+
+.page-row {
+	display: flex;
+	justify-content: space-between;
+	flex-wrap: wrap;
+	gap: 20px;
 }