{"id":16747490,"url":"https://github.com/deoostfrees/ratata","last_synced_at":"2025-10-03T17:07:09.571Z","repository":{"id":207645754,"uuid":"719721149","full_name":"deoostfrees/Ratata","owner":"deoostfrees","description":"HTML, CSS and JavaScript boilerplate using just HTML, CSS and JavaScript.","archived":false,"fork":false,"pushed_at":"2024-10-21T12:57:56.000Z","size":664,"stargazers_count":19,"open_issues_count":2,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-10-22T20:31:03.191Z","etag":null,"topics":["boilerplate","css","dependency-free","html","javascript","vanilla"],"latest_commit_sha":null,"homepage":"https://codepen.io/deoostfrees/pen/XWGWbEy","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/deoostfrees.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["deoostfrees"],"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2023-11-16T19:01:59.000Z","updated_at":"2024-08-03T14:33:47.000Z","dependencies_parsed_at":"2023-11-26T22:24:35.593Z","dependency_job_id":"ffb753f9-92be-4344-8df3-57d7cee0acd6","html_url":"https://github.com/deoostfrees/Ratata","commit_stats":{"total_commits":191,"total_committers":1,"mean_commits":191.0,"dds":0.0,"last_synced_commit":"519ab804de1333dd283c86190d40feeb1a2ace24"},"previous_names":["deoostfrees/ratata"],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deoostfrees%2FRatata","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deoostfrees%2FRatata/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deoostfrees%2FRatata/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/deoostfrees%2FRatata/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/deoostfrees","download_url":"https://codeload.github.com/deoostfrees/Ratata/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221670408,"owners_count":16861062,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["boilerplate","css","dependency-free","html","javascript","vanilla"],"created_at":"2024-10-13T02:10:10.530Z","updated_at":"2025-10-03T17:07:04.547Z","avatar_url":"https://github.com/deoostfrees.png","language":"CSS","funding_links":["https://github.com/sponsors/deoostfrees"],"categories":[],"sub_categories":[],"readme":"# Ratata\n\nMore web standards, less bullshit.\n\nRatata is a HTML, CSS and JavaScript boilerplate using just HTML, CSS and JavaScript. It's main focus is on web standards, accessibility and performance. [Check it out on CodePen](https://codepen.io/deoostfrees/pen/XWGWbEy).\n\n## Table of contents\n\n- [Getting Started](#getting-started)\n- [Credits, Attribution and Inspiration](#credits-attribution-and-inspiration)\n- [Browser Support](#browser-support)\n\n## Getting Started\n\n- [Download the latest release](https://github.com/deoostfrees/Ratata/releases). You may need to copy and paste the contents of the unzipped `Ratata-0.x.x/src` folder into your project directory.\n- Install Ratata from GitHub using [npm](https://www.npmjs.com): `npm install ratata`. You may need to copy and paste the contents of the `node_modules/ratata/src` folder into your project directory.\n\n### Variables\n\nThe file `_variables.css` in the `src` folder contains variables for all layout, spacing and typography used in Ratata.\n\n```css\n:root {\n  /**\n   * Spacing\n   *\n   */\n  --scroll-padding-top: calc((100 / 18) * 1rem);\n  --scroll-padding-bottom: 0;\n\n  /**\n   * Layout\n   *\n   */\n  --container-max-width: calc((1848 / 18) * 1rem);\n  --container-small-max-width: calc((660 / 18) * 1rem);\n  --container-padding-inline: calc((24 / 18) * 1rem);\n\n  /**\n   * Typography\n   *\n   */\n  --base-font-family: -apple-system, blinkmacsystemfont, 'Segoe UI', helvetica, arial, sans-serif;\n  --base-font-size: calc((18 / 16) * 1rem);\n  --base-font-weight: 400;\n  --base-line-height: calc((31 / 18));\n\n  /* b, strong */\n  --bold-font-weight: 700;\n\n  /* small */\n  --small-font-size: calc((16 / 18) * 1rem);\n  --small-line-height: calc((27 / 16));\n\n  /* Blockquote */\n  --blockquote-font-size: calc((23 / 18) * 1rem);\n  --blockquote-line-height: calc((38 / 23));\n\n  /* Headings */\n  --headings-font-family: var(--base-font-family);\n  --headings-font-weight: 700;\n\n  /* h1 */\n  --h1-font-size: calc((47 / 18) * 1rem);\n  --h1-line-height: calc((73 / 47));\n\n  /* h2 */\n  --h2-font-size: calc((37 / 18) * 1rem);\n  --h2-line-height: calc((58 / 37));\n\n  /* h3 */\n  --h3-font-size: calc((29 / 18) * 1rem);\n  --h3-line-height: calc((47 / 29));\n\n  /* h4 */\n  --h4-font-size: calc((23 / 18) * 1rem);\n  --h4-line-height: calc((38 / 23));\n}\n```\n\nA default color scheme for light and dark mode can be found in `src/themes/`.\n\n## Credits, Attribution and Inspiration\n\n- [Stephanie Eckles](https://thinkdobecreate.com)' [Pure CSS Custom Checkbox Style](https://moderncss.dev/pure-css-custom-checkbox-style/)\n- [Stephanie Eckles](https://thinkdobecreate.com)' [Pure CSS Custom Styled Radio Buttons](https://moderncss.dev/pure-css-custom-styled-radio-buttons/)\n- [Manuel Matuzović](https://matuzo.at)'s [Removing list styles without affecting semantics](https://matuzo.at/blog/2023/removing-list-styles-without-affecting-semantics)\n- [David Bushell](https://dbushell.com)'s [CSS Button Styles You Might Not Know](https://dbushell.com/2024/03/10/css-button-styles-you-might-not-know/)\n- [Adrian Roselli](https://adrianroselli.com)'s [Progressively Enhanced HTML Accordion](https://adrianroselli.com/2023/08/progressively-enhanced-html-accordion.html)\n\n## Browser Support\n\nRatata supports the latest, stable releases of all major browsers.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdeoostfrees%2Fratata","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdeoostfrees%2Fratata","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdeoostfrees%2Fratata/lists"}