basic layout adjustments

README.md

@@ -1,9 +1,15 @@
 # Clever Letter Generator
-### AI Powered Custom Cover Letters
+### AI-Powered Professional Cover Letters
 
 ---
 
-NOTE: In this version, login is optional and the api calls are paid by the site owner.
+### Live Demo
+https://www.morossini.me/cleverletter/
+
+---
+
+### About This Version
+In this version, login is optional and the api calls are paid by the site owner.
 For a version in which both authentication and a user OpenAI API key are required, go to branch [login_required](https://github.com/joaomorossini/Clever-Letter-Generator/tree/login_required)
 
 ---

templates/base_1.html

@@ -7,8 +7,10 @@
         <meta http-equiv="X-UA-Compatible" content="ie=edge">
         <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
         <link href="static/css/styles.css" rel="stylesheet">
-        <title>{% block title %}
-        {% endblock title %}</title>
+        <title>
+            {% block title %}
+            {% endblock title %}
+        </title>
         <link rel="icon" type="image/x-icon" href="static/img/favicon.png">
     </head>
 
@@ -26,7 +28,8 @@
                 {% endif %}
             {% endwith %}
         </div>
-        <div class="container col-md-6 col-lg-5 col-xl-3 justify-content-center mt-5 p-5 border rounded-3 bg-dark-subtle mx-auto">
+
+        <div class="container col-md-7 col-lg-10 col-xl-4 justify-content-center mt-5 p-5 border rounded-3 bg-dark-subtle mx-auto">
             <div class="d-flex flex-column align-items-center">
                 <a href="{{ url_for('login')}}">
                     <img src="{{ url_for('static', filename='img/logo.png') }}"  height="40" style="vertical-align:top">

templates/login.html

@@ -18,10 +18,13 @@
             </li>
             <li class="nav-item" role="presentation">
                 <a class="nav-link border" id="tab-skip" data-mdb-toggle="pill" href="{{ url_for('generator') }}" role="tab"
-                   aria-controls="pills-skip" aria-selected="false">Access as Guest</a>
+                   aria-controls="pills-skip" aria-selected="false">Guest Access</a>
             </li>
         </ul>
         <!-- Pills navs -->
+{#        <div class="text-center">#}
+{#            <a href="{{ url_for('generator') }}">Skip login and continue as guest</a>#}
+{#        </div>#}
 
         <form method="POST" action="">
             {{ form.hidden_tag() }}

templates/signup.html

@@ -5,19 +5,20 @@
 {% endblock title %}
 
 {% block content %}
+
         <!-- Pills navs -->
         <ul class="nav nav-pills nav-justified mb-3" id="ex1" role="tablist">
             <li class="nav-item me-2" role="presentation">
                 <a class="nav-link active" id="tab-register" data-mdb-toggle="pill" href="{{ url_for('signup') }}" role="tab"
-                   aria-controls="pills-register" aria-selected="false">Sign Up</a>
+                   aria-controls="pills-register" aria-selected="true">Sign Up</a>
             </li>
             <li class="nav-item me-2" role="presentation">
                 <a class="nav-link border" id="tab-login" data-mdb-toggle="pill" href="{{ url_for('login') }}" role="tab"
-                   aria-controls="pills-login" aria-selected="true">Login</a>
+                   aria-controls="pills-login" aria-selected="false">Login</a>
             </li>
             <li class="nav-item" role="presentation">
                 <a class="nav-link border" id="tab-skip" data-mdb-toggle="pill" href="{{ url_for('generator') }}" role="tab"
-                   aria-controls="pills-skip" aria-selected="false">Access as Guest</a>
+                   aria-controls="pills-skip" aria-selected="false">Guest Access</a>
             </li>
         </ul>
         <!-- Pills navs -->