Commit d1e1c9c6 authored by Fred Chasen's avatar Fred Chasen

Add data-split-from and data-id to pages

parent 591931b1
......@@ -50,7 +50,7 @@ $ npm install
```
## Development
Run the local dev-server with livereload and autocompile on [http://localhost:8080/](http://localhost:8080/)
Run the local dev-server with livereload and autocompile on [http://localhost:9090/](http://localhost:9090/)
```sh
$ npm start
```
......
......@@ -28,7 +28,7 @@
font-size: 0.9em;
}
@bottom-left-corner {
@bottom-left {
content: counter(page);
}
}
......@@ -45,8 +45,10 @@
font-size: 0.9em;
}
@bottom-right-corner {
@bottom-right {
content: counter(page);
text-align: right;
width: 100%;
}
@top-center{
......
[data-id="fred"] {
margin: 0;
}
html{
--serif: 'spectral', serif;
--sans-serif: 'hk-grotesk', sans-serif;
......@@ -10,7 +14,7 @@ html{
}
@page {
size: 148mm 210mm portait;
size: 148mm 210mm portaitr
}
@media screen {
......
......@@ -183,6 +183,15 @@ class Layout {
for (var i = 0; i < ancestors.length; i++) {
// parent = this.createDOMNode(ancestors[i]);
parent = ancestors[i].cloneNode(false);
parent.setAttribute("data-split-from", parent.getAttribute("ref"));
if (parent.hasAttribute("id")) {
let dataID = parent.getAttribute("id");
parent.setAttribute("data-id", dataID);
parent.removeAttribute("id");
}
if (added.length) {
// let container = this.wrapper.querySelector("[ref='" + ancestors[i].parent.attribs.ref + "']");
let container = added[added.length-1];
......
......@@ -55,6 +55,9 @@ class ContentParser {
let uuid = UUID();
node.setAttribute("ref", uuid);
if (node.id) {
node.setAttribute("data-id", node.id);
}
node.setAttribute("data-children", node.childNodes.length);
node.setAttribute("data-text", node.textContent.trim().length);
......
......@@ -135,6 +135,26 @@ export default `
display: block;
}
.pages > .page > .area > div [data-split-from] {
text-indent: unset;
margin-top: unset;
padding-top: unset;
initial-letter: unset;
}
.pages > .page > .area > div [data-split-from] > *::first-letter,
.pages > .page > .area > div [data-split-from]::first-letter {
color: unset;
font-size: unset;
font-wieght: unset;
font-family: unset;
color: unset;
line-height: unset;
float: unset;
padding: unset;
margin: unset;
}
@media print {
body {
width: var(--width);
......
......@@ -19,6 +19,9 @@ class Sheet {
this.id = UUID();
// this.addScope(this.ast, this.uuid);
// Add date-id
this.replaceIds(this.ast);
// Get page selectors
// this.namedPageSelectors = this.getNamedPageSelectors(this.ast);
......@@ -1268,6 +1271,27 @@ class Sheet {
return breaks;
}
replaceIds(ast) {
csstree.walk(ast, {
visit: 'Rule',
enter: (node, item, list) => {
csstree.walk(node, {
visit: 'IdSelector',
enter: (idNode, idItem, idList) => {
console.log(idNode.name);
let name = idNode.name;
idNode.flags = null;
idNode.matcher = "=";
idNode.name = {type: "Identifier", loc: null, name: "data-id"};
idNode.type = "AttributeSelector";
idNode.value = {type: "String", loc: null, value: `"${name}"`};
}
});
}
});
}
// generate string
toString(ast) {
return csstree.generate(ast || this.ast);
......
......@@ -108,10 +108,17 @@ export function rebuildAncestors(node) {
}
for (var i = 0; i < ancestors.length; i++) {
// parent = this.createDOMNode(ancestors[i]);
parent = ancestors[i].cloneNode(false);
parent.setAttribute("data-split-from", parent.getAttribute("ref"));
if (parent.hasAttribute("id")) {
let dataID = parent.getAttribute("id");
parent.setAttribute("data-id", dataID);
parent.removeAttribute("id");
}
if (added.length) {
// let container = this.wrapper.querySelector("[ref='" + ancestors[i].parent.attribs.ref + "']");
let container = added[added.length-1];
container.appendChild(parent);
} else {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment