<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Prompt Sanctuary</title>
    <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='icon/favicon.ico') }}">

    <!-- Google Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Caveat&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">

    <!-- CSS -->
    <link rel="stylesheet" href="{{ url_for('static', filename='style/login.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='style/footer.css') }}">

    <!-- JavaScript -->
    <script src="{{ url_for('static', filename='script/login.js') }}"></script>
    <script src="{{ url_for('static', filename='script/particles.min.js') }}"></script>
    <script>
        particlesJS.load('particles-js', '{{ url_for('static', filename='script/particles.json') }}', function() {
            console.log('particles.js loaded - callback');
        });
    </script>

    <!-- SEO Meta Tags -->
    <meta name="description" content="Explore the functionalities of Prompt Sanctuary - a platform for generating and refining prompts. Access a Community Prompt, generate custom prompts, and explore advanced prompting features.">
    <meta name="keywords" content="prompt sanctuary, prompt generator, Community Prompt, advanced prompting, prompt refinement, prompt generation, writing prompts, creative writing, prompt ideas, writing inspiration, writing exercises, writing generator, story prompts, fiction prompts, writing tools, writing community, writing resources, idea generator, story ideas, writing challenges, writing help, narrative prompts, plot inspiration, storytelling aids, writer's block solutions, creative story ideas, plot development tools, character creation prompts, dialogue prompts, writing prompt app, daily writing prompts, inspiration for writers, story starter, creative writing exercises, fictional writing prompts, writing prompt generator online, flash fiction prompts, novel writing prompts, writing practice, creative brainstorming, storytelling generator, prompting, prompt, llm, llama, gemini, openai, chatgpt">

    <!-- Open Graph / Facebook -->
    <meta property="og:type" content="website">
    <meta property="og:url" content="https://sanctuary01.pythonanywhere.com/">
    <meta property="og:title" content="Prompt Sanctuary">
    <meta property="og:description" content="Explore the functionalities of Prompt Sanctuary - a platform for generating and refining prompts. Access a Community Prompt, generate custom prompts, and explore advanced prompting features.">

    <!-- Twitter -->
    <meta property="twitter:card" content="summary_large_image">
    <meta property="twitter:url" content="https://sanctuary01.pythonanywhere.com/">
    <meta property="twitter:title" content="Prompt Sanctuary">
    <meta property="twitter:description" content="Explore the functionalities of Prompt Sanctuary - a platform for generating and refining prompts. Access a Community Prompt, generate custom prompts, and explore advanced prompting features.">
</head>

<body>
    <div id="particles-js"></div>
    <h1><strong>Prompt Sanctuary</strong></h1>

    <!-- main container -->
    <div class="main">

        <!-- welcome -->
        <div class="welcome">
            <p>Welcome to Prompt Sanctuary, Please Login to Explore the functionalities of our platform</p>
        </div>
        <!-- welcome end -->

        <!-- forms -->
        <div class="container">
            <!-- login -->
            <form id="loginForm" action="/login" method="post">
                <h2>Login</h2>
                <input type="text" name="honeypot" style="display:none;">
                <label for="usernameLogin">Username:</label>
                <input type="text" id="usernameLogin" name="username" required>
                <label for="passwordLogin">Password:</label>
                <input type="password" id="passwordLogin" name="password" required>
                <button type="submit">Login</button>
                <p id="signupLink">Don't have an account? <a href="#" onclick="toggleForms()">Signup Now</a></p>
            </form>
            <!-- login end -->

            <!-- signup -->
            <form id="signupForm" action="/signup" method="post">
                <h2>Signup</h2>
                <input type="text" name="honeypot" style="display:none;">
                <label for="usernameSignup">Username:</label>
                <input type="text" id="usernameSignup" name="username" required>
                <label for="passwordSignup">Password:</label>
                <input type="password" id="passwordSignup" name="password" required>
                <label for="confirmPassword">Confirm Password:</label>
                <input type="password" id="confirmPassword" name="confirmPassword" required>
                <button type="submit">Signup</button>
                <p id="loginLink">Already have an account? <a href="#" onclick="toggleForms()">Login</a></p>
            </form>
            <!-- signup end -->
        </div>
        <!-- forms ended -->
    </div>
    <!-- main container ended -->

    <!-- footer -->
    <footer>
        <p>prompt sanctuary by <a href="https://1999azzar.github.io/1999AZZAR/" target="_blank">azzar budiyanto</a></p>
    </footer>
    <!-- footer end -->
</body>
</html>
