Made boxes fancier
This commit is contained in:
parent
ea2675151b
commit
17945f9a1c
53
src/main.rs
53
src/main.rs
@ -595,14 +595,16 @@ fn handle_relative_connection(
|
|||||||
);
|
);
|
||||||
|
|
||||||
let section_html = html! {
|
let section_html = html! {
|
||||||
fieldset class="dialog-block" {
|
fieldset class="visual-novel-box" {
|
||||||
@if !block.name.is_empty() {
|
@if !block.name.is_empty() {
|
||||||
legend { (block.name) }
|
legend class="character-name" { (block.name) }
|
||||||
}
|
}
|
||||||
|
div class="dialog-content" {
|
||||||
@if let Ok(content) = String::from_utf8(block_content) {
|
@if let Ok(content) = String::from_utf8(block_content) {
|
||||||
(maud::PreEscaped(content))
|
(maud::PreEscaped(content))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
sections.push(section_html);
|
sections.push(section_html);
|
||||||
@ -694,6 +696,53 @@ fn handle_relative_connection(
|
|||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.visual-novel-box {
|
||||||
|
border: 2px solid #3a3a3a;
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 20px;
|
||||||
|
margin: 1rem 0;
|
||||||
|
background: rgba(255, 255, 255, 0.9);
|
||||||
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||||
|
position: relative;
|
||||||
|
min-height: 120px;
|
||||||
|
width: 80%;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.character-name {
|
||||||
|
font-family: 'Georgia', serif;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: 0 15px;
|
||||||
|
background: #4a6b8a;
|
||||||
|
color: white;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin: 0;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dialogue-content {
|
||||||
|
font-family: 'Arial', sans-serif;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
line-height: 1.6;
|
||||||
|
color: #333;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.visual-novel-box::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: 10px;
|
||||||
|
right: 10px;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
"))
|
"))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user