{% import 'app/_inc/macros.html.twig' as m %}
<div class="comparator-table" data-a-up>
<div class="comparator-header">
{{ m.productComparator(lore, tome, pack) }}
</div>
<div class="comparator-body">
<div class="comparator-tabs">
{{ m.tabTitleComparator("Creation and structuring", {class:"is-open"}) }}
<div class="tab-content">
{{ m.tabContentComparator(
"Customizable Templates",
"yes",
"no",
"yes",
{contentModal:"Create tailor-made page templates to structure your encyclopedia."}
) }}
{{ m.tabContentComparator(
"Form-style modules (a.k.a. Runes)",
"yes",
"no",
"yes",
{contentModal:"Add dynamic fields to your templates—editable and reusable anywhere."}
) }}
{{ m.tabContentComparator(
"Directory Sheets (locations, items, characters, etc.)",
"no",
"yes",
"yes",
{contentModal:"Record key session-relevant information for each narrative element. <a href='%link1%' title='Learn more'>Learn more</a>"|trans({
'%link1%': path('article_show', {id:30, slug:'tome-memos-vs-lore-character-pages-what-are-the-differences'})
}),}
) }}
{{ m.tabContentComparator(
"World–story connection",
"no",
"no",
"yes",
{contentModal:"Link your world to your storyline and tag its elements within your narrative. <a href='%link2%' title='Learn more'>Learn more</a>"|trans({
'%link2%': path('article_show', {id:36, slug:'how-to-link-tome-and-lore'})
})}
) }}
{{ m.tabContentComparator(
"Diagrams (Tree view or digital Whiteboard)",
"yes",
"no",
"yes",
{contentModal:"Build visual diagrams to organize ideas, relationships, or hierarchies."}
) }}
<div class="tab-row no-icon">
<div class="tab-info">
{{ "Interactive Maps"|trans|raw }}
<div class="tab-hover-modal">
{{ m.icon('circle-question-solid', '') }}
<div class="tab-modal">
{{ "Import your map and explore it interactively :"|trans|raw }}
<br><br>
{{ "• Page pins: Place pins, link them to a page, and access them in one click."|trans|raw }}
<a href="{{ path('article_show', {id:28, slug:'how-to-use-maps-and-pins-in-lore'}) }}" title='Learn more'>{{ "Learn more"|trans|raw }}</a>
<br><br>
{{ "• Interaction & Direction Pins: Add pins with icons to guide order and interactions."|trans|raw }}
</div>
</div>
</div>
</div>
<div class="tab-row">
<div class="tab-info">
{{ "• Page Pins"|trans|raw }}
</div>
<div class="yes">
{{ m.icon('icons-ollam/check', '') }}
{{ m.icon('icons-ollam/x', '') }}
</div>
<div class="yes">
{{ m.icon('icons-ollam/check', '') }}
{{ m.icon('icons-ollam/x', '') }}
</div>
<div class="yes">
{{ m.icon('icons-ollam/check', '') }}
{{ m.icon('icons-ollam/x', '') }}
</div>
</div>
<div class="tab-row">
<div class="tab-info">
{{ "• Interaction & Direction Pins"|trans|raw }}
</div>
<div class="no">
{{ m.icon('icons-ollam/check', '') }}
{{ m.icon('icons-ollam/x', '') }}
</div>
<div class="yes">
{{ m.icon('icons-ollam/check', '') }}
{{ m.icon('icons-ollam/x', '') }}
</div>
<div class="yes">
{{ m.icon('icons-ollam/check', '') }}
{{ m.icon('icons-ollam/x', '') }}
</div>
</div>
</div>
</div>
<div class="comparator-tabs">
{{ m.tabTitleComparator("Narration and Story-Tracking") }}
<div class="tab-content">
{{ m.tabContentComparator(
"Non-linear narrative Tree",
"no",
"yes",
"yes",
{contentModal:"Design open-ended story arcs that can be played in any order you envision."}
) }}
{{ m.tabContentComparator(
"Tracking player choices",
"no",
"yes",
"yes",
{contentModal:"Mark whether a scene has been played, skipped, or is yet to be played."}
) }}
{{ m.tabContentComparator(
"Tracking player roles",
"no",
"yes",
"yes",
{contentModal:"Log player actions and revisit them later in the story. <a href='%link4%' title='Learn more'>Learn more</a>"|trans({
'%link4%': path('article_show', {id:34, slug:'how-to-use-plots-and-roles-in-tome'})
})}
) }}
{{ m.tabContentComparator(
"Customized Visual Framing",
"no",
"yes",
"yes",
{contentModal:"Highlight key elements to guide your storytelling. <a href='%link5%' title='Learn more'>Learn more</a>"|trans({
'%link5%': path('article_show', {id:24, slug:'how-to-use-frames-in-tome'})
})}
) }}
</div>
</div>
<div class="comparator-tabs">
{{ m.tabTitleComparator("Organization and Sharing") }}
<div class="tab-content">
{{ m.tabContentComparator(
"Tags",
"yes",
"yes",
"yes",
{contentModal:"Add tags to link your pages and navigate easily."}
) }}
{{ m.tabContentComparator(
"Mirror Linking (tag synchronization between pages)",
"yes",
"no",
"yes",
{contentModal:"Dynamically connect two types of pages to display their relationships."}
) }}
{{ m.tabContentComparator(
"Unified and Intuitive search",
"yes",
"yes",
"yes"
) }}
{{ m.tabContentComparator(
"Centralize your content and maintain overall consistency",
"yes",
"no",
"yes"
) }}
</div>
</div>
<div class="comparator-tabs">
{{ m.tabTitleComparator("Accessibility and Support") }}
<div class="tab-content">
<div class="tab-row">
<div class="tab-info">
{{ "PDF Exports"|trans|raw }}
</div>
<div>
{{ "Coming soon"|trans|raw }}
</div>
<div>
{{ "Coming soon"|trans|raw }}
</div>
<div>
{{ "Coming soon"|trans|raw }}
</div>
</div>
{{ m.tabContentComparator(
"Works Offline",
"yes",
"yes",
"yes"
) }}
{{ m.tabContentComparator(
"Image management",
"yes",
"yes",
"yes",
{contentModal:"Upload your images, store them in the inventory, and use them easily."}
) }}
{{ m.tabContentComparator(
"Light and Dark modes",
"yes",
"yes",
"yes"
) }}
{{ m.tabContentComparator(
"Available languages",
"yes",
"yes",
"yes",
{contentModal:"French / English"}
) }}
{{ m.tabContentComparator(
"Access to our Community",
"yes",
"yes",
"yes",
{contentModal:"Discord, Reddit, Instagram"}
) }}
{{ m.tabContentComparator(
"Customer Support",
"yes",
"yes",
"yes"
) }}
{{ m.tabContentComparator(
"All future updates included",
"yes",
"yes",
"yes"
) }}
<div class="tab-row">
<div class="tab-info">
{{ "Sample files"|trans|raw }}
</div>
<div>
{{ "Coming soon"|trans|raw }}
</div>
<div>
{{ "Coming soon"|trans|raw }}
</div>
<div>
{{ "Coming soon"|trans|raw }}
</div>
</div>
{{ m.tabContentComparator(
"Compatible with Linux, Mac, and Windows",
"yes",
"yes",
"yes"
) }}
{{ m.tabContentComparator(
"Tutorials",
"yes",
"yes",
"yes"
) }}
</div>
</div>
</div>
</div>