[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-7791":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":16,"stars7d":16,"stars30d":17,"stars90d":16,"forks30d":16,"starsTrendScore":16,"compositeScore":18,"rankGlobal":10,"rankLanguage":10,"license":19,"archived":20,"fork":20,"defaultBranch":21,"hasWiki":20,"hasPages":22,"topics":23,"createdAt":10,"pushedAt":10,"updatedAt":24,"readmeContent":25,"aiSummary":26,"trendingCount":16,"starSnapshotCount":16,"syncStatus":27,"lastSyncTime":28,"discoverSource":29},7791,"kss","kneath\u002Fkss","kneath","A methodology for documenting CSS and generating styleguides.","warpspire.com\u002Fkss",null,"Ruby",4022,266,93,29,0,1,59.38,"MIT License",false,"master",true,[],"2026-06-12 04:00:35","# Knyle Style Sheets\n\nInspired by [TomDoc](http:\u002F\u002Ftomdoc.org), KSS attempts to provide a methodology for writing maintainable, documented CSS within a team. Specifically, KSS is a documentation specification and styleguide format. It is **not** a preprocessor, CSS framework, naming convention, or specificity guideline.\n\n* **[The Spec (What KSS is)](https:\u002F\u002Fgithub.com\u002Fkneath\u002Fkss\u002Fblob\u002Fmaster\u002FSPEC.md)**\n* **[Example living styleguide](https:\u002F\u002Fgithub.com\u002Fkneath\u002Fkss\u002Ftree\u002Fmaster\u002Fexample)**\n\n## KSS in a nutshell\n\nThe methodology and ideas behind Knyle Style Sheets are contained in [SPEC.md](https:\u002F\u002Fgithub.com\u002Fkneath\u002Fkss\u002Fblob\u002Fmaster\u002FSPEC.md). At its core, KSS is a documenting syntax for CSS.\n\n```css\n\u002F*\nA button suitable for giving stars to someone.\n\n:hover             - Subtle hover highlight.\n.stars-given       - A highlight indicating you've already given a star.\n.stars-given:hover - Subtle hover highlight on top of stars-given styling.\n.disabled          - Dims the button to indicate it cannot be used.\n\nStyleguide 2.1.3.\n*\u002F\na.button.star{\n  ...\n}\na.button.star.stars-given{\n  ...\n}\na.button.star.disabled{\n  ...\n}\n```\n\nKSS can also support words as Styleguide section names\n```scss\n\u002F\u002F Styleguide Forms.Checkboxes.\n\u002F\u002F - or -\n\u002F\u002F Styleguide Forms - Special Checkboxes.\n```\n\n## Ruby Library [![Build Status](https:\u002F\u002Ftravis-ci.org\u002Fkneath\u002Fkss.png)](https:\u002F\u002Ftravis-ci.org\u002Fkneath\u002Fkss) [![Code Climate](https:\u002F\u002Fcodeclimate.com\u002Fgithub\u002Fkneath\u002Fkss.png)](https:\u002F\u002Fcodeclimate.com\u002Fgithub\u002Fkneath\u002Fkss)\n\nThis repository includes a ruby library suitable for parsing SASS, SCSS, and CSS documented with KSS guidelines. To use the library, include it in your project as a gem from \u003Chttps:\u002F\u002Frubygems.org\u002Fgems\u002Fkss>. Then, create a parser and explore your KSS.\n\n```ruby\nstyleguide = Kss::Parser.new(\"#{RACK_ROOT}public\u002Fstylesheets\")\n\nstyleguide.section('2.1.1')\n# => \u003CKss::Section>\n\nstyleguide.section('2.1.1').description\n# => \"A button suitable for giving stars to someone.\"\n\nstyleguide.section('2.1.1').modifiers.first\n# => \u003CKss::Modifier>\n\nstyleguide.section('2.1.1').modifiers.first.name\n# => ':hover'\n\nstyleguide.section('2.1.1').modifiers.first.class_name\n# => 'pseudo-class-hover'\n\nstyleguide.section('2.1.1').modifiers.first.description\n# => 'Subtle hover highlight'\n```\n\nYou can also initialize the `Kss::Parser` with a string CSS by using `Kss::Parser.new(string)`\n\n```ruby\nbuttons =\u003C\u003C-'EOS'\n  \u002F*\n  Your standard form button.\n\n  :hover    - Highlights when hovering.\n  :disabled - Dims the button when disabled.\n\n  Styleguide 1.1\n  *\u002F\n  button {\n    padding: 5px 15px;\n    line-height: normal;\n    \u002F* ... *\u002F\n  }\n  button:disabled {\n    opacity: 0.5;\n  }\nEOS\nstyleguide = Kss::Parser.new(buttons)\n\nstyleguide.section('1.1')\n# => \u003CKss::Section>\n\nstyleguide.section('1.1').description\n# => \"Your standard form button.\"\n\n# ...\n```\n\nThe library is also fully TomDoc'd, completing the circle of life.\n\n## Generating styleguides\n\nThe documenting syntax and ruby library are intended to generate styleguides automatically. To do this, you'll need to leverage a small javascript library that generates class styles for pseudo-class styles (`:hover`, `:disabled`, etc).\n\n* [kss.coffee](https:\u002F\u002Fgithub.com\u002Fkneath\u002Fkss\u002Fblob\u002Fmaster\u002Flib\u002Fkss.coffee)\n* [kss.js](https:\u002F\u002Fgithub.com\u002Fkneath\u002Fkss\u002Fblob\u002Fmaster\u002Fexample\u002Fpublic\u002Fjavascripts\u002Fkss.js) (compiled js)\n\nFor an example of how to generate a styleguide, check out the [`example`](https:\u002F\u002Fgithub.com\u002Fkneath\u002Fkss\u002Ftree\u002Fmaster\u002Fexample) sinatra application.\n\n## Development\n\nTo hack on KSS, you'll need to install dependencies with `bundle install`. Run tests with `rake`.\n\nTo make your life easier, I suggest `bundle install --binstubs` and adding `bin\u002F` to your `$PATH`. If you don't understand this, just blindly add `bundle exec` in front of everything you'd normally do, like `bundle exec rake`.\n\nI apologize on behalf of the Ruby community for this, it's embarrassing and disappointing that dependency management is still so clumsy.\n\n## Implementations\n\nThe KSS specification has also been implemented in [Python](https:\u002F\u002Fgithub.com\u002Fseanbrant\u002Fpykss), [Node.js](https:\u002F\u002Fgithub.com\u002Fkss-node\u002Fkss-node), [PHP](https:\u002F\u002Fgithub.com\u002Fkss-php\u002Fkss-php) and [Java] (https:\u002F\u002Fgithub.com\u002Frevbingo\u002Fkss-java)\n\n","KSS（Knyle Style Sheets）是一种用于编写可维护且有文档记录的CSS的方法论，并能生成样式指南。其核心功能是提供一种CSS文档化语法，允许开发者在注释中描述样式细节、变体和使用场景，从而提高团队协作效率。技术特点包括支持SASS、SCSS及普通CSS文件解析，通过Ruby库实现对KSS规范下的文档自动化处理。适用于需要保持前端代码整洁有序、便于理解和长期维护的企业级Web项目或大型网站开发过程中，尤其适合那些重视设计一致性与组件复用性的团队。",2,"2026-06-11 03:14:25","top_language"]