muqriz
/
SIBS2024


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248
							<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <!-- https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP -->
    <!-- CSP is a PITA ;). Disabled, don't try this at home!-->
    <meta http-equiv="Content-Security-Policy" content="">
    <!-- include bulma css -->
    <link rel="stylesheet" href="bulma/css/bulma.min.css">
    <title>My Test App</title>
    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
    integrity="sha512-abc123..." crossorigin="anonymous" />

    <style>
        /* CSS */
        .button-23 {
            background-color: #FFFFFF;
            border: 1px solid #222222;
            border-radius: 8px;
            box-sizing: border-box;
            color: #222222;
            cursor: pointer;
            display: inline-block;
            font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
            font-size: 15px;
            font-weight: 600;
            line-height: 20px;
            margin: 0;
            outline: none;
            padding: 13px 23px;
            position: relative;
            text-align: center;
            text-decoration: none;
            touch-action: manipulation;
            transition: box-shadow .2s, -ms-transform .1s, -webkit-transform .1s, transform .1s;
            user-select: none;
            -webkit-user-select: none;
            width: auto;
        }

        .button-23:focus-visible {
            box-shadow: #222222 0 0 0 2px, rgba(255, 255, 255, 0.8) 0 0 0 4px;
            transition: box-shadow .2s;
        }

        .button-23:active {
            background-color: #F7F7F7;
            border-color: #000000;
            transform: scale(.96);
        }

        .button-23:disabled {
            border-color: #DDDDDD;
            color: #DDDDDD;
            cursor: not-allowed;
            opacity: 1;
        }

        .map-svg {
            display: block;
            margin: 0 auto;
            filter: drop-shadow(-16px 11px 2px rgba(0, 0, 0, 0.5));

            a {
                transition: all 1s;
                transform-origin: 50% 50%;
                text-decoration: none;
                filter: drop-shadow(3px 10px 5px rgb(0 0 0 / 0.4));

                @media only screen and (min-width: 992px) {

                    polygon,
                    &:hover {
                        cursor: pointer;
                        transform: scale(1.05);
                        filter: drop-shadow(0px 15px 12px rgb(0 0 0 / 0.7));

                        .st0 {
                            fill: $dark-default;
                        }
                    }
                }
            }

            .pahang-barat {
                fill: #427bba;
            }

            .pahang-tengah {
                fill: #144172;
            }

            .pahang-timur {
                fill: #0c6088;
            }

            .label-text {
                font-size: 35px;
                fill: white;
                transform: translate(0,
                        3px);
                /* adjust vertical position to centre text */
            }

            .label-text-cameron {
                font-size: 20px;
                fill: white;
                transform: translate(0,
                        3px);
                /* adjust vertical position to centre text */
            }
        }
    </style>
    <script>
        // window.addEventListener('load', (event) => {
        //     document.querySelector(".hello").textContent = "Hello from Electron with bulma css!";
        // });
    </script>
</head>

<body>
    <section class="section" style="max-height: 100vh;">

        <div class="" style="background-color: #1F3F6D; min-height: 50px; display: flex; align-items: center;padding-left: 100px;">
            <h6 style="color: white;margin-right: 1em;" class=""><a style="color: white;" href="index.html"><i class="fas fa-chevron-left"></i></a></h6>
            <h6 style="color: white;">Jerantut</h6>
        </div>

        <div class="text-center pt-5" style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
            <button type="button" class="p-1" style="font-weight: 500;border-top: 4px solid #BF3030; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pembangunan&emsp;&emsp;</button>
            <button type="button" class="p-1" style="font-weight: 500;border-top: 4px solid #3B47E0; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Penternakan&emsp;&emsp;</button>
            <button type="button" class="p-1" style="font-weight: 500;border-top: 4px solid #E2E236; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Pertanian&emsp;&emsp;</button>
            <button type="button" class="p-1" style="font-weight: 500;border-top: 4px solid #32A740; border-right: none; border-bottom: none; border-left: none; margin: 0; background-color: transparent;">&emsp;&emsp;Industri&emsp;&emsp;</button>
        </div>

        <div class="text-center pt-1" style="background-color: white; min-height: 50px; display: flex; justify-content: center; align-items: center; padding-left: 100px;">
            <div class="pt-5" style="width: 600px;height: 100px;">
                <svg class="map-svg" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
                    xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-30 -30 1150 1150"
                    style="enable-background: new 0 0 1080 1080" xml:space="preserve">
                    <g>
                        <a href="testing.html" data-area="jerantut">
                            <path id="jerantut" class="pahang-barat" d="M431.5,110.2c5.4,5.9,6.4,12.3,2.5,19.5c-3.7,6.8-4.5,14.3-3.7,21.9h0c6.1,6.2,11.1,12-3.4,12.9
                                        c-4.7,0.3-7.1,4.1-9.8,7.3c-3.3,9.5-3.4,18.6,2.6,27.4c4.8,7.1,2.7,15.3,3.2,23.1c6.7,4.2,9.9,10.2,9.4,18.1c0,0.4-0.1,0.9,0,1.3
                                        c10.5,20.1,4.7,41.2,3.7,62c3.3,0.8,6.6,1.5,9.9,2.3c7.1,1.7,16,3.6,16.1,11.6c0.1,7.7-5.5,14.9-13.2,18.9c-4.1,2.1-8.1,4.6-12.5,6
                                        c-7.9,2.5-18.2,1.9-15.2,15.6c0.5,2.3-6.1,5.6-8,2.5c-6.5-10.5-22-8.4-27-20.7c-2.8-6.9-11.3-6.5-16.5-10.9c-3.7-3.2-7.2-0.5-7,4.7
                                        c0.1,2.9,0.7,5.8,1,8.7c1.1,4.1,2.7,7.5,6.1,10.6c8.4,7.6,7.2,14.4-2.8,19.2c-1.9,0.9-3.9,1.4-5.9,2.1c-21.4,6.9-22.1,9.7-4.7,25.1
                                        c6,5.3,8.7,9.3,0.1,14c-0.5,3.7-0.3,7.7-1.6,11.1c-3.6,9.5,3.7,13.5,8.9,11.1c15.5-7.3,33.5-5.8,48.3-14.7c0,0,0,0,0,0
                                        c0.8-5.5,3.8-8.5,9.4-7.2c5.9,1.4,7.7,5.6,6.9,11.5c-0.6,4.5-0.6,9.1-0.9,13.7c0,0,0,0,0,0c4.4,1,8.2-1.1,12.2-2.3
                                        c3.7-1.1,9.5-2.2,10.5,1.2c4.4,13.6,15.3,8.5,23.6,8.4c9.1-0.2,14.2,3.1,16.9,11.3c0.5,1.6,1.3,3.1,2.2,4.5
                                        c3.7,5.7,4.8,16.6,12.2,15.5c7-1,11.5-10.1,16-16.9c7.6-11.4,9.9-23.7,8.1-37c-0.7-5.4,0.2-10.7,7.1-11c6.5-0.3,11.1,2.7,12.9,9.6
                                        c1,3.9-2,10,5,11.3c0,0,0,0,0,0c7.8-9.7,17.1-3.1,25.9-2.3c0,0,0,0,0,0c9.3-10.9,18.8-4,28.3-1.1c0.9,0,2,0.4,3.1,0.8
                                        c10.6-0.9,20.1,8.8,31.2,3.3c15.2-9,12.5-28.7,24.3-40.1c5.4-5.2,11.4-9.6,16.9-14.7c5.9-5.6,10.6,1.1,13.3,6.4
                                        c4.9,9.6,10.1,7.4,12.2-0.6c4.4-16.9,14.8-26.4,31.2-30.2c1.5-3.4,3.2-6.9,1.2-10.6c-6-11.1-1.7-19.8,6.2-27.7c0,0,0,0,0,0
                                        c-3.8-3.3-7.7-6.5-11.2-10.1c-3.6-3.6-5.9-9.1-1.6-12.4c10.9-8.4,9.7-18.2,6-29.2c-1.3-3.9,1.5-7.3,3.7-10.4
                                        c2.5-3.5,4.2-7.3,3.4-11.8c-1.1-6.5,1.8-11.4,6.7-15.5c2.9-2.4,6.2-4.9,6.9-8.9c2.2-12.1,8.6-17.9,24.1-13.2
                                        c-4.2-8.1-7.4-14.8-3.2-20.1c12.5-15.7,0.6-26.4-7.1-37.8c-5.6-8.2-13-10.7-23.1-5.7c-9.3,4.6-20.1,5.9-28.9-0.9
                                        c-10.7-8.2-17.2-19.4-18.1-33.4c-0.4-6.2-1.4-12,7.1-13.5c4.7-0.8,6.7-3.9,4-8.3c-2.6-4.2-1.9-7.1,2.2-9.4c1.8-1,3.6-1.8,3.3-4.6
                                        c-1.7-15.9-19.5-28.8-35.8-25.6c-3.4,0.7-6.5,1.3-10,0.6c-21.3-4.2-39.7-13-51.6-32.3c-2.2-3.6-5.3-7-9.6-7.8
                                        c-5.9-1.2-10.9-10.1-16.8-4.9c-5.9,5.2-2.8,13.2-0.6,20.2c1.5,4.6,4.9,10,0.1,14.1c-4.1,3.5-10.8,3.2-14.5,0.9
                                        c-10.1-6.3-14.5-0.7-20.1,6.4c-8.4,10.4-13.2,10.3-23,1.2c-2.5-2.3-4.6-5-6.9-7.4c-7.6-7.9-33.2-11.8-42.8-6.8
                                        c-3.7,1.9-2.3,4.5-2.2,7.4c0.2,12.7-10,19.1-17.9,26c-6.4,5.5-13.4-0.5-19.5-4.2c-13.3-8-23.5-3.9-28.1,11c0,0,0,0,0,0
                                        C414.2,86.1,420.9,98.6,431.5,110.2z" />
                        </a>
                    </g>
                </svg>

                
            </div>
        </div>

        
        <div class="text-center pt-5" style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px;margin-top: 250px;">
           <h6>Pembangunan</h6><br>

        </div>
        <div class="text-center pt-2 text-nowrap" style="background-color: white; display: flex; justify-content: left; align-items: left; padding-left: 100px; margin-top: 0;gap: 10px;padding-right: 100px;">
            <a href="detail.html" style="border: 1px solid #209028; color: #209028;" class="button-23 mb-2" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2 mr-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
            <a href="detail.html" class="button-23 mb-2" style="background-color: #1F9027; color: white; border: none;" role="button">HSD 23453</a>
        </div>
        
        
        <!-- <div class="row justify-content-center">
            <div class="col-lg-6 text-right">
                
            </div>
            <div class="col-lg-6 text-left">
                <div class="pt-5" style="width: 500px;height: auto;">
                    <h3 class="pb-2">Pembangunan</h3>

                    <a href="detail.html" class="button-23 mb-2" role="button">HSD 23453</a>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>
                    <button class="button-23 mb-2" style="background-color: #1F9027;color: white;border: none;"
                        role="button">HSD 23453</button>


                </div>
            </div>
        </div> -->


        <div class="container justify-content-center">


        </div>
    </section>

    <script defer src="/ruta relativa a mi archivo .js"></script>

</body>

</html>