UI tweaks

Alovoa · Feb 28, 2021 · 9d55eb4 · 9d55eb4
1 parent 60c5775
commit 9d55eb4
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 2 deletions.
diff --git a/src/main/resources/static/css/search.css b/src/main/resources/static/css/search.css
@@ -72,6 +72,10 @@
 	float: right;
 }
 
+.user-search-card {
+	scroll-snap-align: start;
+}
+
 .user-search-div{
 	 margin-bottom: 24px;
 	 scroll-snap-type: y mandatory;
@@ -143,6 +147,10 @@
 		padding: 12px;
 		padding-top: 36px;	
 	}
+
+	.user-search-card {
+		height: 100%;
+	}
 }
 /*very small screens*/
 @media screen and (max-width: 600px) {

diff --git a/src/main/resources/static/css/userProfile.css b/src/main/resources/static/css/userProfile.css
@@ -0,0 +1,9 @@
+#audio-play-button {
+	width: 300px;
+}
+
+@media screen and (max-width: 338px) {
+	#audio-play-button {
+		width: 100%;
+	}
+}
diff --git a/src/main/resources/templates/fragments.html b/src/main/resources/templates/fragments.html
@@ -163,8 +163,7 @@
 			<span th:text="#{no-users-found}"></span>
 		</div>
 
-		<div th:each="user : ${users}" class="user-search-card"
-			style="scroll-snap-align: start; height: 100%;">
+		<div th:each="user : ${users}" class="user-search-card">
 			<div class="swiper-container" th:id="${user.idEncoded}">
 				<div class="swiper-wrapper">
 

diff --git a/src/main/resources/templates/userProfile.html b/src/main/resources/templates/userProfile.html
@@ -13,6 +13,7 @@
 <link rel="stylesheet" href="/css/lib/swiper.min.css" />
 <link rel="stylesheet" href="/css/alovoa.css" />
 <link rel="stylesheet" href="/css/search.css" />
+<link rel="stylesheet" href="/css/userProfile.css" />
 <title th:value="${user.firstName}"></title>
 </head>
 <body>