savanni
/
monorepo
1
0
Fork 0
Code Issues 68 Pull Requests Projects 6 Releases Wiki Activity

Refactor the HTML and improve the styling #81

Merged
savanni merged 4 commits from file-service/html-refactoring into main 2023-10-26 04:11:33 +00:00
Conversation 0 Commits 4 Files Changed 3 +37 -111
3 changed files with 37 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
file-service/src/html.rs
View File

@ -236,92 +236,3 @@ impl Html for Button {
)
}
}
#[derive(Clone, Debug)]
pub struct Image {
path: String,
attributes: Attributes,
}
impl Image {
pub fn new(path: &str) -> Self {
Self {
path: path.to_owned(),
attributes: Attributes::default(),
}
}
pub fn with_attributes<'a>(
mut self,
values: impl IntoIterator<Item = (&'a str, &'a str)>,
) -> Self {
self.attributes = Attributes(
values
.into_iter()
.map(|(a, b)| (a.to_owned(), b.to_owned()))
.collect::<Vec<(String, String)>>(),
);
self
}
}
impl Html for Image {
fn to_html_string(&self) -> String {
format!(
"<img src={path} {attrs} />",
path = self.path,
attrs = self.attributes.to_string()
)
}
}
#[derive(Debug)]
pub struct UnorderedList {
children: Vec<String>,
attributes: Attributes,
}
impl UnorderedList {
pub fn new() -> Self {
Self {
children: vec![],
attributes: Attributes::default(),
}
}
pub fn with_attributes<'a>(
mut self,
values: impl IntoIterator<Item = (&'a str, &'a str)>,
) -> Self {
self.attributes = Attributes(
values
.into_iter()
.map(|(a, b)| (a.to_owned(), b.to_owned()))
.collect::<Vec<(String, String)>>(),
);
self
}
}
impl Html for UnorderedList {
fn to_html_string(&self) -> String {
let children = self
.children
.iter()
.map(|item| format!("<li>{}</li>", item.to_html_string()))
.collect::<Vec<String>>();
format!(
"<ul {attrs}>
{children}
</ul>",
attrs = self.attributes.to_string(),
children = children.join("\n")
)
}
}
impl HtmlContainer for UnorderedList {
fn add_html<H: Html>(&mut self, html: H) {
self.children.push(html.to_html_string())
}
}

48
file-service/src/pages.rs
View File

@ -4,32 +4,35 @@ use file_service::{FileHandle, FileInfo, ReadFileError};
pub fn auth(_message: Option<String>) -> build_html::HtmlPage {
build_html::HtmlPage::new()
.with_title("Authentication")
.with_title("Sign In")
.with_stylesheet("/css")
.with_container(
Container::new(ContainerType::Div)
.with_attributes([("class", "authentication-page")])
.with_container(auth_form()),
)
}
fn auth_form() -> Container {
Container::default()
.with_attributes([("class", "card authentication-form")])
.with_html(
Form::new()
.with_path("/auth")
.with_method("post")
.with_container(
Container::new(ContainerType::Div)
.with_attributes([("class", "card authentication-form")])
.with_html(
Form::new()
.with_path("/auth")
.with_method("post")
.with_container(
Container::new(ContainerType::Div)
.with_attributes([("class", "authentication-form__label")])
.with_html(Label::new("for-token-input", "Authentication")),
)
.with_container(
Container::new(ContainerType::Div)
.with_attributes([("class", "authentication-form__input")])
.with_html(
Input::new("password", "password")
.with_id("for-token-input")
.with_attributes([("size", "50")]),
),
),
Input::new("password", "password")
.with_id("for-token-input")
.with_attributes([
("size", "50"),
("class", "authentication-form__input"),
]),
)
.with_html(
Button::new("Sign In")
.with_attributes([("class", "authentication-form__button")]),
),
),
)
@ -87,15 +90,16 @@ pub fn thumbnail(info: &FileInfo) -> Container {
.with_html(
Container::new(ContainerType::Div).with_link(
format!("/{}", *info.id),
Image::new(&format!("{}/tn", *info.id))
.with_attributes([("class", "thumbnail__image")])
Container::default()
.with_attributes([("class", "thumbnail")])
.with_image(&format!("{}/tn", *info.id), "test data")
.to_html_string(),
),
)
.with_html(
Container::new(ContainerType::Div)
.with_html(
UnorderedList::new()
Container::new(ContainerType::UnorderedList)
.with_attributes(vec![("class", "thumbnail__metadata")])
.with_html(info.name.clone())
.with_html(format!("{}", info.created.format("%Y-%m-%d"))),

11
file-service/templates/style.css
View File

@ -29,6 +29,7 @@ body {
justify-content: center;
align-items: center;
height: 200px;
margin: 8px;
}
.authentication-form {
@ -133,6 +134,16 @@ body {
.authentication-form {
width: 100%;
display: flex;
flex-direction: column;
}
.authentication-form__input {
font-size: x-large;
}
.authentication-form__button {
font-size: x-large;
}
.upload-form__selector {