perbaiki menu home

components/Main/Login.js

@@ -72,7 +72,7 @@ class Login extends Component {
 				} else if ([2020, 2021].includes(auth.data.user.role.id)) {
 					Router.push({ pathname: "/app/pemantauan" });
 				} else {
-					this.setState({ error: "Akun tidak ada" })
+					this.setState({ error: "Akun tidak ada" });
 				}
 			}
 		} catch (error) {
@@ -88,19 +88,26 @@ 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>
+					<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="text-warning">*</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="text-warning">*</span>
+							</label>
 							<Input
 								type="password"
 								id="id-password"
@@ -115,7 +122,9 @@ 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

@@ -40,7 +40,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 +58,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 +73,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 +81,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>
+								<div>
+									<img className="ditbaga-logo" src="/static/img/ditbaga-logo.png" alt="applogo" />
+								</div>
 							</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;
+}