WIP - Streamlit UI, Porting CLI

README.md

@@ -7,7 +7,7 @@ Prompting is abstracted to get going sooner. Focus on your content quality, rath
 Alwrity gives personalization, factual web researched & SEO optimized content and tools for automating content & digital marketing.
 
 AI will help achieve Content Hyper-Personalization.
-
+![](https://github.com/AJaySi/AI-Writer/blob/main/lib/workspace/alwrity_ai_writer.png)
 ---
 1). [Visit alwrity.com](https://www.alwrity.com/ai-writing-tools), You will find AI content writing tools, which are Free & No-Signup.
 **Note:** Although, this is limited, as is our wallet & Resources.

lib/workspace/alwrity_config/main_config.json

@@ -1,8 +1,8 @@
 {
     "Blog Content Characteristics": {
         "Blog Length": "2000",
-        "Blog Tone": "Beginner",
+        "Blog Tone": "Casual",
-        "Blog Demographic": "Tech-savvy",
+        "Blog Demographic": "Working professional",
         "Blog Type": "Informational",
         "Blog Language": "English",
         "Blog Output Format": "markdown"

lib/workspace/alwrity_ui_styling.css

@@ -0,0 +1,137 @@
+div.row-widget.stRadio > div {
+    flex-direction: row;
+    align-items: stretch;
+}
+
+div.row-widget.stRadio > div[role="radiogroup"] > label[data-baseweb="radio"]  {
+    background-color: #9AC5F4;
+    padding-right: 10px;
+    padding-left: 4px;
+    padding-bottom: 3px;
+    margin: 4px;
+}
+/* Style for the scrollbar track */
+    ::-webkit-scrollbar-track {
+        background: #f1f1f1;
+    }
+    
+    /* Style for the scrollbar handle */
+    ::-webkit-scrollbar-thumb {
+        background-color: #888;
+        border-radius: 10px;
+        border: 3px solid #f1f1f1;
+    }
+    
+    /* Style for the scrollbar handle on hover */
+    ::-webkit-scrollbar-thumb:hover {
+        background: #555;
+    }
+    
+    /* Set the width of the scrollbar */
+    ::-webkit-scrollbar {
+        width: 16px;
+    }
+body {
+    background: #f9f9f9;
+    background-image: linear-gradient(to bottom right, #f0f8ff, #e3f2fd);
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+}
+.main-header {
+    font-size: 2.5em;
+    font-weight: bold;
+    color: #2196F3;
+    margin-bottom: 10px;
+    text-align: center;
+    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
+}
+.stApp {
+    margin-top: -80px;
+}
+.sub-header {
+    font-size: 1.75em;
+    font-weight: bold;
+    color: #ff6347;
+    margin-top: 40px;
+    margin-bottom: 10px;
+    text-align: center;
+}
+.option-box {
+    border: 2px solid #f0f0f0;
+    padding: 20px;
+    border-radius: 10px;
+    margin-bottom: 20px;
+    box-shadow: 2px 2px 12px #aaaaaa;
+    background-color: #f5f5f5;
+}
+.button {
+        background: #ff6347; /* Orange */
+        color: white;
+        border: none;
+        padding: 10px 20px;
+        border-radius: 5px; /* Rounded corners */
+        text-align: center;
+        text-decoration: none;
+        display: inline-block;
+        font-size: 16px;
+        margin: 10px 2px;
+        cursor: pointer;
+        transition: background-color 0.3s ease; /* Smooth transition for hover effect */
+        box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); /* Add a subtle shadow */
+        font-weight: bold; /* Make the text bold */
+}
+
+.button:hover {
+    background-color: #ff4d4d; /* Darker orange */
+    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3); /* Slightly larger shadow on hover */
+}
+.stTabs [role="tab"] {
+    font-size: 1.2em;
+    font-weight: bold;
+    color: white;
+    background: #673AB7;
+    padding: 10px;
+    margin: 5px;
+    border-radius: 5px;
+    border: 2px solid #ddd;
+    transition: background 0.3s ease;
+}
+.stTabs [role="tab"]:hover {
+    background: #9575CD;
+}
+.stTabs [role="tab"][aria-selected="true"] {
+    background: #D1C4E9;
+    color: #333;
+    border: 2px solid #673AB7;
+}
+.sidebar-header {
+    font-size: 1.5em;
+    font-weight: bold;
+    color: #333;
+    margin-bottom: 20px;
+}
+.sidebar-option {
+    margin-bottom: 10px;
+    font-size: 1.2em;
+    color: #2196F3;
+}
+.content-section {
+    padding: 20px;
+    margin-bottom: 30px;
+    border-radius: 10px;
+    box-shadow: 2px 2px 10px #ddd;
+    background-color: #f8f8f8;
+}
+.radio-wrapper {
+    border: 2px solid #4CAF50;
+    border-radius: 5px;
+    padding: 15px;
+    margin: 10px 0;
+    background-color: #f9f9f9;
+}
+
+.content-title {
+    font-size: 1.5em;
+    font-weight: bold;
+    margin-bottom: 10px;
+    color: #333;
+}

requirements.txt

@@ -28,3 +28,4 @@ html2image
 lxml_html_clean
 yfinance
 pandas_ta
+llama_index