s352038
/
BlurMe
3
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

BLUR-46

This commit is contained in:
markrz12 2024-01-10 14:16:32 +01:00
parent b6dc97e6c6
commit 3aec48263b
1 changed files with 28 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
blurme/pages/settings.py
View File

@ -9,14 +9,26 @@ color = "rgb(107,99,246)"
@template(route="/settings", title="Zdjęcie", image = "/image-icon.png") @template(route="/settings", title="Zdjęcie", image = "/image-icon.png")
def settings() -> rx.Component: def settings() -> rx.Component:
icon_style = {"width": "20px", "height": "30px", "margin-right": "10px"}
return rx.vstack( return rx.vstack(
rx.heading("BlurMe", font_size="3em", margin_bottom="25px", background_image="linear-gradient(271.68deg, #7566fe 0.75%, #f96caf 88.52%)", background_clip="text", padding = "10px"),
rx.text("Dodaj zdjęcie, które chcesz zanonimizować", font_size="1.2em"), rx.wrap(
rx.upload( rx.hstack(
rx.vstack(rx.text("Przeciągnij albo kliknij, aby wybrać pliki"),), rx.vstack(
rx.image(src="/brush-logo.png",height="5.2em", margin_bottom="15px"),
rx.heading("Anonimizuj już teraz!", font_size="2em", margin_bottom="15px", background_image="linear-gradient(271.68deg, #7566fe 0.75%, #f96caf 88.52%)", background_clip="text", padding = "5px"),
rx.text("Dodaj zdjęcie, wybierz obszar i ukryj tożsamość: Anonimizacja zdjęć w mgnieniu oka – szybko, łatwo, bezpłatnie!", font_size="1.2em", text_align = "center"), width = "50%", margin_left = "50px"),
rx.vstack(rx.upload(
rx.vstack(rx.image(src="/upload-icon.png",height="5em"),
rx.text("Przeciągnij, aby wybrać pliki", font_size = "1em"),
rx.text("albo", font_size = "0.8em"),
rx.button("Kliknij", font_size = "1em", color="rgba(117,102,254,255)"),
rx.text(" "),
rx.text("Dostępne rozszerzenia plików: png, jpg, webp, tiff", font_size = "0.8em"),),
border=f"1px dotted {color}", border=f"1px dotted {color}",
padding="5em", padding="1em",
width = "90%",
multiple=True, multiple=True,
accept={ accept={
"image/png": [".png"], "image/png": [".png"],
@ -24,53 +36,36 @@ def settings() -> rx.Component:
"image/webp": [".webp"], "image/webp": [".webp"],
"image/tiff": [".tif", ".tiff"], }, "image/tiff": [".tif", ".tiff"], },
max_files=5, max_files=5,
margin_top = "15px",
), ),
rx.hstack(rx.foreach(rx.selected_files, rx.text)), rx.hstack(rx.foreach(rx.selected_files, rx.text)),
rx.button( "Załaduj zdjęcie", rx.button( "Załaduj zdjęcie",
on_click=lambda: State.handle_upload( on_click=lambda: State.handle_upload(
rx.upload_files()),color = "rgba(47, 187, 74,255)"), rx.upload_files()),color = "rgba(47, 187, 74,255)"),width = "60%", margin_left = "50px"),), margin_bottom = "25px", style={"align-self": "center", "align-items": "flex-start"}, spacing="2em"),
rx.responsive_grid( rx.responsive_grid(
rx.foreach( rx.foreach(
State.img, State.img,
lambda img: rx.vstack( lambda img: rx.vstack(
rx.image(src=f'/{img}', height = "200px"), rx.image(src=f'/{img}', max_height = "450px"),
rx.text(img), rx.text(img, font_size="15px" ),
rx.hstack(rx.button("Usuń", rx.hstack(rx.button(rx.icon(tag="delete", margin_right = "8px"), " Usuń",
on_click=lambda img_name=img: State.delete_image(img_name), color="rgba(255, 75, 42,255)", on_click=lambda img_name=img: State.delete_image(img_name), color="rgba(255, 75, 42,255)",
width = "125px"), width = "100px"),
rx.button("Anonimizuj", rx.button(rx.icon(tag="edit", margin_right = "8px"), " Anonimizuj",
on_click=lambda img_name=img: State.image_anonymization(img_name), on_click=lambda img_name=img: State.image_anonymization(img_name),
width = "125px"), width = "130px"),
rx.button("Pobierz", rx.button(rx.icon(tag="download", margin_right = "8px"), " Pobierz",
on_click=lambda img_name=img: State.download_image(img_name), on_click=lambda img_name=img: State.download_image(img_name),
width = "125px"), width = "100px"),
padding="1em" padding="1em"
), ),
), ),
),columns=[2], ),columns=[1],
spacing="5px", spacing="5px",
#rx.foreach(
# State.img,
# lambda img: rx.vstack(
# rx.image(src=f'/{img}', max_width = "800px"),
# rx.hstack(rx.button("Usuń",
# on_click=lambda img_name=img: State.delete_image(img_name),
# width = "125px"),
# rx.button("Anonimizuj",
# width = "125px"),
# rx.button("Pobierz",
# on_click=lambda img_name=img: State.download_image(img_name),
# width = "125px"),
# padding="1em"
# ),
# padding="3em",
),) ),)