overflow

components/Main/TableLaporan.js

@@ -5,8 +5,8 @@ import moment from "moment";
 
 function TableLaporan({ listData, to, linkName, status = false, noBy = false }) {
 	return (
-		<div className="card b">
-			<div className="card-body">
+		<div className="card b ">
+			<div className="card-body card-over">
 				{listData && (
 					<Datatable options={{ responsive: false }}>
 						<table className="table w-100">

components/Pemeriksaan/TableLaporan.js

@@ -6,7 +6,7 @@ import moment from "moment";
 function TableLaporan({ listData, to, linkName }) {
 	return (
 		<div className="card b">
-			<div className="card-body">
+			<div className="card-body card-over">
 				{listData && (
 					<Datatable options={{ responsive: false }}>
 						<table className="table w-100">

components/Pemeriksaan/TableRiwayat.js

@@ -2,7 +2,8 @@ import Datatable from "@/components/Tables/Datatable";
 
 function TableRiwayat({ data }) {
 	return (
-		<Datatable options={{ responsive: true }}>
+		// <Datatable options={{ responsive: true }}>
+		<div className="card-over">
 			<table className="table table-striped my-4 w-100">
 				<thead>
 					<tr>
@@ -33,7 +34,8 @@ function TableRiwayat({ data }) {
 					))}
 				</tbody>
 			</table>
-		</Datatable>
+		</div>
+		// </Datatable>
 	);
 }
 

components/Penjadwalan/TableLaporan.js

@@ -6,7 +6,7 @@ import moment from "moment";
 function TableLaporan({ listData, to, linkName }) {
 	return (
 		<div className="card b">
-			<div className="card-body">
+			<div className="card-body card-over">
 				{listData && (
 					<Datatable options={{ responsive: false }}>
 						<table className="table w-100">

components/Sanksi/TableLaporan.js

@@ -6,7 +6,7 @@ import moment from "moment";
 function TableLaporan({ listData }) {
 	return (
 		<div className="card b">
-			<div className="card-body">
+			<div className="card-body card-over">
 				{listData && (
 					<Datatable options={{ responsive: false }}>
 						<table className="table w-100">

components/Sanksi/TablePenetapanSanksi.js

@@ -44,41 +44,41 @@ export class TablePenetapanSanksi extends Component {
 					<tbody>
 						{pelanggaran
 							? pelanggaran.data.map((jp, index) => (
-									<tr key={jp._id}>
-										<td>
-											<label>{index + 1}</label>
-										</td>
-										<td>
-											<div className="media align-items-center">
-												<div className="media-body d-flex">
-													<div>
-														<p>{jp.pelanggaran}</p>
-														<p>TMT : {jp.tmt_bulan} Bulan</p>
-														<p>Jenis Sanksi Administratif : {jp.label_sanksi}</p>
-													</div>
+								<tr key={jp._id}>
+									<td>
+										<label>{index + 1}</label>
+									</td>
+									<td>
+										<div className="media align-items-center">
+											<div className="media-body d-flex">
+												<div>
+													<p>{jp.pelanggaran}</p>
+													<p>TMT : {jp.tmt_bulan} Bulan</p>
+													<p>Jenis Sanksi Administratif : {jp.label_sanksi}</p>
 												</div>
 											</div>
-										</td>
-										<td>
-											<div className="media align-items-center">
-												<div className="media-body d-flex">
-													<div>
-														<p>{jp.sanksi}</p>
-														<p>Keterangan : {jp.keterangan_sanksi}</p>
-													</div>
+										</div>
+									</td>
+									<td>
+										<div className="media align-items-center">
+											<div className="media-body d-flex">
+												<div>
+													<p>{jp.sanksi}</p>
+													<p>Keterangan : {jp.keterangan_sanksi}</p>
 												</div>
 											</div>
-										</td>
-										<td>
-											<div className="checkbox c-checkbox">
-												<label>
-													<input type="checkbox" value={jp._id} onChange={this.onHandleChange} />
-													<span className="fa fa-check"></span>
-												</label>
-											</div>
-										</td>
-									</tr>
-							  ))
+										</div>
+									</td>
+									<td>
+										<div className="checkbox c-checkbox">
+											<label>
+												<input type="checkbox" value={jp._id} onChange={this.onHandleChange} />
+												<span className="fa fa-check"></span>
+											</label>
+										</div>
+									</td>
+								</tr>
+							))
 							: ""}
 					</tbody>
 				</Table>

pages/app/index.js

@@ -60,10 +60,10 @@ class App extends Component {
 					<Jumbotron>
 						<Row className="home-1">
 							<Col lg={8} className="d-flex flex-column justify-content-center align-items-start">
-								<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>
+								<h1 className="display-5 home-2 txt-size">Sistem Informasi Pengendalian Kelembagaan Perguruan Tinggi pada Pendidikan Tinggi Akademik</h1>
+								<p className="lead txt-size">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>
+								<p className="txt-size">Disediakan kepada masyarakat untuk melaporkan pelanggaran perguruan tinggi yang menyelenggarakan pendidikan tinggi akademik</p>
 								<p className="lead">
 									{/* <Link href="/laporan/new">
 										<button className="btn btn-info btn-lg"><img className="icon-buatlaporan" src="/static/img/icon-buat-laporan.png" alt="icon"/>Buat Laporan</button>

pages/app/pemantauan/timeline.js

@@ -12,6 +12,7 @@ import Loader from "@/components/Common/Loader";
 import DetailPT from "@/components/Main/DetailPT";
 import moment from "moment";
 import Datatable from "@/components/Tables/Datatable";
+<meta name="viewport" content="width=device-width, initial-scale=1.0"></meta>
 
 
 class Pemantauan extends Component {
@@ -98,7 +99,7 @@ class Pemantauan extends Component {
 																<td>
 																	<div>
 
-																		<Button onClick={(e) => this.handleLihatPemantaun(e, data._id)}>
+																		<Button color="primary" onClick={(e) => this.handleLihatPemantaun(e, data._id)}>
 																			Detail
 																		</Button>
 

pages/app/pemeriksaan/index.js

@@ -31,17 +31,18 @@ class Pemeriksaan extends Component {
 					<div>Evaluasi</div>
 					<div className="ml-auto">
 						<Link href="/app/penjadwalan">
-							<Button className="btn-header" color="info">
-								<h4>&lt; Penjadwalan</h4>
-							</Button>
-						</Link>
-						<Link href="/app/sanksi">
 							<span className="margin-l-5">
 								<Button className="btn-header" color="info">
-									<h4>Sanksi &gt;</h4>
+									<h4>&lt; Penjadwalan</h4>
 								</Button>
 							</span>
 						</Link>
+
+						<Link href="/app/sanksi">
+							<Button className="btn-header" color="info">
+								<h4>Sanksi &gt;</h4>
+							</Button>
+						</Link>
 					</div>
 				</div>
 				<Row>

pages/app/penjadwalan/index.js

@@ -31,17 +31,18 @@ class Penjadwalan extends Component {
 					<div>Penjadwalan Evaluasi</div>
 					<div className="ml-auto">
 						<Link href="/app/pelaporan">
-							<Button className="btn-header" color="info">
-								<h4>&lt; Pelaporan</h4>
-							</Button>
-						</Link>
-						<Link href="/app/pemeriksaan">
 							<span className="margin-l-5">
 								<Button className="btn-header" color="info">
-									<h4>Pemeriksaan &gt;</h4>
+									<h4>&lt; Pelaporan</h4>
 								</Button>
 							</span>
 						</Link>
+
+						<Link href="/app/pemeriksaan">
+							<Button className="btn-header" color="info">
+								<h4>Pemeriksaan &gt;</h4>
+							</Button>
+						</Link>
 					</div>
 				</div>
 				<Row>

styles/bootstrap/_buttons.scss

@@ -243,6 +243,6 @@ input[type="button"] {
 	margin-left: 5px;
 }
 .margin-l-5{
-	margin-left: 5px;
+	margin-right: 5px;
 	display: inline;
 }

styles/bootstrap/_card.scss

@@ -293,7 +293,6 @@
 	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
 	border-radius: 5px;
 	// width: 830px;
-	height: 45px;
 	margin-bottom: 30px;
 }
 .card-title-1 {
@@ -328,3 +327,16 @@
 .home-2{
 	margin-top: 10%;
 }
+@media screen and (max-width :450px) {
+	.txt-size{
+		font-weight:400;
+	}	
+	.home-1{
+		margin:0;
+	}
+}
+
+	.card-over{
+		overflow: auto;
+	}
+