KoPKB/lelong-web-pembida
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update changes login, register and header

Browse Source
This commit is contained in:
Afrina Alimi
2022-12-22 10:28:52 +08:00
parent 44661866e1 4df1338f28
commit 016422dc5c
7 changed files with 93 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/img/bidder.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

public/img/person-icon-white.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 77 KiB

public/img/person-icon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

public/themes/lara-light-blue/theme.css
+2 -2
View File
@@ -1698,8 +1698,8 @@
.p-button {
color: #ffffff;
background: #faa608;
border: 1px solid #faa608;
background: #008f96;
border: 1px solid #008f96;
padding: 0.75rem 1.25rem;
font-size: 1rem;
transition: background-color 0.2s, color 0.2s, border-color 0.2s, box-shadow 0.2s;
src/components/authentication/TheLogin.vue
+30 -6
View File
@@ -12,18 +12,36 @@
class="col-md-2 d-flex flex-column justify-content-center align-items-left"
style="margin-right: -85px"
>
<img class="logo-img1" src="img/e-Rahn_Logo_FA-01.png" alt="erahn-logo" />
<img
class="logo-img1"
src="img/e-Rahn_Logo_FA-01.png"
alt="erahn-logo"
/>
</div>
<div
class="col-md-2 d-flex flex-column justify-content-center align-items-left"
>
<img class="logo-img2" src="img/Logo KoPKB_Final.png" alt="erahn-logo" />
<img
class="logo-img2"
src="img/Logo KoPKB_Final.png"
alt="erahn-logo"
/>
</div>
<div
class="col-md-2 d-flex flex-column justify-content-center align-items-left"
style="margin-left: -85px"
>
<img
class="logo-img3"
src="img/e-rahn-lelong.png"
alt="erahn-logo"
/>
</div>
</div>
</div>
<div class="text-center mb-5">
<img class="logo-img" src="img/e-rahn-lelong.png" alt="erahn-logo" />
<div class="text-200 text-3xl font-semibold mb-3 mt-2">Log Masuk</div>
<img class="logo-img" src="img/bidder.png" alt="erahn-logo" />
<div class="text-200 text-3xl font-semibold mb-3">Log Masuk</div>
<span class="text-200 font-medium line-height-3"
>Belum punyai akaun?</span
>
@@ -214,8 +232,9 @@ export default {
}
.logo-img {
width: 350px;
height: 60px;
color: white;
width: 180px;
height: 150px;
}
.logo-img1 {
@@ -228,6 +247,11 @@ export default {
height: 60px;
}
.logo-img3 {
width: 150px;
height: 30px;
}
/* .border-round{
border-radius:50px;
} */
src/components/authentication/TheRegister.vue
+10 -2
View File
@@ -22,6 +22,14 @@
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" />
<div class="text-200 text-3xl font-semibold mb-3 mt-3">Daftar Akaun</div>
</div>
<!-- <span class="text-600 font-medium line-height-3"
>Sudah punyai akaun?</span
>
<router-link
v-bind:to="{ name: 'login' }"
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
>Log masuk sekarang!</router-link
> -->
</div>
<!-- <h5>Daftar Akaun</h5> -->
<div class="grid">
@@ -253,12 +261,12 @@
/>
</div>
<div class="col-12 text-center">
<span class="text-600 font-medium line-height-3"
<span class="text-200 font-medium line-height-3"
>Sudah punyai akaun?
</span>
<router-link
v-bind:to="{ name: 'login' }"
class="font-medium no-underline ml-2 text-blue-500 cursor-pointer"
class="font-medium no-underline ml-2 text-teal-600 cursor-pointer"
>Log masuk sekarang!</router-link>
</div>
</div>
src/components/layouts/TheHeader.vue
+49 -25
View File
@@ -2,14 +2,21 @@
<!-- Navbar for laptop screen size (width>992px) -->
<Toast :breakpoints="{ '500px': { width: '100%', right: '0', left: '0' } }" />
<div class="card sticky-top lg:flex hidden border-none">
<div class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color">
<div
class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color"
>
<div class="flex align-items-center justify-content-center">
<div class="company-title" type="button" v-on:click="toHome()">
<!-- <img class="logo-img mr-2" src="img/e-rahn-lelong.png" alt="arrahn-logo" /> -->
<Button icon="pi pi-th-large" @click="visibleLeft = true" class="mr-2" />
<Button
icon="pi pi-th-large"
@click="visibleLeft = true"
class="mr-2"
/>
<!-- <div class="logo-title">E-Rahn Lelong</div> -->
</div>
</div>
<div class="flex align-items-center justify-content-center">
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" />
<!-- <nav class="main-nav">
@@ -73,21 +80,19 @@
<!-- Navbar for phone, tab screen size (width<992px) -->
<div class="card sticky-top lg:hidden md:flex border-none">
<div
class="
flex
justify-content-between
px-3
md:px-6
h-3rem
flex-wrap
main-color
"
class="flex justify-content-between px-3 md:px-6 h-3rem flex-wrap main-color"
>
<div class="flex align-items-center justify-content-center">
<div class="company-title" type="button" v-on:click="toHome()">
<!-- <div class="logo-title">E-Rahn Lelong</div> -->
<Button
icon="pi pi-th-large"
@click="visibleLeft = true"
class="mr-2"
/>
</div>
<img class="logo-img" src="img/e-rahn-lelong.png" alt="arrahn-logo" />
<!-- <div class="company-title" type="button" v-on:click="toHome()">
<div class="logo-title">E-Rahn Lelong</div>
</div> -->
</div>
<div class="flex align-items-center justify-content-center">
@@ -170,9 +175,7 @@
</div>
</Sidebar> -->
<Sidebar :visible.sync="visibleLeft" autoZIndex dismissable:false>
<!-- <h3>Left Sidebar</h3> -->
<Sidebar :visible.sync="visibleLeft" autoZIndex>
<div class="grid">
<!-- <div class="col-12">
<div class="text-center">
@@ -226,13 +229,13 @@
>Profil</router-link
>
</div>
<div class="col-12">
<!-- <div class="col-12">
<router-link
class="main-nav-link main-nav-link-sidebar"
v-bind:to="{ name: 'login' }"
>Login</router-link
>
</div>
</div> -->
<div class="col-12">
<a
class="main-nav-link main-nav-link-sidebar"
@@ -242,8 +245,7 @@
>
</div>
</div>
</Sidebar>
</Sidebar>
</template>
<script>
@@ -312,6 +314,24 @@ export default {
},
},
};
// const { createApp, ref } = Vue;
// const App = {
// setup() {
// const visibleLeft = ref(false);
// return {
// visibleLeft,
// };
// },
// components: {
// "p-sidebar": primevue.sidebar,
// "p-button": primevue.button,
// },
// };
// createApp(App).use(primevue.config.default).mount("#app");
</script>
<style scoped>
@@ -349,7 +369,7 @@ router-link:hover {
} */
.main-color {
background-color: #008F96;
background-color: #008f96;
}
.border-none {
@@ -409,10 +429,13 @@ router-link:hover {
}
.main-nav-link:hover {
color: #fff;
color:#fec234;
}
.main-nav-link-sidebar:hover {
background: #fec234;
border-radius: 10px;
padding: 7px 20px;
color: #1e417b !important;
}
@@ -423,17 +446,18 @@ router-link:hover {
}
.nav-button:hover {
color: #eaf0f9;
color: #fec234;
}
a.router-link-exact-active {
background: #d5d54f;
background: #fec234;
color: #000000;
border-radius: 10px;
padding: 7px 20px;
}
a.router-link-exact-active:hover {
background: #fec234;
color: #000000;
}