Compare commits

...

2 Commits

3 changed files with 44 additions and 38 deletions

View File

@ -10,20 +10,32 @@ 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:
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.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.text("Dodaj zdjęcie, które chcesz zanonimizować", font_size="1.2em"),
rx.upload( rx.upload(
rx.vstack(rx.text("Drag and drop files here or click to select files"),), rx.vstack(rx.text("Przeciągnij albo kliknij, aby wybrać pliki"),),
border=f"1px dotted {color}", border=f"1px dotted {color}",
padding="5em",), padding="5em",),
rx.hstack(rx.foreach(rx.selected_files, rx.text)), rx.hstack(rx.foreach(rx.selected_files, rx.text)),
rx.button( "Upload", rx.button( "Załaduj zdjęcie",
on_click=lambda: State.handle_upload( on_click=lambda: State.handle_upload(
rx.upload_files()),), rx.upload_files()),),
rx.button("Clear", #rx.button("Clear",
on_click=rx.clear_selected_files), # on_click=rx.clear_selected_files),),
rx.foreach( rx.foreach(
State.img, lambda img: rx.image(src=f'/{img}')), State.img,
padding="5em", 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",
width = "125px"),
padding="1em"
),
padding="3em",
) )
))

View File

@ -4,26 +4,14 @@ import reflex as rx
from blurme import styles from blurme import styles
import asyncio import asyncio
#class State(rx.State):
# def __init__(self):
# super().__init__()
# self.dark_mode_state: bool = False
# def __str__(self):
# self.dark_mode_state
# def toggle_dark_mode(self) -> None:
# self.dark_mode_state = not self.dark_mode_state
# text_color = styles.text_color_light if self.dark_mode_state == True else styles.text_color_dark
# styles.text_color = text_color
# print(f"Dark Mode State: {self.dark_mode_state}")
# print(f"Current Text Color: {text_color}")
# pass
class State(rx.State): class State(rx.State):
"""The app state.""" """The app state."""
# The images to show. # The images to show.
img: list[str] = [] img: list[str] = []
# Dark mode status
#dark_mode: bool = False
async def handle_upload(self, files: list[rx.UploadFile]): async def handle_upload(self, files: list[rx.UploadFile]):
"""Handle the upload of file(s). """Handle the upload of file(s).
Args: Args:
@ -36,11 +24,30 @@ class State(rx.State):
# Save the file. # Save the file.
with open(outfile, "wb") as file_object: with open(outfile, "wb") as file_object:
file_object.write(upload_data) file_object.write(upload_data)
# Update the img var. # Update the img var.
self.img.append(file.filename) self.img.append(file.filename)
self.img = self.img self.img = self.img
print(f"Current Text Color: {self.img[0]}") def delete_image(self, img_name: str):
if img_name in self.img:
self.img.remove(img_name)
self.img=self.img
#async def toggle_dark_mode(self):
# self.dark_mode = not self.dark_mode
# print(f"Dark Mode State: {self.dark_mode}")
#class State(rx.State):
# def __init__(self):
# super().__init__()
# self.dark_mode_state: bool = False
# def __str__(self):
# self.dark_mode_state
# def toggle_dark_mode(self) -> None:
# self.dark_mode_state = not self.dark_mode_state
# text_color = styles.text_color_light if self.dark_mode_state == True else styles.text_color_dark
# styles.text_color = text_color
# print(f"Dark Mode State: {self.dark_mode_state}")
# print(f"Current Text Color: {text_color}")
# pass

View File

@ -13,9 +13,6 @@ text_color_light = "black"
text_color_dark = "white" text_color_dark = "white"
accent_text_color = "black" accent_text_color = "black"
accent_color = "linear-gradient(linear-gradient(43deg, rgba(201,238,248,1) 18%, rgba(253,210,227,0.7792366946778712) 86%)" accent_color = "linear-gradient(linear-gradient(43deg, rgba(201,238,248,1) 18%, rgba(253,210,227,0.7792366946778712) 86%)"
#linear-gradient(120deg, #d299c2 0%, #fef9d7 100%);"
#linear-gradient(to top, #d9afd9 0%, #97d9e1 100%);"
hover_accent_color = {"_hover": {"color": accent_color}} hover_accent_color = {"_hover": {"color": accent_color}}
hover_accent_bg = {"_hover": {"bg": accent_color}} hover_accent_bg = {"_hover": {"bg": accent_color}}
content_width_vw = "90vw" content_width_vw = "90vw"
@ -43,16 +40,6 @@ overlapping_button_style = {
"border_radius": border_radius, "border_radius": border_radius,
} }
#base_style = {
# rx.MenuButton: {
# "width": "3em",
# "height": "3em",
# **overlapping_button_style,
# },
# rx.MenuItem: hover_accent_bg,
#}
markdown_style = { markdown_style = {
"code": lambda text: rx.code(text, color="#1F1944", bg="#EAE4FD", margin="10px 0"), "code": lambda text: rx.code(text, color="#1F1944", bg="#EAE4FD", margin="10px 0"),
"a": lambda text, **props: rx.link( "a": lambda text, **props: rx.link(