repair button dan caption pengisian laporan

components/Main/Login.js

@@ -121,11 +121,13 @@ class Login extends Component {
 						</div>
 						{/* <div className="required">* Required fields</div>
 						<span>Login Menggunakan Akun PDDIKTI</span> */}
-						<Button color="info" type="submit" block className=" mt-3 btn-login">
-							<text className="text-login">
-								<b>Login</b>
-							</text>
-						</Button>
+						<div className="btn-radius">
+							<Button color="info" type="submit" block className=" mt-3 btn-login">
+								<text className="text-login">
+									<b>Login</b>
+								</text>
+							</Button>
+						</div>
 					</form>
 				</CardBody>
 			</Card>

components/Pelaporan/InputData.js

@@ -51,10 +51,10 @@ const checkIfFilesAreCorrectType = (files) => {
 
 const selectInstanceId = 1;
 const laporanSchema = Yup.object().shape({
-	no_laporan: Yup.string().required("Wajib Diisi"),
-	keterangan: Yup.string().min(3, "Minimal 3 Huruf").max(200).required("Wajib Diisi"),
-	pelanggaran: Yup.array().min(1, "Wajib Diisi").required(),
-	dokumen: Yup.array().min(1, "Wajib Upload file").required().test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
+	no_laporan: Yup.string().required(""),
+	keterangan: Yup.string().min(3, "Minimal 3 Huruf").max(200).required(""),
+	pelanggaran: Yup.array().min(1, " ").required(),
+	dokumen: Yup.array().min(1, " ").required().test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
 });
 export class InputData extends Component {
 	constructor(props) {
@@ -256,6 +256,7 @@ export class InputData extends Component {
 									)}
 								</Field>
 								<ErrorMessage name="dokumen" component="div" className="form-text text-danger" />
+								<p className="mrgn-top-5">Ukuran setiap dokumen maksimal 15mb</p>
 							</div>
 						</FormGroup>
 

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 logo-nav" src="/static/img/Logo-vputih.png" alt="App Logo" />
+						<img className="img-fluid" 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} />
@@ -69,20 +69,24 @@ class App extends Component {
 										<button className="btn btn-info btn-lg"><img className="icon-buatlaporan" src="/static/img/icon-buat-laporan.png" alt="icon"/>Buat Laporan</button>
 									</Link> */}
 									<Link href="/laporan/new">
-										<Button color="info" className="btn-labeled">
-											<span className="btn-label">
-												<img className="icon-buatlaporan" src="/static/img/icon-buat-laporan.png" alt="icon" />
-											</span>
-											<text className="text-button-home-1">Buat Laporan</text>
-										</Button>
+										<span className="btn-radius">
+											<Button color="info" className="btn-labeled">
+												<span className="btn-label">
+													<img className="icon-buatlaporan" src="/static/img/icon-buat-laporan.png" alt="icon" />
+												</span>
+												<text className="text-button-home-1">Buat Laporan</text>
+											</Button>
+										</span>
 									</Link>
 									<Link href="/pemantauan">
-										<Button color="info" className="btn-labeled-2">
-											<span className="btn-label">
-												<img className="icon-pemantauan" src="/static/img/icon-pemantauan.png" alt="icon" />
-											</span>
-											<text className="text-button-home-1">Pemantauan</text>
-										</Button>
+										<span className="btn-radius">
+											<Button color="info" className="btn-labeled-2">
+												<span className="btn-label">
+													<img className="icon-pemantauan" src="/static/img/icon-pemantauan.png" alt="icon" />
+												</span>
+												<text className="text-button-home-1">Pemantauan</text>
+											</Button>
+										</span>
 									</Link>
 								</p>
 								<div>

pages/app/pelaporan/new.js

@@ -50,7 +50,7 @@ class PelaporanNew extends Component {
 								<CardBody>
 									<Row>
 										<Col lg={12}>
-											<p className="lead bb">Informasi Laporan</p>
+											<p className="lead bb">Informasi Laporan<span className="font-20">(wajib diisi)</span></p>
 											<InputData query={this.props.query} />
 										</Col>
 									</Row>

pages/laporan/new/index.js

@@ -48,12 +48,12 @@ const laporanSchema = Yup.object().shape({
 	nama: Yup.string().notRequired(),
 	setuju: Yup.boolean().isTrue("Harap diceklis"),
 	alamat: Yup.string().min(3, "Minimal 3 huruf").max(200, "Maksimal 200 huruf").notRequired(),
-	keterangan: Yup.string().min(3, "Minimal 3 huruf").max(200, "Maksimal 200 huruf").required("Wajib Diisi"),
+	keterangan: Yup.string().min(3, "Minimal 3 huruf").max(200, "Maksimal 200 huruf").required(""),
 	email: Yup.string().email().notRequired(),
-	pelanggaran_id: Yup.array().min(1, "Minimal terdapat 1 jenis pelanggaran").required("Wajib Diisi"),
-	pt_id: Yup.string().required("Wajib Diisi"),
+	pelanggaran_id: Yup.array().min(1, "Minimal terdapat 1 jenis pelanggaran").required(""),
+	pt_id: Yup.string().required(""),
 	foto: Yup.array().notRequired().test("filesize", "Maksimal ukuran foto 15mb", checkIfFilesAreTooBig).test("type", "harus jpeg/png", checkIfFilesAreCorrectType),
-	dokumen: Yup.array().min(1, "Wajib upload dokumen").required().test("filesize", "Maksimal ukuran dokumen 15mb", checkIfFilesAreTooBig),
+	dokumen: Yup.array().min(1, " ").required().test("filesize", "Maksimal ukuran setiap dokumen 15mb", checkIfFilesAreTooBig),
 	is_private: Yup.boolean().notRequired(),
 });
 
@@ -314,7 +314,7 @@ class App extends Component {
 												</div>
 											</FormGroup>
 											<div class="header-1">
-												<h2 class="card-title-1">Detail Laporan</h2>
+												<h2 class="card-title-1">Detail Laporan<span className="font-20">(wajib diisi)</span></h2>
 											</div>
 											{/* <p className="lead bb">Detail Laporan</p> */}
 											<FormGroup row>
@@ -326,7 +326,7 @@ class App extends Component {
 											</FormGroup>
 											<FormGroup row>
 												<label className="col-md-2 col-form-label">
-													Perguruan Tinggi yang Dilaporkan<span className="star-color">*</span>
+													Perguruan Tinggi yang Dilaporkan<span className="star-color"></span>
 												</label>
 												<div className="col-md-10">
 													<Field name="pt_id">
@@ -348,7 +348,7 @@ class App extends Component {
 											</FormGroup>
 											<FormGroup row>
 												<label className="col-md-2 col-form-label">
-													Jenis Pelanggaran<span className="star-color">*</span>
+													Jenis Pelanggaran<span className="star-color"></span>
 												</label>
 												<div className="col-md-10">
 													<Field name="pelanggaran_id">
@@ -374,7 +374,7 @@ class App extends Component {
 											</FormGroup>
 											<FormGroup row>
 												<label className="col-md-2 col-form-label">
-													Keterangan Laporan<span className="star-color">*</span>
+													Keterangan Laporan<span className="star-color"></span>
 												</label>
 												<div className="col-md-10">
 													<Field name="keterangan">{({ field }) => <Input type="textarea" {...field} />}</Field>
@@ -388,6 +388,7 @@ class App extends Component {
 												<div className="col-md-10">
 													<Field name="dokumen">{({ field, form }) => <Input type="file" multiple onChange={(e) => form.setFieldValue(field.name, Array.from(e.currentTarget.files))} />}</Field>
 													<ErrorMessage name="dokumen" component="div" className="form-text text-danger" />
+													<p className="mrgn-top-5">Ukuran setiap dokumen maksimal 15mb</p>
 												</div>
 											</FormGroup>
 											<FormGroup row>
@@ -452,7 +453,7 @@ class App extends Component {
 						</form>
 					</Modal>
 				</ContentWrapper>
-			</div>
+			</div >
 		);
 	}
 }

styles/bootstrap/_buttons.scss

@@ -182,6 +182,7 @@ input[type="button"] {
 	margin-top: 3%;
 	background: #6fb9de;
 	display: inline;
+	border-radius: 7px;
 }
 .btn-labeled-2 {
 	padding-top: 0;
@@ -223,3 +224,14 @@ input[type="button"] {
 	margin-top: 20px;
 	margin-bottom: 15px;
 }
+.btn-radius .btn-labeled-2{
+	border-radius: 7px;
+	display: inline;
+}
+.btn-radius .btn-labeled{
+	border-radius: 7px;
+	display: inline;
+}
+.btn-radius .btn-login{
+	border-radius: 7px;
+}