From 8696ea382d07b013eb931bd636189f4096e84042 Mon Sep 17 00:00:00 2001
From: Afiq Hamzah <afiq.hamzah@pkb.net.my>
Date: Mon, 29 Apr 2024 14:49:03 +0800
Subject: [PATCH] Add code enhancement on nominee modal and logo

---
 .../assets/js/components/demo/admin/index.vue | 54 +++++++++----------
 .../js/components/demo/voter/home/index.vue   | 26 ++++++++-
 .../assets/js/components/demo/voter/index.vue | 21 ++++----
 3 files changed, 61 insertions(+), 40 deletions(-)

diff --git a/resources/assets/js/components/demo/admin/index.vue b/resources/assets/js/components/demo/admin/index.vue
index ba43b89..1565e6b 100644
--- a/resources/assets/js/components/demo/admin/index.vue
+++ b/resources/assets/js/components/demo/admin/index.vue
@@ -1,5 +1,5 @@
 <template>
-	<div>	
+	<div>
 		<div v-if="!loading">
 			<nav class="navbar navbar-default navbar-fixed-top" id="nav">
 				<div class="container-fluid">
@@ -8,63 +8,63 @@
 							<span class="icon-bar"></span>
 							<span class="icon-bar"></span>
 							<span class="icon-bar"></span>
-						</button>	
-						<a class="navbar-brand" :href="data.baseURL" ><img src='https://i.postimg.cc/ZBDD0ZfQ/Whats-App-Image-2024-03-21-at-1-24-46-PM-2.jpg' border='0' alt="MyKoPKB Logo"></a>
+						</button>
+						<a class="navbar-brand" :href="data.baseURL" ><img src='/images/MyKoPKB-logo.png' border='0' alt="MyKoPKB Logo"></a>
 					</div>
 					<div class="collapse navbar-collapse" id="myNavbar">
-	
+
 						<ul class="nav navbar-nav">
 							<!-- {{ users }} -->
 							<router-link :to="{name: 'Admin Home'}" tag="li" exact><a href="#">Laman Utama</a></router-link>
 							<router-link :to="{name: 'Kemaskini Jawatan'}" v-if="data.user.role==1" tag="li">
 								<a href="#">Jawatan</a>
 							</router-link>
-							
+
 							<!-- <router-link :to="{name: 'Manage Partylist'}"  v-if="data.user.role==1" tag="li">
 								<a href="#">Manage Partylist</a>
 							</router-link> -->
-	
+
 							<router-link :to="{name: 'Manage Voter'}"  v-if="data.user.role==1" tag="li">
 								<a href="#">Anggota Koperasi</a>
 							</router-link>
-	
+
 							<router-link :to="{name: 'Maklumat Calon'}"  v-if="data.user.role==1" tag="li">
 								<a href="#">Calon</a>
 							</router-link>
-	
+
 							<router-link :to="{name: 'Kehadiran Calon'}"  v-if="data.user.role==1" tag="li">
 								<a href="#">Kehadiran</a>
 							</router-link>
-	
+
 						</ul>
 						<ul class="nav navbar-right navbar-nav">
 							<li class="dropdown">
-								<a 
-									href="#" 
-									class="dropdown-toggle" 
-									data-toggle="dropdown" 
-									role="button" aria-haspopup="true" 
+								<a
+									href="#"
+									class="dropdown-toggle"
+									data-toggle="dropdown"
+									role="button" aria-haspopup="true"
 									aria-expanded="false">
 									<span class="fa fa-user"></span> {{ data.user.name }} <span class="caret"></span>
 								</a>
 								<ul class="dropdown-menu">
-	
+
 									<router-link :to="{name:'Update Account'}" tag="li" exact>
 										<a href="#">Kemaskini Akaun</a>
 									</router-link>
-	
+
 									<router-link :to="{name: 'Manage Account'}" tag="li" v-if="data.user.id==1">
 										<a href="#">Pengurusan Akaun</a>
 									</router-link>
-	
+
 									<li @click="logout()"><a>Log Keluar</a></li>
 								</ul>
 							</li>
 						</ul>
-					</div> 
+					</div>
 				</div>
 			</nav>
-	
+
 			<router-view></router-view>
 		</div>
 		<div v-if="loading" class="container">
@@ -74,15 +74,15 @@
 		</div>
 	</div>
 	</template>
-	
+
 	<script>
 	export default{
-	
+
 		// data: () =>({
 		// 	loading: true,
 		// 	users:{'roles' : 1},
 		// }),
-	
+
 		created: function () {
 			this.util.setTitle('Voting System - Administrator');
 			var vm = this;
@@ -99,7 +99,7 @@
 					 })
 					 .catch(error=>{
 						 $.notifyClose();
-						 if (this.util.showResult(error) == 401) { 
+						 if (this.util.showResult(error) == 401) {
 							 vm.logout();
 						 }
 					 })
@@ -107,7 +107,7 @@
 				this.$router.push({name:'Admin Login'});
 			}
 		},
-	
+
 		methods: {
 			logout: function () {
 				localStorage.clear();
@@ -116,9 +116,9 @@
 		}
 	}
 	</script>
-	
+
 	<style>
 	body{
 		padding: 70px 5px;
-	}	
-	</style>
\ No newline at end of file
+	}
+	</style>
diff --git a/resources/assets/js/components/demo/voter/home/index.vue b/resources/assets/js/components/demo/voter/home/index.vue
index 3fe3c5b..5b10a00 100644
--- a/resources/assets/js/components/demo/voter/home/index.vue
+++ b/resources/assets/js/components/demo/voter/home/index.vue
@@ -93,7 +93,7 @@
                             <div class="detail-section">
                                 <span><b> Nama : </b>{{ nomineeViewed.name }}</span>
                                 <span><b> Unit : </b>{{ nomineeViewed.unit }}</span>
-                                <span> <b>Taraf Pendidikan :</b> </span> 
+                                <span> <b>Taraf Pendidikan :</b> </span>
                                 <ol>
                                     <li v-for="(item, index) in nomineeViewed.education" :key="index">{{ item }}</li>
                                 </ol>
@@ -185,7 +185,7 @@ export default {
             $('#view-nominee-modal').modal();
         },
 
-        
+
 
     },
 
@@ -229,6 +229,28 @@ export default {
     padding: 5px 0;
 }
 
+/* Mobile styles */
+@media (max-width: 576px) {
+    #view-nominee-modal .modal-dialog {
+        max-width: none;
+        padding-left: 10px;
+        padding-right: 20px;
+        margin-bottom: 50px;
+        margin-left: 0px;
+    }
+
+    #view-nominee-modal .photo-section {
+        flex: 0 0 100%; /* Set photo section to full width */
+        max-width: none; /* Remove max-width */
+        margin-right: 0; /* Remove right margin */
+        margin-bottom: 20px; /* Add space between photo and details */
+    }
+
+    #view-nominee-modal .detail-section {
+        flex: 0 0 100%; /* Set detail section to full width */
+    }
+}
+
 #table-nominee tbody tr {
     cursor: pointer;
 }
diff --git a/resources/assets/js/components/demo/voter/index.vue b/resources/assets/js/components/demo/voter/index.vue
index 77de04d..6f9f4d4 100644
--- a/resources/assets/js/components/demo/voter/index.vue
+++ b/resources/assets/js/components/demo/voter/index.vue
@@ -8,13 +8,13 @@
 						<span class="icon-bar"></span>
 						<span class="icon-bar"></span>
 						<span class="icon-bar"></span>
-					</button>	
-					<a class="navbar-brand" :href="data.baseURL" ><img src='https://i.postimg.cc/ZBDD0ZfQ/Whats-App-Image-2024-03-21-at-1-24-46-PM-2.jpg' border='0' alt="MyKoPKB Logo"  width="150" height="auto"></a>
+					</button>
+					<a class="navbar-brand" :href="data.baseURL" ><img src='/images/MyKoPKB-logo.png' border='0' alt="MyKoPKB Logo"  width="150" height="auto"></a>
 				</div>
 				<div class="collapse navbar-collapse" id="myNavbar">
 
 					<ul class="nav navbar-nav">
- 
+
 						<router-link :to="{name: 'Voter Home'}" tag="li" exact>
 							<a href="#"><b>LAMAN UTAMA</b></a>
 						</router-link>
@@ -29,7 +29,7 @@
 
 						<router-link :to="{name: 'Vote'}" v-if="data.election.status==2 && data.user.saham >= 500 && !hasVoted() && data.user.kehadiran != 0" tag="li" exact>
 							<a href="#"><b>UNDIAN</b></a>
-						</router-link>	
+						</router-link>
 
 						<router-link :to="{name: 'Zoom'}" v-if="data.user.kehadiran != 0" tag="li" exact>
 							<a href="#"><b>PAUTAN ZOOM</b></a>
@@ -42,11 +42,11 @@
 					</ul>
 					<ul class="nav navbar-right navbar-nav">
 						<li class="dropdown">
-							<a 
-								href="#" 
-								class="dropdown-toggle" 
-								data-toggle="dropdown" 
-								role="button" aria-haspopup="true" 
+							<a
+								href="#"
+								class="dropdown-toggle"
+								data-toggle="dropdown"
+								role="button" aria-haspopup="true"
 								aria-expanded="false">
 								<span class="fa fa-user"></span> {{ data.user.name }} <span class="caret"></span>
 							</a>
@@ -117,6 +117,5 @@ export default{
 <style>
 body{
 	padding: 70px 5px;
-}	
+}
 </style>
-