import gradio as gr

theme = gr.themes.Base(
    text_size=gr.themes.Size(lg="16px", 
                             md="20px", # body
                             sm="12px", 
                             xl="40px", # h2
                             xs="10px", 
                             xxl="50px", # h1 
                             xxs="9px"),
    #spacing_size="lg",
)

css = """
h1, h2{
    text-align: center;
}

"""

with gr.Blocks(theme=theme, css=css) as demo:
    # Title
    gr.Markdown("""
    # AI and Fashion E-Commerce
    <center> by <a href="https://www.tonyassi.com/" target="_blank">Tony Assi</a>  </center> 
    <br>
    <center><i> A collection of projects I've done at the intersection of AI and fashion e-commerce, with an emphasis on computer vision and stable diffusion. </i></center> 
    
    ---
    Table of Contents

    1. [Virtual Try-On](#1)
    2. [Sales Forecasting with Image Regressionn](#2)
    3. [Text-to-Image Clothing Designer](#3)
    4. [Sketch to Fashion Design](#4)
    5. [Segment Clothing](#5)
    6. [Clothing Search by Sketch](#6)
    7. [Image to Fashion Article](#7)
    8. [Clothing Feature Prediction](#8)

    """)

    # Virtual Try-On
    gr.Markdown("""
    ---
    ## Virtual Try-On <a name="1"></a>
    ![image/jpeg](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/mARmPyep7W3MwGmvR_zWN.jpeg)

    Virtually try-on clothing by submitting your image and a clothing image. A novel approach to VTO using IP-Adapter inpainting and body segmentation. [Read more](https://huggingface.co/blog/tonyassi/virtual-try-on-ip-adapter)

    [![Hugging Face Spaces](https://img.shields.io/badge/%F0%9F%A4%97%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/tonyassi/fashion-try-on)

    [![Google Colab](https://colab.research.google.com/assets/colab-badge.svg)](https://colab.research.google.com/drive/1d-NJNLdX6dqs5Qfm1UYDQknBrhwZXx7R?usp=sharing)
    """)

    # Sales Forecasting with Image Regression
    gr.Markdown("""

    ---
    ## Sales Forecasting with Image Regression <a name="2"></a>
    ![image/png](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/mrtzCY91RnLtnbx4LIj4x.png)
    Predict sales from a product image. Image regression training, hosting, and inference. [Read more](https://huggingface.co/blog/tonyassi/image-regression)

    [![Github](https://img.shields.io/badge/Github-Repo-blue)](https://github.com/TonyAssi/ImageRegression)

    [![Model](https://img.shields.io/badge/%F0%9F%A4%97-Models-yellow)](https://huggingface.co/tonyassi/sales-prediction)

    """)    

    # Text-to-Image Clothing Designer
    gr.Markdown("""

    ---
    ## Text-to-Image Clothing Designer <a name="3"></a>
    ![image/png](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/Y-EuOGASjO-GMUzjlBCIh.png)

    This text-to-image model was fine-tuned on [Lucy in the Sky](https://www.lucyinthesky.com/) product image - product text pairs. Text input is limited to the language of the product catalog it was trained on which forces the model to generate images in a simialr style to the product images.

    [![Hugging Face Spaces](https://img.shields.io/badge/%F0%9F%A4%97%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/LucyintheSky/lucy-text-to-image)
    """)  

    # Sketch to Fashion Design
    gr.Markdown("""

    ---
    ## Sketch to Fashion Design <a name="4"></a>
    ![image/png](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/tnLduEwy4JfiDdoI2D6Bc.png)

    Convert a sketch into a photorealistic garment on a model.

    [![Hugging Face Spaces](https://img.shields.io/badge/%F0%9F%A4%97%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/tonyassi/sketch-to-fashion-design)
    """)  

    # Segment Clothing
    gr.Markdown("""

    ---
    ## Segment Clothing <a name="5"></a>

    ![image/png](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/PWrFOLtggkm3NroFMEjfI.png)

    Segment clothing from an image.

    [![Hugging Face Spaces](https://img.shields.io/badge/%F0%9F%A4%97%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/tonyassi/clothing-segmentation)

    [![Github](https://img.shields.io/badge/Github-Repo-blue)](https://github.com/TonyAssi/Segment-Clothing)
    """)  

    # Clothing Search by Sketch
    gr.Markdown("""

    ---
    ## Clothing Search by Sketch <a name="6"></a>
    ![image/png](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/YMxC5GrzSHXmzcl9iqLmQ.png)

    Search for a clothing by sketching it.
   
    [![Hugging Face Spaces](https://img.shields.io/badge/%F0%9F%A4%97%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/tonyassi/sketch-to-fashion-collection)

    """)  

    # Image to Fashion Article
    gr.Markdown("""

    ---
    ## Image to Fashion Article <a name="7"></a>

    ![image/png](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/E7vtF_rHntAt47ExuO_5_.png)

    [![Hugging Face Spaces](https://img.shields.io/badge/%F0%9F%A4%97%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/tonyassi/image-to-fashion-article)

    """) 

    # Clothing Feature Prediction
    gr.Markdown("""

    ---
    ## Clothing Feature Prediction <a name="8"></a>

    ![image/png](https://cdn-uploads.huggingface.co/production/uploads/648a824a8ca6cf9857d1349c/BnYb7-6hii0WFC7NsU0m4.png)
    Predicts anywhere between 0-36 clothing features. Fine-tined on [Lucy in the Sky](https://www.lucyinthesky.com/) product catalog.
    
    [![Hugging Face Spaces](https://img.shields.io/badge/%F0%9F%A4%97%20Hugging%20Face-Spaces-blue)](https://huggingface.co/spaces/LucyintheSky/feature-prediction)

    [![Model](https://img.shields.io/badge/%F0%9F%A4%97-Models-yellow)](https://huggingface.co/LucyintheSky/lucy-feature-prediction)
    
    """) 

demo.launch()