Simplified writing of the tab styles
This commit is contained in:
parent
8e790e2409
commit
09815b04f4
111
src/main.rs
111
src/main.rs
@ -593,6 +593,62 @@ impl<'a> RequestData<'a> {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
static GENERAL_TAB_STYLE: &str = r"
|
||||||
|
.tab-system {
|
||||||
|
margin: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-radio {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-nav {
|
||||||
|
display: flex;
|
||||||
|
gap: 5px;
|
||||||
|
margin-bottom: -1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-button {
|
||||||
|
padding: 8px 15px;
|
||||||
|
background: #f0f0f0;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-bottom: 1px solid transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
border-radius: 4px 4px 0 0;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-button:hover {
|
||||||
|
background: #e0e0e0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-radio:checked + .tab-button {
|
||||||
|
background: white;
|
||||||
|
border-color: #ddd;
|
||||||
|
border-bottom-color: white;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-content {
|
||||||
|
display: none;
|
||||||
|
padding: 15px;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
}";
|
||||||
|
|
||||||
|
fn write_tab_styles(stream: &mut TcpStream, count: usize) {
|
||||||
|
let _ = writeln!(stream, "<style>");
|
||||||
|
let _ = write!(stream, "{GENERAL_TAB_STYLE}");
|
||||||
|
|
||||||
|
for i in 1..count {
|
||||||
|
let _ = write!(stream, "#tab-{i}:checked ~ #content-{i},");
|
||||||
|
}
|
||||||
|
let _ = writeln!(
|
||||||
|
stream,
|
||||||
|
"#tab-{count}:checked ~ #content-{count} {{ display: block; }}"
|
||||||
|
);
|
||||||
|
let _ = writeln!(stream, "</style>");
|
||||||
|
}
|
||||||
|
|
||||||
fn handle_relative_connection(
|
fn handle_relative_connection(
|
||||||
info: Arc<SharedSiteInfo>,
|
info: Arc<SharedSiteInfo>,
|
||||||
mut stream: TcpStream,
|
mut stream: TcpStream,
|
||||||
@ -820,60 +876,7 @@ fn handle_relative_connection(
|
|||||||
|
|
||||||
let count = sections.len();
|
let count = sections.len();
|
||||||
|
|
||||||
let _ = write!(stream, "<style>");
|
write_tab_styles(&mut stream, count);
|
||||||
|
|
||||||
let general_style = r"
|
|
||||||
.tab-system {
|
|
||||||
margin: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-radio {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-nav {
|
|
||||||
display: flex;
|
|
||||||
gap: 5px;
|
|
||||||
margin-bottom: -1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-button {
|
|
||||||
padding: 8px 15px;
|
|
||||||
background: #f0f0f0;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-bottom: 1px solid transparent;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 4px 4px 0 0;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-button:hover {
|
|
||||||
background: #e0e0e0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-radio:checked + .tab-button {
|
|
||||||
background: white;
|
|
||||||
border-color: #ddd;
|
|
||||||
border-bottom-color: white;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tab-content {
|
|
||||||
display: none;
|
|
||||||
padding: 15px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
}";
|
|
||||||
|
|
||||||
let _ = write!(stream, "{general_style}");
|
|
||||||
for i in 1..count {
|
|
||||||
let _ = write!(stream, "#tab-{i}:checked ~ #content-{i},");
|
|
||||||
}
|
|
||||||
let _ = write!(
|
|
||||||
stream,
|
|
||||||
"#tab-{count}:checked ~ #content-{count} {{ display: block; }}"
|
|
||||||
);
|
|
||||||
|
|
||||||
let _ = write!(stream, "</style>");
|
|
||||||
|
|
||||||
let _ = write!(stream, r#"<div class="tab-system">"#);
|
let _ = write!(stream, r#"<div class="tab-system">"#);
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user