cupboard 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (130) hide show
  1. checksums.yaml +7 -0
  2. data/.gitignore +10 -0
  3. data/.rspec +2 -0
  4. data/.ruby-version +1 -0
  5. data/.travis.yml +4 -0
  6. data/CODE_OF_CONDUCT.md +13 -0
  7. data/Dockerfile +19 -0
  8. data/Gemfile +6 -0
  9. data/LICENSE.txt +21 -0
  10. data/README.md +44 -0
  11. data/Rakefile +6 -0
  12. data/app/assets/images/category-cover.png +0 -0
  13. data/app/assets/images/category-default.jpg +0 -0
  14. data/app/assets/images/default-avatar.png +0 -0
  15. data/app/assets/images/favicon.ico +0 -0
  16. data/app/assets/images/icook-logo.png +0 -0
  17. data/app/assets/images/icook-logo.svg +26 -0
  18. data/app/assets/images/logo-2x.png +0 -0
  19. data/app/assets/images/no-result.png +0 -0
  20. data/app/assets/images/recipe-default.png +0 -0
  21. data/app/assets/images/section_bg.jpg +0 -0
  22. data/app/assets/images/setting-pr.jpg +0 -0
  23. data/app/assets/images/step-placeholder.jpg +0 -0
  24. data/app/assets/images/vip-icon.svg +1 -0
  25. data/app/assets/pages/atomic.md +56 -0
  26. data/app/assets/pages/index.md +101 -0
  27. data/app/assets/stylesheets/_base.scss +4 -0
  28. data/app/assets/stylesheets/_basic.scss +22 -0
  29. data/app/assets/stylesheets/_components.scss +95 -0
  30. data/app/assets/stylesheets/_forms.scss +159 -0
  31. data/app/assets/stylesheets/_global.scss +40 -0
  32. data/app/assets/stylesheets/_images.scss +125 -0
  33. data/app/assets/stylesheets/_layouts.scss +4 -0
  34. data/app/assets/stylesheets/_lists.scss +203 -0
  35. data/app/assets/stylesheets/_mixins.scss +6 -0
  36. data/app/assets/stylesheets/_tables.scss +244 -0
  37. data/app/assets/stylesheets/_typography.scss +292 -0
  38. data/app/assets/stylesheets/_variables.scss +1 -0
  39. data/app/assets/stylesheets/_widgets.scss +50 -0
  40. data/app/assets/stylesheets/base/_badge.scss +89 -0
  41. data/app/assets/stylesheets/base/_buttons.scss +217 -0
  42. data/app/assets/stylesheets/components/_accordion.scss +69 -0
  43. data/app/assets/stylesheets/components/_breadcrumbs.scss +46 -0
  44. data/app/assets/stylesheets/components/_cards.scss +12 -0
  45. data/app/assets/stylesheets/components/_grid.scss +45 -0
  46. data/app/assets/stylesheets/components/_navigations.scss +12 -0
  47. data/app/assets/stylesheets/components/_pagination.scss +166 -0
  48. data/app/assets/stylesheets/components/_search-form.scss +56 -0
  49. data/app/assets/stylesheets/components/_sorting-cards.scss +76 -0
  50. data/app/assets/stylesheets/components/_text.scss +166 -0
  51. data/app/assets/stylesheets/components/alerts/_alert-global.scss +137 -0
  52. data/app/assets/stylesheets/components/alerts/_alert-market.scss +129 -0
  53. data/app/assets/stylesheets/components/cards/_dish-card.scss +244 -0
  54. data/app/assets/stylesheets/components/cards/_list-card.scss +168 -0
  55. data/app/assets/stylesheets/components/cards/_photo-card.scss +244 -0
  56. data/app/assets/stylesheets/components/cards/_product-card.scss +104 -0
  57. data/app/assets/stylesheets/components/cards/_recipe-card.scss +96 -0
  58. data/app/assets/stylesheets/components/cards/_video-card.scss +206 -0
  59. data/app/assets/stylesheets/components/comments/_comment-form.scss +222 -0
  60. data/app/assets/stylesheets/components/medias/_blog-feeds.scss +28 -0
  61. data/app/assets/stylesheets/components/medias/_brand-cover.scss +127 -0
  62. data/app/assets/stylesheets/components/medias/_brand-product.scss +35 -0
  63. data/app/assets/stylesheets/components/medias/_business-kitchen.scss +66 -0
  64. data/app/assets/stylesheets/components/medias/_categories-cover.scss +79 -0
  65. data/app/assets/stylesheets/components/medias/_hot-categories.scss +36 -0
  66. data/app/assets/stylesheets/components/medias/_popular-categories.scss +89 -0
  67. data/app/assets/stylesheets/components/medias/_popular-recipes.scss +38 -0
  68. data/app/assets/stylesheets/components/medias/_pr-lists.scss +53 -0
  69. data/app/assets/stylesheets/components/medias/_recipe-reference.scss +45 -0
  70. data/app/assets/stylesheets/components/medias/_user-recipes.scss +46 -0
  71. data/app/assets/stylesheets/components/navigations/_blog-nav.scss +120 -0
  72. data/app/assets/stylesheets/components/navigations/_brand-tabs-nav.scss +187 -0
  73. data/app/assets/stylesheets/components/navigations/_categories-nav-responsive.scss +131 -0
  74. data/app/assets/stylesheets/components/navigations/_categories-nav.scss +307 -0
  75. data/app/assets/stylesheets/components/navigations/_recipe-nav.scss +112 -0
  76. data/app/assets/stylesheets/components/navigations/_tv-nav.scss +283 -0
  77. data/app/assets/stylesheets/components/recipes/_ingredients.scss +223 -0
  78. data/app/assets/stylesheets/components/recipes/_notes.scss +60 -0
  79. data/app/assets/stylesheets/components/recipes/_steps.scss +153 -0
  80. data/app/assets/stylesheets/components/single_comment/_single-comment.scss +251 -0
  81. data/app/assets/stylesheets/layouts/_footer-nav.scss +151 -0
  82. data/app/assets/stylesheets/layouts/_footer.scss +48 -0
  83. data/app/assets/stylesheets/layouts/_footers.scss +12 -0
  84. data/app/assets/stylesheets/layouts/_global-navbar.scss +261 -0
  85. data/app/assets/stylesheets/layouts/_headers.scss +11 -0
  86. data/app/assets/stylesheets/layouts/_sub-header-market.scss +138 -0
  87. data/app/assets/stylesheets/mixins/_mixin-alert.scss +27 -0
  88. data/app/assets/stylesheets/mixins/_mixin-animation.scss +10 -0
  89. data/app/assets/stylesheets/mixins/_mixin-badge.scss +21 -0
  90. data/app/assets/stylesheets/mixins/_mixin-buttons.scss +21 -0
  91. data/app/assets/stylesheets/mixins/_mixin-icons.scss +32 -0
  92. data/app/assets/stylesheets/mixins/_mixin-type.scss +7 -0
  93. data/app/assets/stylesheets/variables/_color-palette.scss +222 -0
  94. data/app/assets/stylesheets/widgets/_brand-sidebar-widgets.scss +11 -0
  95. data/app/assets/stylesheets/widgets/_recipe-mark.scss +55 -0
  96. data/app/assets/stylesheets/widgets/_sidebar-widgets.scss +11 -0
  97. data/app/assets/stylesheets/widgets/_tv-sidebar-widgets.scss +11 -0
  98. data/app/assets/stylesheets/widgets/_user-sidebar-widgets.scss +11 -0
  99. data/app/assets/stylesheets/widgets/_widgets.scss +11 -0
  100. data/app/assets/stylesheets/widgets/brands/_pr-ingredients.scss +154 -0
  101. data/app/assets/stylesheets/widgets/brands/_pr-latest.scss +62 -0
  102. data/app/assets/stylesheets/widgets/brands/_pr-popular-recipe-lists.scss +51 -0
  103. data/app/assets/stylesheets/widgets/brands/_pr-recent.scss +59 -0
  104. data/app/assets/stylesheets/widgets/brands/_pr-video.scss +34 -0
  105. data/app/assets/stylesheets/widgets/features/_feature-events.scss +119 -0
  106. data/app/assets/stylesheets/widgets/features/_feature-slides.scss +144 -0
  107. data/app/assets/stylesheets/widgets/feeds/_blog-feeds.scss +144 -0
  108. data/app/assets/stylesheets/widgets/feeds/_tv-feeds.scss +143 -0
  109. data/app/assets/stylesheets/widgets/modal/_modal-reset.scss +40 -0
  110. data/app/assets/stylesheets/widgets/modal/_recipe-list-modal.scss +111 -0
  111. data/app/assets/stylesheets/widgets/sidebar-widgets/_business-kitchen.scss +134 -0
  112. data/app/assets/stylesheets/widgets/sidebar-widgets/_icook-video.scss +109 -0
  113. data/app/assets/stylesheets/widgets/sidebar-widgets/_popular-recipe-lists.scss +232 -0
  114. data/app/assets/stylesheets/widgets/sidebar-widgets/_popular-recipes.scss +105 -0
  115. data/app/assets/stylesheets/widgets/sidebar-widgets/_popular-search.scss +317 -0
  116. data/app/assets/stylesheets/widgets/sidebar-widgets/_recipes-collect.scss +45 -0
  117. data/app/assets/stylesheets/widgets/sidebar-widgets/_sidebar-widget.scss +62 -0
  118. data/app/assets/stylesheets/widgets/tv/_tv-more-recipes.scss +93 -0
  119. data/app/assets/stylesheets/widgets/tv/_tv-popular-tags.scss +78 -0
  120. data/app/assets/stylesheets/widgets/users/_fav-list.scss +197 -0
  121. data/app/assets/stylesheets/widgets/users/_user-stats.scss +330 -0
  122. data/bin/console +14 -0
  123. data/bin/setup +7 -0
  124. data/config/initializers/assets.rb +5 -0
  125. data/cupboard.gemspec +40 -0
  126. data/example/.gitignore +19 -0
  127. data/lib/cupboard.rb +12 -0
  128. data/lib/cupboard/engine.rb +6 -0
  129. data/lib/cupboard/version.rb +3 -0
  130. metadata +298 -0
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: f0b251982e9b8b6faa4567d4f3040524100d5d40
4
+ data.tar.gz: 74c5cffe43801d67041dbcaf630b7d73547aefb4
5
+ SHA512:
6
+ metadata.gz: 16b8941e5a357eac074571f6dc02ce6eaf0594dc5ad2a22cd57280106a1f9253499c8b0ad0bd66eb4b275f913d9b0fdab25dbc7bd4cac00417da7cc1328c0656
7
+ data.tar.gz: 01a410b2bd017366f9abf93e93ad54fbb26cd4a682e002792357e1ccbac30e12e6bfb159cbaa65c8cb19af4bb4f0927657d2f44914ed8b1700eba517441f807b
data/.gitignore ADDED
@@ -0,0 +1,10 @@
1
+ /.bundle/
2
+ /.yardoc
3
+ /Gemfile.lock
4
+ /_yardoc/
5
+ /coverage/
6
+ /doc/
7
+ /pkg/
8
+ /spec/reports/
9
+ /tmp/
10
+ example/public/assets/**
data/.rspec ADDED
@@ -0,0 +1,2 @@
1
+ --format documentation
2
+ --color
data/.ruby-version ADDED
@@ -0,0 +1 @@
1
+ 2.3.1
data/.travis.yml ADDED
@@ -0,0 +1,4 @@
1
+ language: ruby
2
+ rvm:
3
+ - 2.2.3
4
+ before_install: gem install bundler -v 1.10.6
@@ -0,0 +1,13 @@
1
+ # Contributor Code of Conduct
2
+
3
+ As contributors and maintainers of this project, we pledge to respect all people who contribute through reporting issues, posting feature requests, updating documentation, submitting pull requests or patches, and other activities.
4
+
5
+ We are committed to making participation in this project a harassment-free experience for everyone, regardless of level of experience, gender, gender identity and expression, sexual orientation, disability, personal appearance, body size, race, ethnicity, age, or religion.
6
+
7
+ Examples of unacceptable behavior by participants include the use of sexual language or imagery, derogatory comments or personal attacks, trolling, public or private harassment, insults, or other unprofessional conduct.
8
+
9
+ Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct. Project maintainers who do not follow the Code of Conduct may be removed from the project team.
10
+
11
+ Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by opening an issue or contacting one or more of the project maintainers.
12
+
13
+ This Code of Conduct is adapted from the [Contributor Covenant](http://contributor-covenant.org), version 1.0.0, available at [http://contributor-covenant.org/version/1/0/0/](http://contributor-covenant.org/version/1/0/0/)
data/Dockerfile ADDED
@@ -0,0 +1,19 @@
1
+ FROM ruby:2.2.4
2
+
3
+ RUN apt-get update && apt-get install -y build-essential git libpq-dev libxml2-dev libxslt1-dev --no-install-recommends && rm -rf /var/lib/apt/lists/*
4
+ RUN curl -sL https://deb.nodesource.com/setup_0.12 | bash - && apt-get install -y nodejs
5
+
6
+ ENV APP_HOME /app
7
+ RUN mkdir $APP_HOME
8
+ WORKDIR $APP_HOME
9
+
10
+ ADD example/Gemfile* $APP_HOME/example/
11
+ RUN cd example && bundle install
12
+
13
+ ADD . $APP_HOME
14
+
15
+ WORKDIR $APP_HOME/example
16
+
17
+ # 這邊再跑一次才能安裝 cupboard 的 dependency
18
+ RUN bundle install
19
+ RUN bundle exec rake assets:precompile assets:clean RAILS_ENV=production
data/Gemfile ADDED
@@ -0,0 +1,6 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in cupboard.gemspec
4
+ gemspec
5
+
6
+ gem "pry"
data/LICENSE.txt ADDED
@@ -0,0 +1,21 @@
1
+ The MIT License (MIT)
2
+
3
+ Copyright (c) 2016 Stan Lo
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in
13
+ all copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
+ THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,44 @@
1
+ # Cupboard
2
+
3
+ Welcome to your new gem! In this directory, you'll find the files you need to be able to package up your Ruby library into a gem. Put your Ruby code in the file `lib/cupboard`. To experiment with that code, run `bin/console` for an interactive prompt.
4
+
5
+ ## Update versions
6
+
7
+ 1. v0.1.0 - static html pages
8
+ 2. v0.2.0 - contents generated by Hologram
9
+
10
+ ## Installation
11
+
12
+ Add this line to your application's Gemfile:
13
+
14
+ ```ruby
15
+ gem 'cupboard'
16
+ ```
17
+
18
+ And then execute:
19
+
20
+ $ bundle
21
+
22
+ Or install it yourself as:
23
+
24
+ $ gem install cupboard
25
+
26
+ ## Usage
27
+
28
+ TODO: Write usage instructions here
29
+
30
+ ## Development
31
+
32
+ After checking out the repo, run `bin/setup` to install dependencies. Then, run `rake spec` to run the tests. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
33
+
34
+ To install this gem onto your local machine, run `bundle exec rake install`. To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and tags, and push the `.gem` file to [rubygems.org](https://rubygems.org).
35
+
36
+ ## Contributing
37
+
38
+ Bug reports and pull requests are welcome on GitHub at https://github.com/[USERNAME]/cupboard. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](contributor-covenant.org) code of conduct.
39
+
40
+
41
+ ## License
42
+
43
+ The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
44
+
data/Rakefile ADDED
@@ -0,0 +1,6 @@
1
+ require "bundler/gem_tasks"
2
+ require "rspec/core/rake_task"
3
+
4
+ RSpec::Core::RakeTask.new(:spec)
5
+
6
+ task :default => :spec
Binary file
Binary file
@@ -0,0 +1,26 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
4
+ <svg version="1.0" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ viewBox="0 0 68 50" enable-background="new 0 0 68 50" xml:space="preserve">
6
+ <g>
7
+ <path fill-rule="evenodd" clip-rule="evenodd" fill="#564E4A" d="M40.66,46.636"/>
8
+ <path fill-rule="evenodd" clip-rule="evenodd" fill="#564E4A" d="M10.465,27.104c-1.828,2.838-2.249,4.441-2.655,6.165
9
+ c-0.408,1.721,0.318,2.713,2.655,3.521c2.337,0.811,2.524,0.335,3.54-0.88c1.017-1.215,1.772-7.045,1.772-7.045
10
+ s-0.032-2.295-1.772-2.641C12.346,25.893,10.465,27.104,10.465,27.104z M18.432,33.268c-0.101,0.505-0.328,6.359,7.967,8.806
11
+ c7.212,2.128,21.43,1.543,24.784-3.524c2.033-3.074,0.995-6.825-1.772-7.043c-1.585-0.128-1.873-1.521-1.769,0
12
+ c0.101,1.518-2.103,5.766-7.281,6.271c-5.181,0.508-12.033-0.622-13.962-2.75c-1.931-2.128-1.187-4.564-3.54-5.285
13
+ C18.542,28.425,18.534,32.76,18.432,33.268z M32.594,28.173c0,0,0.541,2.114,0.179,4.42c-0.36,2.306,2.351,2.692,5.24,2.306
14
+ c2.89-0.383,2.711-3.362,2.348-4.226C40.001,29.806,37.109,25.002,32.594,28.173z M53.672,25.197
15
+ c-0.216,6.583,2.778,7.931,2.778,7.931c4.298,1.792,3.663-0.104,3.663-0.104s1.449-2.011-0.566-5.612
16
+ C57.533,23.808,53.672,25.197,53.672,25.197z M0.599,29.066c-0.782,4.104-1.214,7.245,1.422,11.753
17
+ c2.545,4.352,10.667,6.253,18.081,7.973c7.415,1.723,19.728,1.29,24.787,0.609c5.01-0.676,21.534-6.048,22.754-13.444
18
+ c1.219-7.396-0.814-12.867-4.064-16.008c-3.25-3.141-17.676-3.851-21.942-4.258c-4.266-0.404-24.601,2.252-28.442,2.636
19
+ C6.634,18.983,2.272,20.287,0.599,29.066z M5.476,25.824c0,0,1.131-3.076,5.28-3.444c5.794-0.514,18.49-2.027,26.411-2.229
20
+ c7.924-0.202,20.824,0.101,23.567,3.445c2.743,3.343,3.047,7.497,2.439,11.955c-0.611,4.46-12.292,9.394-21.942,10.202
21
+ c-9.65,0.811-24.418-1.258-31.851-4.529C4.966,39.28,4.198,35.8,4.257,32.309C4.3,29.727,5.476,25.824,5.476,25.824z M6.925,15.654
22
+ c0,0,27.438-4.402,51.339-1.76l1.769-1.761c0,0-12.097-3.083-23.012-4.404c-0.696-0.082,6.195-5.503,4.424-7.043
23
+ c-1.769-1.543-15.045,0-15.045,0s5.753,5.723,4.424,6.162C29.497,7.29,15.113,9.71,6.039,13.013
24
+ C-3.032,16.316,6.925,15.654,6.925,15.654z"/>
25
+ </g>
26
+ </svg>
Binary file
Binary file
Binary file
Binary file
@@ -0,0 +1 @@
1
+ <svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17 7"><style>.st0{fill:#fff}</style><path class="st0" d="M0 0h1.7l1.8 4.9L5.4 0H7L4.2 7H2.8L0 0zm8.2 0h1.5v7H8.2V0zm3.3 0h2.9C16 0 17 1 17 2.4c0 1.6-1.3 2.4-2.8 2.4H13V7h-1.5V0zm2.7 3.5c.8 0 1.2-.5 1.2-1.1 0-.7-.5-1.1-1.2-1.1H13v2.1h1.2z"/></svg>
@@ -0,0 +1,56 @@
1
+ ---
2
+ hologram: true
3
+ title: Atomic design
4
+ name: 2_atomic
5
+ category: Atomic design
6
+ ---
7
+
8
+ > Here to briefly describe about Atomic Design for management of our systems.
9
+
10
+ ## DRY is important
11
+
12
+ It's very important to know that design systems allow us to build through a recureent process that we can use across projects. And alse they can be customized to fit specific needs.
13
+
14
+ We use he concept of Atomic design for better managing, sorting and maintenance, make the things to be re-useful, scalable and modular as well.
15
+
16
+ Keep DRY! Don't Repeat Yourself.
17
+
18
+ ## What is Atomic design
19
+
20
+ Atomic design is a methodology for creating design systems. There are five distinct levels describe from general to the specific of whole designing elements in our design flow. Below shows you each stage in more detail. (following source from: [Atomic WebDesign](http://bradfrost.com/blog/post/atomic-web-design/))
21
+
22
+ <br/>
23
+
24
+ #### Atoms
25
+
26
+ Atoms are the basic building blocks of matter. they are **HTML tags**, such as a label, an input or a button in our web interfaces.
27
+
28
+ <br/>
29
+
30
+ #### Molecules
31
+
32
+ Molecules are groups of atoms bonded together and are the smallest fundamental units of a compound. For example, a form label, input or button aren't too useful by themselves, but combine them together as a form element and now they can actually do something together.
33
+
34
+ <br/>
35
+
36
+ #### Organisms
37
+
38
+ Molecules are groups of atoms bonded together and are the smallest fundamental units of a compound. For example, a form label, input or button aren't too useful by themselves, but combine them together as a form element and now they can actually do something together.
39
+
40
+ <br/>
41
+
42
+ #### Templates
43
+
44
+ At this stage, Templates consist mostly of groups of organisms stitched together to form pages. it's here where we start to see the design coming together and start seeing things like layout in action.
45
+
46
+ Yes, you can see this is where clients start seeing the final design in place as HTML wireframe.
47
+
48
+ <br/>
49
+
50
+ #### Pages
51
+
52
+ Pages are specific instances of templates.( placeholder contents are set ex. image...) and accurate depiction of what a user will ultimately see. They are also the place to test variations in templates...(what a headline containing 40 characters looks like...etc.), they are the templates given context.
53
+
54
+ <br/>
55
+
56
+ references from: [Atomic Web Design](http://bradfrost.com/blog/post/atomic-web-design/)
@@ -0,0 +1,101 @@
1
+ ---
2
+ hologram: true
3
+ title: Develop principles
4
+ name: index
5
+ category: index
6
+ ---
7
+
8
+ > Yes, we use Bootstrap as our basic css framework, and use SCSS and Compass for our improvements. Both them are used from ruby gems (check the Gemfiles).
9
+
10
+ ## Conventions
11
+
12
+ * Use soft-tabs with a two space indent.
13
+ * Keep sorted in first alphabetical order of rule declarations.
14
+ * Put spaces before `{` in declarations.
15
+ * Put spaces after `:` in declarations.
16
+ * Put line breaks between rulesets.
17
+ * Place closing braces of declaration blocks on a new line.
18
+ * When grouping selectors, keep individual selectors to a single line.
19
+
20
+ examples
21
+
22
+ ```
23
+ .recipes-order {
24
+ border-bottom: 1px solid #ebe5e1;
25
+ line-height: 1.7;
26
+ margin-bottom: 0;
27
+ padding-bottom: 10px;
28
+ text-align: right;
29
+
30
+ a {
31
+ color: #999;
32
+
33
+ &:hover {
34
+ color: #5c4545;
35
+ }
36
+ }
37
+ }
38
+ ```
39
+
40
+ <br/>
41
+ // keep individual selectors to a single line while grouping selectors
42
+
43
+ ```
44
+ .fav-count,
45
+ .view-count,
46
+ .dish-count {
47
+ font-size: 12px;
48
+ margin-right: 0;
49
+ }
50
+ ```
51
+ <br/>
52
+ <hr/>
53
+ ### Formating
54
+
55
+ * Specifying units for zero values, write `margin: 0;` instead of `margin: 0px;` .
56
+ * Use hex color for rules, e.g., `#000` instead of `#000000` .
57
+ * Use `//` for comment blocks instead of `/* */` .
58
+ * Use `-` instead of `_` or camel case for naming.
59
+
60
+ examples
61
+
62
+ // default block style
63
+
64
+ ```
65
+ .inner-block {
66
+ border: 1px solid #eeede8;
67
+ color: #000;
68
+ margin-top: 0;
69
+ }
70
+ ```
71
+
72
+ <br/>
73
+ <hr/>
74
+ ### Misc
75
+
76
+ * For the nesting in SCSS, four levels deep is the limit. (...OK, let's aim the goal to three levels !)
77
+ * Never ever let your codelines up to more than 200 lines in every single file. Once you over lines, then you need to step back and rethink your overall strategy. (e.g., does it need to be break into as several small files as makes sense? or ask yourself is there something wrong with my thought ?...)
78
+ * List `@extend` or `@include` first ( `@extend` must be the first when both them exist) before regular rules.
79
+ * Prefer import specific things when you need it in single file instead of `@import "compass";` in only one main file.
80
+ * Partials should be named with `_`, e.g., `_recipe-card.scss` .
81
+
82
+ examples
83
+
84
+ ```
85
+ @import "compass/css3/transition";
86
+
87
+ .group_1 {
88
+   @extend .group;
89
+   @include transition(all 0.3s ease);
90
+
91
+   background-color: #ebe5e1;
92
+   border: 1px solid #d8f0d8;
93
+
94
+   .group-name {
95
+ background-color: #d8f0d8;
96
+     border-bottom: 1px solid #d8f0d8;
97
+     color: #3c4e3c;
98
+ }
99
+ }
100
+
101
+ ```
@@ -0,0 +1,4 @@
1
+ @import "base/buttons";
2
+ @import "base/badge";
3
+ @import "icookfont.scss";
4
+
@@ -0,0 +1,22 @@
1
+ //
2
+ // Default global definitons
3
+ //
4
+ // --------------------------------
5
+ // default body styles
6
+ // --------------------------------
7
+ body {
8
+ font-family: $font-family;
9
+ letter-spacing: $letter-spacing;
10
+ }
11
+
12
+ ::selection {
13
+ color: #564e42;
14
+ background: #e3d6cc;
15
+ }
16
+
17
+ .inner-block {
18
+ background-color: #fff;
19
+ border: 1px solid #ebe5e1;
20
+ margin-bottom: 10px;
21
+ padding: 20px 15px;
22
+ }
@@ -0,0 +1,95 @@
1
+ // --------------------------------
2
+ // Components
3
+ // --------------------------------
4
+ //
5
+ // breadcrumbs / pagination / order
6
+ @import "components/breadcrumbs";
7
+ @import "components/pagination";
8
+ @import "components/sorting-cards";
9
+
10
+ // --------------------------------
11
+ // Form component
12
+ // --------------------------------
13
+ // - search form
14
+ @import "components/search-form";
15
+ // - comment form
16
+ @import "components/comments/comment-form";
17
+
18
+ // --------------------------------
19
+ // Single comments
20
+ // --------------------------------
21
+ @import "components/single_comment/single-comment";
22
+
23
+ // --------------------------------
24
+ // Alert
25
+ // --------------------------------
26
+ @import "components/alerts/alert-global";
27
+ @import "components/alerts/alert-market";
28
+
29
+ // --------------------------------
30
+ // Navigation
31
+ // --------------------------------
32
+ // - recipes nav
33
+ @import "components/navigations/recipe-nav";
34
+ // - categories nav
35
+ @import "components/navigations/categories-nav";
36
+ @import "components/navigations/categories-nav-responsive";
37
+ // - brands nav
38
+ @import "components/navigations/brand-tabs-nav";
39
+ // - blog nav
40
+ @import "components/navigations/blog-nav";
41
+ // - tv nav
42
+ @import "components/navigations/tv-nav";
43
+
44
+ // --------------------------------
45
+ // Cards
46
+ // --------------------------------
47
+ // - recipe card
48
+ @import "components/cards/recipe-card"; //must imported before others
49
+ @import "components/cards/list-card";
50
+ @import "components/cards/photo-card";
51
+ // - dish card
52
+ @import "components/cards/dish-card";
53
+ // - product card in market
54
+ @import "components/cards/product-card";
55
+ // - video card in TV
56
+ @import "components/cards/video-card";
57
+
58
+ // --------------------------------
59
+ // Recipe pieces
60
+ // --------------------------------
61
+ @import "components/recipes/ingredients";
62
+ @import "components/recipes/steps";
63
+ @import "components/recipes/notes";
64
+
65
+ // --------------------------------
66
+ // Media blocks
67
+ // --------------------------------
68
+ // block thumbs //Figure with caption
69
+ // @import "components/medias/blog-feeds";
70
+ // @import "components/medias/icook-videos";
71
+ // @import "components/medias/popular-categories";
72
+ // @import "components/medias/popular-recipes";
73
+ // @import "components/medias/hot-categories";
74
+ // @import "components/medias/user-recipes";
75
+ // @import "components/medias/pr-lists";
76
+ // @import "components/medias/recipe-reference";
77
+ // block cover
78
+ @import "components/medias/categories-cover";
79
+ @import "components/medias/brand-cover";
80
+ // block nested
81
+ // @import "components/medias/business-kitchen";
82
+ // @import "components/medias/brand-product";
83
+
84
+ // --------------------------------
85
+ // Accordion
86
+ // --------------------------------
87
+ // market - qna
88
+ // @import "components/accordion";
89
+
90
+ // --------------------------------
91
+ // Text
92
+ // --------------------------------
93
+ @import "components/text";
94
+
95
+