|
|
<!DOCTYPE html> |
|
|
<html lang="en" class="dark"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>CodeNest - Android Studio Clone</title> |
|
|
<link rel="stylesheet" href="style.css"> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
|
|
<script src="https://unpkg.com/feather-icons"></script> |
|
|
<script> |
|
|
tailwind.config = { |
|
|
darkMode: 'class', |
|
|
theme: { |
|
|
extend: { |
|
|
colors: { |
|
|
primary: { |
|
|
500: '#3DDC84', |
|
|
600: '#2BB673' |
|
|
}, |
|
|
secondary: { |
|
|
500: '#4285F4', |
|
|
600: '#3367D6' |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</head> |
|
|
<body class="bg-gray-100 dark:bg-gray-900 h-screen flex flex-col"> |
|
|
<custom-navbar></custom-navbar> |
|
|
|
|
|
<div class="flex flex-1 overflow-hidden"> |
|
|
<custom-sidebar></custom-sidebar> |
|
|
|
|
|
<main class="flex-1 overflow-auto bg-white dark:bg-gray-800"> |
|
|
<div class="flex h-full"> |
|
|
|
|
|
<div class="flex-1 flex flex-col border-r border-gray-200 dark:border-gray-700"> |
|
|
<div class="border-b border-gray-200 dark:border-gray-700 p-2 flex items-center justify-between bg-gray-50 dark:bg-gray-700"> |
|
|
<div class="flex space-x-2"> |
|
|
<span class="px-3 py-1 text-xs rounded-full bg-primary-500 text-white">MainActivity.kt</span> |
|
|
<span class="px-3 py-1 text-xs rounded-full bg-gray-200 dark:bg-gray-600 text-gray-700 dark:text-gray-300">Manifest.xml</span> |
|
|
</div> |
|
|
<div class="flex space-x-2"> |
|
|
<button class="p-1 rounded hover:bg-gray-200 dark:hover:bg-gray-600"> |
|
|
<i data-feather="minimize-2" class="w-4 h-4"></i> |
|
|
</button> |
|
|
<button class="p-1 rounded hover:bg-gray-200 dark:hover:bg-gray-600"> |
|
|
<i data-feather="maximize-2" class="w-4 h-4"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex-1 overflow-auto p-4 font-mono text-sm"> |
|
|
<pre class="text-gray-800 dark:text-gray-200"> |
|
|
package com.example.myapplication |
|
|
|
|
|
import androidx.appcompat.app.AppCompatActivity |
|
|
import android.os.Bundle |
|
|
import android.widget.Button |
|
|
import android.widget.Toast |
|
|
|
|
|
class MainActivity : AppCompatActivity() { |
|
|
override fun onCreate(savedInstanceState: Bundle?) { |
|
|
super.onCreate(savedInstanceState) |
|
|
setContentView(R.layout.activity_main) |
|
|
|
|
|
val button = findViewById<Button>(R.id.button) |
|
|
button.setOnClickListener { |
|
|
Toast.makeText(this, "Hello from CodeNest!", Toast.LENGTH_SHORT).show() |
|
|
} |
|
|
} |
|
|
}</pre> |
|
|
</div> |
|
|
|
|
|
<div class="border-t border-gray-200 dark:border-gray-700 p-2 bg-gray-50 dark:bg-gray-700 flex justify-between items-center"> |
|
|
<div class="text-xs text-gray-500 dark:text-gray-400">Ln 10, Col 12</div> |
|
|
<div class="flex space-x-2"> |
|
|
<span class="text-xs text-gray-500 dark:text-gray-400">UTF-8</span> |
|
|
<span class="text-xs text-gray-500 dark:text-gray-400">LF</span> |
|
|
<span class="text-xs text-gray-500 dark:text-gray-400">Kotlin</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="w-1/3 flex flex-col border-l border-gray-200 dark:border-gray-700"> |
|
|
<div class="border-b border-gray-200 dark:border-gray-700 p-2 bg-gray-50 dark:bg-gray-700 flex items-center justify-between"> |
|
|
<h3 class="font-medium text-gray-700 dark:text-gray-300">Design Preview</h3> |
|
|
<div class="flex space-x-2"> |
|
|
<button class="p-1 rounded hover:bg-gray-200 dark:hover:bg-gray-600"> |
|
|
<i data-feather="refresh-cw" class="w-4 h-4"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="flex-1 overflow-auto p-4 bg-gray-100 dark:bg-gray-900 flex items-center justify-center"> |
|
|
<div class="bg-white dark:bg-gray-800 rounded-lg shadow-lg w-full max-w-md"> |
|
|
<div class="p-4 border-b border-gray-200 dark:border-gray-700"> |
|
|
<h3 class="text-lg font-medium text-gray-900 dark:text-white">My Application</h3> |
|
|
</div> |
|
|
<div class="p-4"> |
|
|
<button class="w-full py-2 px-4 bg-primary-500 hover:bg-primary-600 text-white rounded-md transition-colors"> |
|
|
Click Me! |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</main> |
|
|
</div> |
|
|
|
|
|
<custom-statusbar></custom-statusbar> |
|
|
|
|
|
<script src="components/navbar.js"></script> |
|
|
<script src="components/sidebar.js"></script> |
|
|
<script src="components/statusbar.js"></script> |
|
|
<script src="script.js"></script> |
|
|
<script>feather.replace();</script> |
|
|
<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script> |
|
|
</body> |
|
|
</html> |
