menu home

components/Main/Login.js

@@ -88,19 +88,19 @@ class Login extends Component {
 	render() {
 		return (
 			<Card className="card card-flat">
-				<img className="card-img-top" src="/static/img/Logo-Sidali.png" alt="Logo" />
+				<img className="img-login-1" src="/static/img/Logo-login.png" alt="Logo" />
 				<CardBody className="card-body">
 					{" "}
 					<h5 className="card-title text-left py-2 bg-gray border-radius-login"><img className="icon-triangle" src="/static/img/icon-caution.png"></img><b>Login Menggunakan Akun PDDIKTI </b></h5>
 					{this.state.error}
 					<form onSubmit={this.onSubmit} method="post" name="formLogin">
 						<div className="form-group">
-							<label className="col-form-label">Username *</label>
+							<label className="col-form-label">Username <span className="star-color">*</span></label>
 							<Input type="text" name="username" invalid={this.hasError("formLogin", "username", "required")} onChange={this.validateOnChange} data-validate='["required"]' value={this.state.formLogin.username} />
 							{this.hasError("formLogin", "username", "required") && <span className="invalid-feedback">Field is required</span>}
 						</div>
 						<div className="form-group">
-							<label className="col-form-label">Password *</label>
+							<label className="col-form-label">Password <span className="star-color">*</span></label>
 							<Input
 								type="password"
 								id="id-password"
@@ -115,7 +115,7 @@ class Login extends Component {
 						{/* <div className="required">* Required fields</div>
 						<span>Login Menggunakan Akun PDDIKTI</span> */}
 						<Button color="info" type="submit" block className=" mt-3 btn-login">
-							Login
+							<text className="text-login"><b>Login</b></text>
 						</Button>
 					</form>
 				</CardBody>

pages/app/index.js

@@ -5,6 +5,7 @@ import ContentWrapper from "@/components/Layout/ContentWrapper";
 import Link from "next/link";
 import Login from "@/components/Main/Login";
 
+
 const menu = [
 	{
 		title: "Home",
@@ -40,7 +41,7 @@ class App extends Component {
 			<div>
 				<Navbar className="navbar-color" expand="md" dark>
 					<NavbarBrand href="/">
-						<img className="img-fluid" src="/static/img/Logo-vputih.png" alt="App Logo" />
+						<img className="img-fluid logo-nav" src="/static/img/Logo-vputih.png" alt="App Logo" />
 						<img className="img-text-vputih" src="/static/img/Logo-text-vputih.png" alt="App Logo" />
 					</NavbarBrand>
 					<NavbarToggler onClick={this.toggleCollapse} />
@@ -58,9 +59,9 @@ class App extends Component {
 				</Navbar>
 				<ContentWrapper>
 					<Jumbotron>
-						<Row>
+						<Row className="home-1">
 							<Col lg={8} className="d-flex flex-column justify-content-center align-items-start">
-								<h1 className="display-5">Sistem Informasi Pengendalian Kelembagaan Perguruan Tinggi pada Pendidikan Tinggi Akademik</h1>
+								<h1 className="display-5 home-2">Sistem Informasi Pengendalian Kelembagaan Perguruan Tinggi pada Pendidikan Tinggi Akademik</h1>
 								<p className="lead">Layanan Pelaporan Pelanggaran Perguruan Tinggi Penyelenggara Pendidikan Tinggi Akademik</p>
 								<hr className="my-4" />
 								<p>Disediakan kepada masyarakat untuk melaporkan pelanggaran perguruan tinggi yang menyelenggarakan pendidikan tinggi akademik</p>
@@ -73,7 +74,7 @@ class App extends Component {
 											<span className="btn-label">
 												<img className="icon-buatlaporan" src="/static/img/icon-buat-laporan.png" alt="icon" />
 											</span>
-											<text className="text-home-1">Buat Laporan</text>
+											<text className="text-button-home-1">Buat Laporan</text>
 										</Button>
 									</Link>
 									<Link href="/pemantauan">
@@ -81,10 +82,13 @@ class App extends Component {
 											<span className="btn-label">
 												<img className="icon-pemantauan" src="/static/img/icon-pemantauan.png" alt="icon" />
 											</span>
-											<text className="text-home-1">Pemantauan</text>
+											<text className="text-button-home-1">Pemantauan</text>
 										</Button>
 									</Link>
 								</p>
+								<p>
+									<img className="ditbaga-logo" src="/static/img/ditbaga-logo.png" alt="applogo"></img>
+								</p>
 							</Col>
 							<Col>
 								<Login />

styles/app/common/button-extra.scss

@@ -95,6 +95,7 @@
     // background: rgba(0, 0, 0, 0.05);
     display: inline-block;
     @include button-label-size($input-btn-padding-y, $input-btn-padding-x, $border-radius);
+    
 }
 
 .btn-lg .btn-label {

styles/bootstrap/_buttons.scss

@@ -170,14 +170,14 @@ input[type="button"] {
 .btn-labeled {
 	padding-top: 0;
 	padding-bottom: 0;
-	font-size: 20px;
+	margin-right: 20px;
 	margin-top: 3%;
 	background: #6fb9de;
+	display: inline;
 }
 .btn-labeled-2 {
 	padding-top: 0;
 	padding-bottom: 0;
-	margin-left: 20px;
 	margin-top: 3%;
 	background: #6fb9de;
 }

styles/bootstrap/_card.scss

@@ -320,3 +320,11 @@
 	width: 60px;
 	margin-left: auto;
 }
+.home-1 {
+	margin-left: 20px;
+	margin-right: 10px;
+	margin-top: 20px;
+}
+.home-2{
+	margin-top: 10%;
+}

styles/bootstrap/_images.scss

@@ -72,14 +72,17 @@
   height: 50px;
 }
 .icon-pemantauan {
-  width: 35px;
-  height: 35px;
-  margin-right: -20px; }
+  width: 30px;
+  height: 30px;
+ 
+  // margin-right: -20px; 
+}
 
 .icon-buatlaporan {
-  width: 35px;
-  height: 35px;
-  margin-right: -20px; }
+  width: 30px;
+  height: 30px;
+  // margin-right: -20px; 
+}
 
 .img-text-vputih {
   width: 55px;
@@ -101,4 +104,16 @@
     height: auto;
     width: 72px;
     height: 37px; }
-  
+  .ditbaga-logo{
+    margin-top: 55%;
+
+  }
+
+  .logo-nav{
+    width: 60%;
+  }
+  .img-login-1{
+    width: 97%;
+    margin-left: auto;
+    margin-right: auto;
+  }

styles/bootstrap/_type.scss

@@ -131,6 +131,14 @@ mark,
 .display-5{
   color: #000000;
 }
-.text-home-1{
+.text-button-home-1{
   font-size: 15px;
 }
+.star-color{
+  color: red;
+}
+.text-login{
+  padding: 0;
+  font-size: 15px;
+  border-radius: 10px;
+}