scaffolding.less 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. //
  2. // Scaffolding
  3. // --------------------------------------------------
  4. // Reset the box-sizing
  5. *,
  6. *:before,
  7. *:after {
  8. .box-sizing(border-box);
  9. }
  10. // Body reset
  11. html {
  12. font-size: 62.5%;
  13. -webkit-tap-highlight-color: rgba(0,0,0,0);
  14. }
  15. body {
  16. font-family: @font-family-base;
  17. font-size: @font-size-base;
  18. line-height: @line-height-base;
  19. color: @text-color;
  20. background-color: @body-bg;
  21. }
  22. // Reset fonts for relevant elements
  23. input,
  24. button,
  25. select,
  26. textarea {
  27. font-family: inherit;
  28. font-size: inherit;
  29. line-height: inherit;
  30. }
  31. // Links
  32. a {
  33. color: @link-color;
  34. text-decoration: none;
  35. &:hover,
  36. &:focus {
  37. color: @link-hover-color;
  38. text-decoration: underline;
  39. }
  40. &:focus {
  41. .tab-focus();
  42. }
  43. }
  44. // Images
  45. img {
  46. vertical-align: middle;
  47. }
  48. // Responsive images (ensure images don't scale beyond their parents)
  49. .img-responsive {
  50. .img-responsive();
  51. }
  52. // Rounded corners
  53. .img-rounded {
  54. border-radius: @border-radius-large;
  55. }
  56. // Image thumbnails
  57. //
  58. // Heads up! This is mixin-ed into thumbnails.less for `.thumbnail`.
  59. .img-thumbnail {
  60. padding: @thumbnail-padding;
  61. line-height: @line-height-base;
  62. background-color: @thumbnail-bg;
  63. border: 1px solid @thumbnail-border;
  64. border-radius: @thumbnail-border-radius;
  65. .transition(all .2s ease-in-out);
  66. // Keep them at most 100% wide
  67. .img-responsive(inline-block);
  68. }
  69. // Perfect circle
  70. .img-circle {
  71. border-radius: 50%; // set radius in percents
  72. }
  73. // Horizontal rules
  74. hr {
  75. margin-top: @line-height-computed;
  76. margin-bottom: @line-height-computed;
  77. border: 0;
  78. border-top: 1px solid @hr-border;
  79. }
  80. // Only display content to screen readers
  81. //
  82. // See: http://a11yproject.com/posts/how-to-hide-content/
  83. .sr-only {
  84. position: absolute;
  85. width: 1px;
  86. height: 1px;
  87. margin: -1px;
  88. padding: 0;
  89. overflow: hidden;
  90. clip: rect(0,0,0,0);
  91. border: 0;
  92. }