Update style
This commit is contained in:
parent
131d3b30ee
commit
12e15321a4
2 changed files with 67 additions and 21 deletions
|
@ -76,6 +76,32 @@ mod default_layouts {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#[derive(Debug)]
|
||||||
|
pub struct Split;
|
||||||
|
|
||||||
|
impl LayoutType for Split {
|
||||||
|
fn name(&self) -> &'static str { "Split" }
|
||||||
|
|
||||||
|
fn expects(&self) -> Range<usize> { 2..usize::MAX }
|
||||||
|
|
||||||
|
fn compile(
|
||||||
|
&self,
|
||||||
|
token: LayoutToken,
|
||||||
|
_id: usize,
|
||||||
|
compiler: &Compiler,
|
||||||
|
_document: &dyn Document,
|
||||||
|
) -> Result<String, String> {
|
||||||
|
match compiler.target() {
|
||||||
|
Target::HTML => match token {
|
||||||
|
LayoutToken::BEGIN => Ok(r#"<div class="split-container"><div class="split">"#.to_string()),
|
||||||
|
LayoutToken::NEXT => Ok(r#"</div><div class="split">"#.to_string()),
|
||||||
|
LayoutToken::END => Ok(r#"</div></div>"#.to_string()),
|
||||||
|
},
|
||||||
|
_ => todo!(""),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#[derive(Debug)]
|
#[derive(Debug)]
|
||||||
|
@ -158,6 +184,8 @@ impl LayoutRule {
|
||||||
let mut layouts: HashMap<String, Rc<dyn LayoutType>> = HashMap::new();
|
let mut layouts: HashMap<String, Rc<dyn LayoutType>> = HashMap::new();
|
||||||
let layout_centered = default_layouts::Centered {};
|
let layout_centered = default_layouts::Centered {};
|
||||||
layouts.insert(layout_centered.name().to_string(), Rc::new(layout_centered));
|
layouts.insert(layout_centered.name().to_string(), Rc::new(layout_centered));
|
||||||
|
let layout_split = default_layouts::Split {};
|
||||||
|
layouts.insert(layout_split.name().to_string(), Rc::new(layout_split));
|
||||||
|
|
||||||
Self {
|
Self {
|
||||||
re: [
|
re: [
|
||||||
|
@ -328,7 +356,7 @@ impl RegexRule for LayoutRule {
|
||||||
Some(last) => last,
|
Some(last) => last,
|
||||||
};
|
};
|
||||||
|
|
||||||
if layout_type.expects().end >= tokens.len()
|
if layout_type.expects().end < tokens.len()
|
||||||
// Too many blocks
|
// Too many blocks
|
||||||
{
|
{
|
||||||
reports.push(
|
reports.push(
|
||||||
|
@ -372,7 +400,7 @@ impl RegexRule for LayoutRule {
|
||||||
Some(last) => last,
|
Some(last) => last,
|
||||||
};
|
};
|
||||||
|
|
||||||
if layout_type.expects().start < tokens.len()
|
if layout_type.expects().start > tokens.len()
|
||||||
// Not enough blocks
|
// Not enough blocks
|
||||||
{
|
{
|
||||||
reports.push(
|
reports.push(
|
||||||
|
|
56
style.css
56
style.css
|
@ -17,6 +17,24 @@ body {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Layouts */
|
||||||
|
div.centered {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.split-container {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.split-container > div.split {
|
||||||
|
flex: 1;
|
||||||
|
flex-shrink: 0;
|
||||||
|
overflow-x: auto;
|
||||||
|
|
||||||
|
margin: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
/* Styles */
|
/* Styles */
|
||||||
em {
|
em {
|
||||||
padding-left: .1em;
|
padding-left: .1em;
|
||||||
|
@ -42,22 +60,22 @@ a.inline-code {
|
||||||
.navbar {
|
.navbar {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
width: max(calc((100vw - 99ch) / 2 - 15vw), 24ch);
|
width: max(calc((100vw - 99ch) / 2 - 15vw), 24ch);
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
margin-right: 1em;
|
margin-right: 1em;
|
||||||
|
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
overscroll-behavior-y: contain;
|
overscroll-behavior-y: contain;
|
||||||
|
|
||||||
background-color: #161a26;
|
background-color: #161a26;
|
||||||
color: #aaa;
|
color: #aaa;
|
||||||
|
|
||||||
font-size: 0.9em;
|
font-size: 0.9em;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -108,15 +126,15 @@ a.inline-code {
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar summary:before {
|
.navbar summary:before {
|
||||||
content: "+";
|
content: "+";
|
||||||
color: #ffb454;
|
color: #ffb454;
|
||||||
float: left;
|
float: left;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
width: 1em;
|
width: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar details[open] > summary:before {
|
.navbar details[open] > summary:before {
|
||||||
content: "–";
|
content: "–";
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Code blocks */
|
/* Code blocks */
|
||||||
|
@ -126,11 +144,10 @@ div.code-block-title {
|
||||||
}
|
}
|
||||||
|
|
||||||
div.code-block-content {
|
div.code-block-content {
|
||||||
max-height: 20em;
|
max-height: 38em;
|
||||||
margin-bottom: 0.2em;
|
margin-bottom: 0.2em;
|
||||||
width: auto;
|
|
||||||
|
|
||||||
overflow: auto;
|
overflow: scroll;
|
||||||
|
|
||||||
background-color: #0f141a;
|
background-color: #0f141a;
|
||||||
}
|
}
|
||||||
|
@ -143,6 +160,7 @@ div.code-block-content td {
|
||||||
div.code-block-content pre {
|
div.code-block-content pre {
|
||||||
border: 0;
|
border: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
tab-size: 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.code-block-content .code-block-gutter {
|
div.code-block-content .code-block-gutter {
|
||||||
|
@ -220,6 +238,6 @@ a:hover.medium-ref img {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
||||||
box-shadow: 0px 0px 6px 2px rgba(0,0,0,0.75);
|
box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.75);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue