diff --git a/examples/official-site/sqlpage/migrations/01_documentation.sql b/examples/official-site/sqlpage/migrations/01_documentation.sql index 02dcc86f..838a0e22 100644 --- a/examples/official-site/sqlpage/migrations/01_documentation.sql +++ b/examples/official-site/sqlpage/migrations/01_documentation.sql @@ -1143,4 +1143,4 @@ INSERT INTO parameter(component, name, description, type, top_level, optional) S ('contents_md', 'A description of the list item, displayed as greyed-out text.', 'TEXT', FALSE, FALSE), ) x; INSERT INTO example(component, description, properties) VALUES - ('accordion', 'A basic accordion with Markdown', json('[{"component":"accordion"},{"title":"Beautiful","contents_md": "Lorem *ipsum* dolor sit amet, **consectetur** adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam."},{"title":"Useful","contents_md": "Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis *ipsum*. Praesent **mauris**. Fusce nec tellus sed augue semper porta."},{"title":"Compact","contents_md": "Mauris **ipsum**. Nulla metus metus, ullamcorper vel, tincidunt sed, euismod in, *nibh*. Quisque volutpat condimentum velit."}]'); \ No newline at end of file + ('accordion', 'A basic accordion with Markdown', json('[{"component":"accordion"},{"title":"Beautiful","contents_md": "Lorem *ipsum* dolor sit amet, **consectetur** adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam."},{"title":"Useful","contents_md": "Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis *ipsum*. Praesent **mauris**. Fusce nec tellus sed augue semper porta."},{"title":"Compact","contents_md": "Mauris **ipsum**. Nulla metus metus, ullamcorper vel, tincidunt sed, euismod in, *nibh*. Quisque volutpat condimentum velit."}]')); \ No newline at end of file diff --git a/examples/todo application/accordion.sql b/examples/todo application/accordion.sql new file mode 100644 index 00000000..786b58e6 --- /dev/null +++ b/examples/todo application/accordion.sql @@ -0,0 +1,42 @@ + + +select + 'accordion' as component; + +select + 'My Title' as title, + 'This is the accordion content' as contents_md; + +SELECT + 'Another title' as title, + 'Hi! I''m your first Markdown file in **StackEdit**. If you want to learn about StackEdit, you can read me. If you want to play with Markdown, you can edit me. Once you have finished with me, you can create new files by opening the **file explorer** on the left corner of the navigation bar. + + +# Files + +StackEdit stores your files in your browser, which means all your files are automatically saved locally and are accessible **offline!** + +## Create files and folders + +The file explorer is accessible using the button in left corner of the navigation bar. You can create a new file by clicking the **New file** button in the file explorer. You can also create folders by clicking the **New folder** button. + +## Switch to another file + +All your files and folders are presented as a tree in the file explorer. You can switch from one to another by clicking a file in the tree. + +## Rename a file + +You can rename the current file by clicking the file name in the navigation bar or by clicking the **Rename** button in the file explorer. + +## Delete a file + +You can delete the current file by clicking the **Remove** button in the file explorer. The file will be moved into the **Trash** folder and automatically deleted after 7 days of inactivity. + +## Export a file + +You can export the current file by clicking **Export to disk** in the menu. You can choose to export the file as plain Markdown, as HTML using a Handlebars template or as a PDF. + + +# Synchronization + +Synchronization is one of the biggest features of StackEdit. It enables you to synchronize any file in your workspace with other files stored in your **Google Drive**, your **Dropbox** and your **GitHub** accounts. This allows you to keep writing on other devices, collaborate with people you share the file with, integrate easily into your workflow... The synchronization mechanism takes place every minute in the background, downloading, merging, and uploading file modifications.' as contents_md; \ No newline at end of file diff --git a/examples/todo application/index.sql b/examples/todo application/index.sql index 699d08db..e2af97e6 100644 --- a/examples/todo application/index.sql +++ b/examples/todo application/index.sql @@ -17,4 +17,11 @@ select 'todo_form.sql' as link, 'green' as color, 'Add new todo' as title, - 'circle-plus' as icon; \ No newline at end of file + 'circle-plus' as icon; +select + 'card' as component, + 'Accordion component showcase' as title; + +select + '/accordion.sql?_sqlpage_embed' as embed, + 12 as width; \ No newline at end of file diff --git a/examples/todo application/shell.sql b/examples/todo application/shell.sql index 9539c1bf..52cab47c 100644 --- a/examples/todo application/shell.sql +++ b/examples/todo application/shell.sql @@ -1,4 +1,7 @@ select 'shell' as component, printf('Todo list (%d)', count(*)) as title, - 'timeline' as menu_item + 'timeline' as menu_item, + TRUE as sidebar, + 'dark' as theme, + './sqlpage.css' as css from todos; \ No newline at end of file diff --git a/examples/todo application/sqlpage.css b/examples/todo application/sqlpage.css new file mode 100644 index 00000000..1c43d26b --- /dev/null +++ b/examples/todo application/sqlpage.css @@ -0,0 +1,66 @@ +[data-bs-theme="blue"] { + --tblr-primary: #eb4242; /* Índigo como color primario */ + --tblr-secondary: #6c7a91; + --tblr-success: #2fb344; + --tblr-info: #4299e1; + --tblr-warning: #f76707; + --tblr-danger: #d63939; + --tblr-light: #f6f8fb; + --tblr-dark: #182433; + --tblr-muted: #6c7a91; + + --tblr-body-color: #9CAFB7; /* texto */ + --tblr-body-bg: #D0D38F; /* fondo */ + --tblr-emphasis-color: #ADB993; /* hover */ + --tblr-bg-surface: #F6CA83 ; /* fondo 2 */ + --tblr-bg-surface-dark:#949D6A; /* Scroll bar bg*/ + --tblr-secondary-color: rgba(24, 36, 51, 0.75); + --tblr-secondary-bg: #3949ab; /* Fondo secundario más claro que el primario */ + --tblr-tertiary-color: rgba(255, 255, 255, 0.5); + --tblr-tertiary-bg: #5c6bc0; + + --tblr-primary-text-emphasis: #1a237e; + --tblr-secondary-text-emphasis: #2b313a; + --tblr-success-text-emphasis: #13481b; + --tblr-info-text-emphasis: #1a3d5a; + --tblr-warning-text-emphasis: #632903; + --tblr-danger-text-emphasis: #561717; + --tblr-light-text-emphasis: #3a4859; + --tblr-dark-text-emphasis: #3a4859; + + --tblr-primary-bg-subtle: #e8eaf6; /* Fondo sutil con tonalidad índigo claro */ + --tblr-secondary-bg-subtle: #e2e4e9; + --tblr-success-bg-subtle: #d5f0da; + --tblr-info-bg-subtle: #d9ebf9; + --tblr-warning-bg-subtle: #fde1cd; + --tblr-danger-bg-subtle: #f7d7d7; + --tblr-light-bg-subtle: #f7f9fb; + --tblr-dark-bg-subtle: #8a97ab; + + --tblr-primary-border-subtle: #c5cae9; /* Borde sutil con tonalidad índigo claro */ + --tblr-secondary-border-subtle: #c4cad3; + --tblr-success-border-subtle: #ace1b4; + --tblr-info-border-subtle: #b3d6f3; + --tblr-warning-border-subtle: #fcc29c; + --tblr-danger-border-subtle: #efb0b0; + --tblr-light-border-subtle: #dce1e7; + --tblr-dark-border-subtle: #6c7a91; + + --tblr-link-color: #3f51b5; /* Enlaces con un tono índigo */ + --tblr-link-hover-color: #303f9f; + --tblr-link-color-rgb: 63, 81, 181; + --tblr-link-hover-color-rgb: 48, 63, 159; + + --tblr-code-color: var(--tblr-gray-600); + --tblr-highlight-color: #e0e7ff; + --tblr-highlight-bg: #3949ab; + --tblr-border-color: #3949ab; + --tblr-border-color-translucent: rgba(63, 81, 181, 0.1); + --tblr-box-shadow: rgba(63, 81, 181, 0.15) 0 2px 4px 0; + + --tblr-bg-forms:#000000; + --tblr-form-valid-color: #2fb344; + --tblr-form-valid-border-color: #2fb344; + --tblr-form-invalid-color: #d63939; + --tblr-form-invalid-border-color: #d63939; +} diff --git a/examples/todo application/sqlpage.exe b/examples/todo application/sqlpage.exe new file mode 100644 index 00000000..90e1e0b7 Binary files /dev/null and b/examples/todo application/sqlpage.exe differ diff --git a/examples/todo application/sqlpage/templates/accordion.handlebars b/examples/todo application/sqlpage/templates/accordion.handlebars new file mode 100644 index 00000000..bda8b80f --- /dev/null +++ b/examples/todo application/sqlpage/templates/accordion.handlebars @@ -0,0 +1,18 @@ +
+ {{#each_row}} +
+

+ +

+
+
+ {{{markdown contents_md}}} +
+
+
+ {{/each_row}} +
\ No newline at end of file diff --git a/examples/todo application/sqlpage/templates/shell.handlebars b/examples/todo application/sqlpage/templates/shell.handlebars new file mode 100644 index 00000000..8c349852 --- /dev/null +++ b/examples/todo application/sqlpage/templates/shell.handlebars @@ -0,0 +1,218 @@ + + + + + {{default title "SQLPage"}} + + {{#if manifest}} + + {{/if}} + + + + {{#each (to_array css)}} + {{#if this}} + + {{/if}} + {{/each}} + + {{#if font}} + {{#if (starts_with font "/")}} + + {{else}} + + + + + {{/if}} + {{/if}} + + + {{#each (to_array javascript)}} + {{#if this}} + + {{/if}} + {{/each}} + {{#each (to_array javascript_module)}} + {{#if this}} + + {{/if}} + {{/each}} + + + {{#if norobot}} + + {{/if}} + + {{#if refresh}} + + {{/if}} + {{#if rss}} + + {{/if}} + + {{#if social_image}} + + {{/if}} + + +{{!-- Partial for menu_items to not duplicate logic --}} +{{#*inline "menu-items"}} + + {{#if search_target}} + + {{/if}} +{{/inline}} + + +
+ {{#if (or (or title (or icon image)) menu_item)}} +
+ {{#if sidebar}} + + {{else}} + +
+ {{/if}} +{{/if}} +
+
+ {{~#each_row~}}{{~/each_row~}} +
+
+ +
+ + \ No newline at end of file