<![CDATA[Indonesian Local Community - Indo Devs]]> https://www.indolokal.com/r1/ Fri, 05 Jun 2026 18:37:09 +0000 MyBB <![CDATA[MyCode Hashtag to Google]]> https://www.indolokal.com/r1/Thread-Generate-AI-MyCode-Hashtag-to-Google Tue, 15 Apr 2025 04:20:41 +0000 Terzier]]> https://www.indolokal.com/r1/Thread-Generate-AI-MyCode-Hashtag-to-Google Google Search

Short Description
Cari dengan Google

Regex
Code:
\[(gsearch|google)=(.*?)\]

Replacement
Code:
<a href="https://www.google.com/search?q=$2" target="_blank">#$2,</a>

Preview
#tutorial mybb,]]> Google Search

Short Description
Cari dengan Google

Regex
Code:
\[(gsearch|google)=(.*?)\]

Replacement
Code:
<a href="https://www.google.com/search?q=$2" target="_blank">#$2,</a>

Preview
#tutorial mybb,]]> <![CDATA[HTML5 Responsif Detail Barang]]> https://www.indolokal.com/r1/Thread-Generate-AI-HTML5-Responsif-Detail-Barang Mon, 14 Apr 2025 05:45:13 +0000 Terzier]]> https://www.indolokal.com/r1/Thread-Generate-AI-HTML5-Responsif-Detail-Barang
PHP Code:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Detail Barang</title>
    <style>
        .detail-container {
            width: 90%;
            max-width: 800px;
            margin: 20px auto;
            border: 1px solid #ddd;
            padding: 15px;
            box-sizing: border-box;
            border-radius: 5px;
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
        }

        .detail-item {
            display: flex;
            align-items: center;
            background-color: #f9f9f9;
            border: 1px solid #eee;
            padding: 10px;
            border-radius: 5px;
        }

        .detail-label {
            font-weight: bold;
            margin-right: 5px;
            background-color: #90EE90; /* Hijau pedesaan */
            padding: 5px;
            border-radius: 3px;
            color: #333;
        }

        .colon-separator {
            margin-right: 5px;
            font-weight: bold;
            color: #333;
        }

        .detail-value {
            background-color: #ADD8E6; /* Biru langit */
            padding: 5px;
            border-radius: 3px;
            color: #333;
            transition: transform 0.1s ease-in-out; /* Transisi untuk efek hover lainnya (jika ada) */
        }

        /* Efek getar saat hover */
        .detail-value:hover {
            animation: shake 0.7s;
            animation-iteration-count: infinite;
        }

        @keyframes shake {
            0% { transform: translate(1px, 1px) rotate(0deg); }
            10% { transform: translate(-1px, -2px) rotate(-1deg); }
            20% { transform: translate(-3px, 0px) rotate(1deg); }
            30% { transform: translate(3px, 2px) rotate(0deg); }
            40% { transform: translate(1px, -1px) rotate(1deg); }
            50% { transform: translate(-1px, 2px) rotate(-1deg); }
            60% { transform: translate(-3px, 1px) rotate(0deg); }
            70% { transform: translate(3px, 1px) rotate(-1deg); }
            80% { transform: translate(-1px, -1px) rotate(1deg); }
            90% { transform: translate(1px, 2px) rotate(0deg); }
            100% { transform: translate(1px, -2px) rotate(-1deg); }
        }

        /* Layout vertikal untuk layar kecil */
        @media (max-width: 600px) {
            .detail-container {
                display: grid;
                grid-template-columns: auto auto 1fr;
                gap: 8px 10px;
            }

            .detail-item {
                display: contents;
                background-color: transparent;
                border: none;
                padding: 0;
            }

            .detail-label {
                grid-column: 1 / 2;
                margin-right: 0;
            }

            .colon-separator {
                grid-column: 2 / 3;
                text-align: center;
            }

            .detail-value {
                grid-column: 3 / 4;
            }

            .detail-value:hover {
                animation: none; /* Menonaktifkan animasi getar pada layar kecil (opsional) */
            }
        }
    </style>
</head>
<body>
    <div class="detail-container">
        <div class="detail-item">
            <div class="detail-label">Kondisi Barang</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Baru</div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Harga</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Rp. 500.000,00</div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Status</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Terjual</div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Daerah</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Jawa Tengah</div>
        </div>
    </div>
</body>
</html> 


.png   Screenshot_702.png (Size: 26.36 KB / Downloads: 2)
.png   Screenshot_703.png (Size: 4.97 KB / Downloads: 2) ]]>
PHP Code:
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Detail Barang</title>
    <style>
        .detail-container {
            width: 90%;
            max-width: 800px;
            margin: 20px auto;
            border: 1px solid #ddd;
            padding: 15px;
            box-sizing: border-box;
            border-radius: 5px;
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
        }

        .detail-item {
            display: flex;
            align-items: center;
            background-color: #f9f9f9;
            border: 1px solid #eee;
            padding: 10px;
            border-radius: 5px;
        }

        .detail-label {
            font-weight: bold;
            margin-right: 5px;
            background-color: #90EE90; /* Hijau pedesaan */
            padding: 5px;
            border-radius: 3px;
            color: #333;
        }

        .colon-separator {
            margin-right: 5px;
            font-weight: bold;
            color: #333;
        }

        .detail-value {
            background-color: #ADD8E6; /* Biru langit */
            padding: 5px;
            border-radius: 3px;
            color: #333;
            transition: transform 0.1s ease-in-out; /* Transisi untuk efek hover lainnya (jika ada) */
        }

        /* Efek getar saat hover */
        .detail-value:hover {
            animation: shake 0.7s;
            animation-iteration-count: infinite;
        }

        @keyframes shake {
            0% { transform: translate(1px, 1px) rotate(0deg); }
            10% { transform: translate(-1px, -2px) rotate(-1deg); }
            20% { transform: translate(-3px, 0px) rotate(1deg); }
            30% { transform: translate(3px, 2px) rotate(0deg); }
            40% { transform: translate(1px, -1px) rotate(1deg); }
            50% { transform: translate(-1px, 2px) rotate(-1deg); }
            60% { transform: translate(-3px, 1px) rotate(0deg); }
            70% { transform: translate(3px, 1px) rotate(-1deg); }
            80% { transform: translate(-1px, -1px) rotate(1deg); }
            90% { transform: translate(1px, 2px) rotate(0deg); }
            100% { transform: translate(1px, -2px) rotate(-1deg); }
        }

        /* Layout vertikal untuk layar kecil */
        @media (max-width: 600px) {
            .detail-container {
                display: grid;
                grid-template-columns: auto auto 1fr;
                gap: 8px 10px;
            }

            .detail-item {
                display: contents;
                background-color: transparent;
                border: none;
                padding: 0;
            }

            .detail-label {
                grid-column: 1 / 2;
                margin-right: 0;
            }

            .colon-separator {
                grid-column: 2 / 3;
                text-align: center;
            }

            .detail-value {
                grid-column: 3 / 4;
            }

            .detail-value:hover {
                animation: none; /* Menonaktifkan animasi getar pada layar kecil (opsional) */
            }
        }
    </style>
</head>
<body>
    <div class="detail-container">
        <div class="detail-item">
            <div class="detail-label">Kondisi Barang</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Baru</div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Harga</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Rp. 500.000,00</div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Status</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Terjual</div>
        </div>
        <div class="detail-item">
            <div class="detail-label">Daerah</div>
            <div class="colon-separator">:</div>
            <div class="detail-value">Jawa Tengah</div>
        </div>
    </div>
</body>
</html> 


.png   Screenshot_702.png (Size: 26.36 KB / Downloads: 2)
.png   Screenshot_703.png (Size: 4.97 KB / Downloads: 2) ]]> <![CDATA[Generate AI]]> https://www.indolokal.com/r1/Thread-Generate-AI-Generate-AI Thu, 10 Apr 2025 06:55:59 +0000 Terzier]]> https://www.indolokal.com/r1/Thread-Generate-AI-Generate-AI
Quote:Tidak Ada Layanan, Silahkan Pilih Media Lain atau Putar Media Lain

PHP Code:
<!DOCTYPE html>
<html>
<head>
<title>Aktif/Nonaktifkan Input Password dengan Pesan Default</title>
<style>
  .container {
    display: flex;
    align-items: center;
  }

  #txt {
    width: 400px; /* Atur lebar dalam piksel */
  }

  #chkLabel {
    margin-left: 10px;
  }
</style>
</head>
<body>

  <div class="container">
    <input type="textarea" id="txt" value="Tidak Ada Layanan, Silahkan Pilih Media Lain atau Putar Media Lain" disabled><br>
    <input type="checkbox" id="chk">
    <label for="chk" id="chkLabel">Aktifkan Untuk Mengisi</label>
  </div>

  <script>
    const pwdInput = document.getElementById("txt");
    const chkBox = document.getElementById("chk");
    const defaultText = "Tidak Ada Layanan, Silahkan Pilih Media Lain atau Putar Media Lain";

    chkBox.onchange = function(e) {
      if (chkBox.checked) {
        pwdInput.disabled = false;
        pwdInput.value = "";
      } else {
        pwdInput.disabled = true;
        pwdInput.value = defaultText;
      }
    };
  </script>

</body>
</html> 
]]>
Quote:Tidak Ada Layanan, Silahkan Pilih Media Lain atau Putar Media Lain

PHP Code:
<!DOCTYPE html>
<html>
<head>
<title>Aktif/Nonaktifkan Input Password dengan Pesan Default</title>
<style>
  .container {
    display: flex;
    align-items: center;
  }

  #txt {
    width: 400px; /* Atur lebar dalam piksel */
  }

  #chkLabel {
    margin-left: 10px;
  }
</style>
</head>
<body>

  <div class="container">
    <input type="textarea" id="txt" value="Tidak Ada Layanan, Silahkan Pilih Media Lain atau Putar Media Lain" disabled><br>
    <input type="checkbox" id="chk">
    <label for="chk" id="chkLabel">Aktifkan Untuk Mengisi</label>
  </div>

  <script>
    const pwdInput = document.getElementById("txt");
    const chkBox = document.getElementById("chk");
    const defaultText = "Tidak Ada Layanan, Silahkan Pilih Media Lain atau Putar Media Lain";

    chkBox.onchange = function(e) {
      if (chkBox.checked) {
        pwdInput.disabled = false;
        pwdInput.value = "";
      } else {
        pwdInput.disabled = true;
        pwdInput.value = defaultText;
      }
    };
  </script>

</body>
</html> 
]]>