TRANSFORM/Mengubah Kode Menjadi Teks Berwarna di HTML: Highlighting Otomatis untuk Kode Murni dan Konten Campuran (Sumber: ChatGPT+CoPilot)
VERSI BAHASA INDONESIA:
✅ Prompt Transformasi Source Code Lampiran (Code Attachment) – Input: Hanya Source Code (Code) | Format: (hanya) Kode
Buatkan bagian isi dari halaman HTML yang menampilkan potongan kode sebagai teks, dengan pewarnaan
sintaks yang terang dan menarik menyerupai tema Visual Studio Code, seperti Monokai Bright atau
Night Owl. Gunakan elemen <pre> dan
<code>, serta <span> dan CSS untuk
menerapkan pewarnaan. Potongan kode hanya ditampilkan sebagai teks dan tidak dijalankan.
✅ Prompt Transformasi Source Code Lampiran (Code Attachment) – Input: Campuran Konten Utama (Teks) dan Source Code | Format: Campuran Teks & Kode
Ambil teks berikut yang berisi campuran penjelasan dan potongan kode. Deteksi setiap bagian yang
merupakan source code (HTML, CSS, JavaScript, dan sejenisnya), lalu ubah masing-masing bagian
tersebut menjadi blok <pre><code> dengan pewarnaan sintaks yang
terang dan menarik, mengikuti gaya tema Visual Studio Code seperti Monokai Bright atau Night Owl.
Gunakan elemen <span> dan CSS untuk mengatur pewarnaan. Biarkan bagian
teks biasa tetap seperti aslinya, tanpa perubahan.
ENGLISH VERSION:
✅ Prompt: Code Attachment Transformation – Input: Source Code Only | Format: Code (only)
Generate the body content of an HTML page that displays a code snippet as text, with
bright and visually appealing syntax highlighting similar to Visual Studio Code themes
such as Monokai Bright or Night Owl. Use the <pre> and
<code> tags for structure, and apply syntax coloring using
<span> elements and CSS. The code snippet should only be
displayed as text—do not execute it.
✅ Prompt: Code Attachment Transformation – Input: Mixed Main Content (Text) and Code | Format: Mixed Text & Code
Process the following text containing a mix of explanations and code snippets. Identify
all portions that represent source code (e.g., HTML, CSS, JavaScript, etc.), and convert
each one into a <pre><code> block with bright and
catchy syntax highlighting inspired by Visual Studio Code themes such as Monokai Bright or
Night Owl. Use <span> elements and CSS for styling. Leave all
non-code text (explanations or narrative) unchanged.
Comments