Youtube AI Writer Tools like yt_shorts_scripts, tags_generator, community_post_generator, shorts_script_generator
This commit is contained in:
@@ -5,6 +5,12 @@ from lib.utils.content_generators import content_planning_tools, ai_writers
|
||||
from lib.utils.alwrity_utils import ai_social_writer
|
||||
from lib.utils.seo_tools import ai_seo_tools
|
||||
from lib.utils.settings_page import render_settings_page
|
||||
# Import social media writer functions
|
||||
from lib.ai_writers.facebook_ai_writer import facebook_post_writer
|
||||
from lib.ai_writers.linkedin_ai_writer import linked_post_writer
|
||||
from lib.ai_writers.twitter_ai_writer import tweet_writer
|
||||
from lib.ai_writers.insta_ai_writer import insta_writer
|
||||
from lib.ai_writers.youtube_writers.youtube_ai_writer import youtube_main_menu
|
||||
|
||||
|
||||
def setup_ui():
|
||||
@@ -17,10 +23,41 @@ def setup_ui():
|
||||
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
|
||||
}
|
||||
|
||||
/* Compact layout styling with zero top padding when sub-tab selected */
|
||||
.main .block-container {
|
||||
padding-top: 0 !important; /* Remove all top padding */
|
||||
padding-bottom: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* Remove extra padding and margins */
|
||||
.stMarkdown {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Header styling with zero margins when in sub-tab */
|
||||
.sub-tab-active h1, .sub-tab-active h2, .sub-tab-active h3 {
|
||||
display: none; /* Hide headers in sub-tab mode */
|
||||
}
|
||||
|
||||
/* Remove extra padding in containers */
|
||||
.stMarkdown {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Header styling */
|
||||
h1, h2, h3 {
|
||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
||||
font-weight: 600;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.5rem; /* Reduced from 1rem */
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
/* Reduce spacing between elements */
|
||||
.element-container {
|
||||
margin-bottom: 0.5rem; /* Reduced from 1rem */
|
||||
}
|
||||
|
||||
/* Button styling */
|
||||
@@ -28,6 +65,7 @@ def setup_ui():
|
||||
border-radius: 8px;
|
||||
font-weight: 500;
|
||||
transition: all 0.3s ease;
|
||||
margin-bottom: 0.25rem; /* Reduced from 0.5rem */
|
||||
}
|
||||
|
||||
.stButton > button:hover {
|
||||
@@ -51,27 +89,36 @@ def setup_ui():
|
||||
.streamlit-expanderHeader {
|
||||
font-weight: 500;
|
||||
color: #2c3e50;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
/* Success message styling */
|
||||
.stSuccess {
|
||||
background: linear-gradient(135deg, #43c6ac 0%, #191654 100%);
|
||||
padding: 1rem;
|
||||
padding: 0.75rem;
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Error message styling */
|
||||
.stError {
|
||||
background: linear-gradient(135deg, #ff6b6b 0%, #ff8e8e 100%);
|
||||
padding: 1rem;
|
||||
padding: 0.75rem;
|
||||
border-radius: 8px;
|
||||
color: white;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Info message styling */
|
||||
.stInfo {
|
||||
padding: 0.75rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Sidebar navigation styling */
|
||||
.sidebar-nav {
|
||||
padding: 1rem 0;
|
||||
padding: 0.5rem 0;
|
||||
}
|
||||
|
||||
.nav-button {
|
||||
@@ -90,13 +137,157 @@ def setup_ui():
|
||||
|
||||
.nav-button:hover {
|
||||
background: rgba(0,0,0,0.05);
|
||||
padding-left: 1.5rem;
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
|
||||
.nav-button.active {
|
||||
background: #1565C0;
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* Enhanced Sub-menu styling with minimal spacing */
|
||||
.sub-menu {
|
||||
padding-left: 1rem;
|
||||
margin: 0;
|
||||
border-left: 2px solid rgba(21, 101, 192, 0.3);
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border-radius: 0 8px 8px 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
/* Sub-menu button styling with minimal gaps */
|
||||
.sub-menu .stButton > button {
|
||||
font-size: 0.9rem;
|
||||
text-align: left;
|
||||
padding: 0.4rem 0.8rem;
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #2c3e50;
|
||||
font-weight: 500;
|
||||
transition: all 0.2s ease;
|
||||
margin: 0;
|
||||
border-radius: 4px;
|
||||
min-height: 0;
|
||||
height: auto;
|
||||
line-height: 1.2;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Platform-specific button styles */
|
||||
.facebook-button .stButton > button {
|
||||
color: #4267B2;
|
||||
background: rgba(66, 103, 178, 0.1);
|
||||
}
|
||||
|
||||
.linkedin-button .stButton > button {
|
||||
color: #0077B5;
|
||||
background: rgba(0, 119, 181, 0.1);
|
||||
}
|
||||
|
||||
.twitter-button .stButton > button {
|
||||
color: #1DA1F2;
|
||||
background: rgba(29, 161, 242, 0.1);
|
||||
}
|
||||
|
||||
.instagram-button .stButton > button {
|
||||
color: #E1306C;
|
||||
background: rgba(225, 48, 108, 0.1);
|
||||
}
|
||||
|
||||
.youtube-button .stButton > button {
|
||||
color: #FF0000;
|
||||
background: rgba(255, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/* Platform-specific hover states */
|
||||
.facebook-button .stButton > button:hover {
|
||||
background: rgba(66, 103, 178, 0.2) !important;
|
||||
color: #4267B2 !important;
|
||||
}
|
||||
|
||||
.linkedin-button .stButton > button:hover {
|
||||
background: rgba(0, 119, 181, 0.2) !important;
|
||||
color: #0077B5 !important;
|
||||
}
|
||||
|
||||
.twitter-button .stButton > button:hover {
|
||||
background: rgba(29, 161, 242, 0.2) !important;
|
||||
color: #1DA1F2 !important;
|
||||
}
|
||||
|
||||
.instagram-button .stButton > button:hover {
|
||||
background: rgba(225, 48, 108, 0.2) !important;
|
||||
color: #E1306C !important;
|
||||
}
|
||||
|
||||
.youtube-button .stButton > button:hover {
|
||||
background: rgba(255, 0, 0, 0.2) !important;
|
||||
color: #FF0000 !important;
|
||||
}
|
||||
|
||||
/* Platform-specific active states */
|
||||
.facebook-button.active .stButton > button {
|
||||
background: #4267B2 !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.linkedin-button.active .stButton > button {
|
||||
background: #0077B5 !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.twitter-button.active .stButton > button {
|
||||
background: #1DA1F2 !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.instagram-button.active .stButton > button {
|
||||
background: #E1306C !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
.youtube-button.active .stButton > button {
|
||||
background: #FF0000 !important;
|
||||
color: white !important;
|
||||
}
|
||||
|
||||
/* Remove any extra spacing from button containers */
|
||||
.sub-menu .stButton {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.sub-menu > div {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.sub-menu .element-container {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Ensure minimal gaps between elements */
|
||||
.sub-menu > div:not(:last-child) {
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
/* Sidebar icon styling */
|
||||
.sidebar-icon {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.sidebar-icon img {
|
||||
width: 80px !important;
|
||||
height: auto !important;
|
||||
margin: 0 auto;
|
||||
}
|
||||
</style>
|
||||
""", unsafe_allow_html=True)
|
||||
|
||||
@@ -106,6 +297,10 @@ def setup_alwrity_ui():
|
||||
# Initialize session state for active tab if not exists
|
||||
if 'active_tab' not in st.session_state:
|
||||
st.session_state.active_tab = "Content Planning"
|
||||
|
||||
# Initialize session state for active sub-tab if not exists
|
||||
if 'active_sub_tab' not in st.session_state:
|
||||
st.session_state.active_sub_tab = None
|
||||
|
||||
# Define the navigation items with their icons and functions
|
||||
nav_items = {
|
||||
@@ -113,7 +308,7 @@ def setup_alwrity_ui():
|
||||
"AI Writers": ("📝", ai_writers),
|
||||
"Agents Teams": ("🤝", lambda: st.subheader("Agents Teams - Coming Soon!")),
|
||||
"AI SEO Tools": ("🔍", ai_seo_tools),
|
||||
"AI Social Tools": ("📱", ai_social_writer),
|
||||
"AI Social Tools": ("📱", None), # Set to None as we'll handle this separately
|
||||
"Ask Alwrity": ("💬", lambda: (
|
||||
st.subheader("Chat with your Data, Chat with any Data.. COMING SOON !"),
|
||||
st.markdown("Create a collection by uploading files (PDF, MD, CSV, etc), or crawl a data source (Websites, more sources coming soon."),
|
||||
@@ -121,6 +316,15 @@ def setup_alwrity_ui():
|
||||
)),
|
||||
"ALwrity Settings": ("⚙️", render_settings_page)
|
||||
}
|
||||
|
||||
# Define sub-menu items for AI Social Tools
|
||||
social_tools_submenu = {
|
||||
"Facebook": ("📘", lambda: facebook_post_writer()),
|
||||
"LinkedIn": ("💼", lambda: linked_post_writer()),
|
||||
"Twitter": ("🐦", lambda: tweet_writer()),
|
||||
"Instagram": ("📸", lambda: insta_writer()),
|
||||
"YouTube": ("🎥", lambda: youtube_main_menu())
|
||||
}
|
||||
|
||||
# Create sidebar navigation
|
||||
st.sidebar.markdown("### ALwrity Options")
|
||||
@@ -129,12 +333,106 @@ def setup_alwrity_ui():
|
||||
# Create navigation buttons
|
||||
for name, (icon, func) in nav_items.items():
|
||||
button_class = "nav-button active" if st.session_state.active_tab == name else "nav-button"
|
||||
if st.sidebar.button(f"{icon} {name}", key=f"nav_{name}",
|
||||
help=f"Navigate to {name}", use_container_width=True):
|
||||
st.session_state.active_tab = name
|
||||
|
||||
if name == "AI Social Tools":
|
||||
# For AI Social Tools, we'll create a button that toggles the sub-menu
|
||||
if st.sidebar.button(f"{icon} {name}", key=f"nav_{name}",
|
||||
help=f"Navigate to {name}", use_container_width=True):
|
||||
st.session_state.active_tab = name
|
||||
# Reset sub-tab when main tab changes
|
||||
st.session_state.active_sub_tab = None
|
||||
|
||||
# If AI Social Tools is active, show the sub-menu
|
||||
if st.session_state.active_tab == "AI Social Tools":
|
||||
st.sidebar.markdown('<div class="sub-menu">', unsafe_allow_html=True)
|
||||
|
||||
# Create sub-menu buttons
|
||||
for sub_name, (sub_icon, sub_func) in social_tools_submenu.items():
|
||||
# Create the button with a custom key that includes the platform name
|
||||
button_key = f"sub_{sub_name}"
|
||||
|
||||
# Determine if this button is active
|
||||
is_active = st.session_state.active_sub_tab == sub_name
|
||||
|
||||
# Create a container with the platform-specific class
|
||||
platform_class = f"{sub_name.lower()}-button"
|
||||
if is_active:
|
||||
platform_class += " active"
|
||||
|
||||
# Add the platform-specific class to the button container
|
||||
st.sidebar.markdown(f'<div class="{platform_class}">', unsafe_allow_html=True)
|
||||
|
||||
# Create the button
|
||||
if st.sidebar.button(f"{sub_icon} {sub_name}", key=button_key,
|
||||
help=f"Navigate to {sub_name}", use_container_width=True):
|
||||
st.session_state.active_sub_tab = sub_name
|
||||
|
||||
# Close the div
|
||||
st.sidebar.markdown('</div>', unsafe_allow_html=True)
|
||||
|
||||
st.sidebar.markdown('</div>', unsafe_allow_html=True)
|
||||
else:
|
||||
# For other navigation items, create regular buttons
|
||||
if st.sidebar.button(f"{icon} {name}", key=f"nav_{name}",
|
||||
help=f"Navigate to {name}", use_container_width=True):
|
||||
st.session_state.active_tab = name
|
||||
# Reset sub-tab when main tab changes
|
||||
st.session_state.active_sub_tab = None
|
||||
|
||||
st.sidebar.markdown('</div>', unsafe_allow_html=True)
|
||||
|
||||
# Add the AskAlwrity icon at the bottom of sidebar
|
||||
st.sidebar.markdown('<div class="sidebar-icon">', unsafe_allow_html=True)
|
||||
icon_path = os.path.join("lib", "workspace", "AskAlwrity-min.ico")
|
||||
if os.path.exists(icon_path):
|
||||
st.sidebar.image(icon_path, use_container_width=False)
|
||||
st.sidebar.markdown('</div>', unsafe_allow_html=True)
|
||||
|
||||
# Display content based on active tab
|
||||
st.title(f"{nav_items[st.session_state.active_tab][0]} {st.session_state.active_tab}")
|
||||
nav_items[st.session_state.active_tab][1]()
|
||||
if st.session_state.active_tab == "AI Social Tools":
|
||||
if not st.session_state.active_sub_tab:
|
||||
# Only show title and info when no sub-tab is selected
|
||||
st.markdown("""
|
||||
<style>
|
||||
.main .block-container {
|
||||
padding-top: 0.25rem !important;
|
||||
}
|
||||
</style>
|
||||
""", unsafe_allow_html=True)
|
||||
st.title(f"{nav_items[st.session_state.active_tab][0]} {st.session_state.active_tab}")
|
||||
st.info("Please select a social media platform from the sidebar.")
|
||||
else:
|
||||
# When a platform is selected, show no title and minimize spacing
|
||||
st.markdown("""
|
||||
<style>
|
||||
.main .block-container {
|
||||
padding-top: 0 !important;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
/* Remove all margins and padding from content area */
|
||||
.element-container {
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
/* Hide any automatic headers */
|
||||
.main .block-container > div:first-child {
|
||||
margin-top: 0 !important;
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
</style>
|
||||
""", unsafe_allow_html=True)
|
||||
# Call the function directly without any title
|
||||
social_tools_submenu[st.session_state.active_sub_tab][1]()
|
||||
else:
|
||||
st.markdown("""
|
||||
<style>
|
||||
.main .block-container {
|
||||
padding-top: 0.25rem !important;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
""", unsafe_allow_html=True)
|
||||
st.title(f"{nav_items[st.session_state.active_tab][0]} {st.session_state.active_tab}")
|
||||
nav_items[st.session_state.active_tab][1]()
|
||||
Reference in New Issue
Block a user