3
0

buttons.css 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. /*!
  2. Pure v1.0.0
  3. Copyright 2013 Yahoo!
  4. Licensed under the BSD License.
  5. https://github.com/yahoo/pure/blob/master/LICENSE.md
  6. */
  7. .pure-button {
  8. /* Structure */
  9. display: inline-block;
  10. zoom: 1;
  11. line-height: normal;
  12. white-space: nowrap;
  13. vertical-align: middle;
  14. text-align: center;
  15. cursor: pointer;
  16. -webkit-user-drag: none;
  17. -webkit-user-select: none;
  18. -moz-user-select: none;
  19. -ms-user-select: none;
  20. user-select: none;
  21. box-sizing: border-box;
  22. }
  23. /* Firefox: Get rid of the inner focus border */
  24. .pure-button::-moz-focus-inner {
  25. padding: 0;
  26. border: 0;
  27. }
  28. /* Inherit .pure-g styles */
  29. .pure-button-group {
  30. letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
  31. *letter-spacing: normal; /* reset IE < 8 */
  32. *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
  33. text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */
  34. }
  35. .opera-only :-o-prefocus,
  36. .pure-button-group {
  37. word-spacing: -0.43em;
  38. }
  39. .pure-button-group .pure-button {
  40. letter-spacing: normal;
  41. word-spacing: normal;
  42. vertical-align: top;
  43. text-rendering: auto;
  44. }
  45. /*csslint outline-none:false*/
  46. .pure-button {
  47. font-family: inherit;
  48. font-size: 100%;
  49. padding: 0.5em 1em;
  50. color: #444; /* rgba not supported (IE 8) */
  51. color: rgba(0, 0, 0, 0.80); /* rgba supported */
  52. border: 1px solid #999; /*IE 6/7/8*/
  53. border: none rgba(0, 0, 0, 0); /*IE9 + everything else*/
  54. background-color: #E6E6E6;
  55. text-decoration: none;
  56. border-radius: 2px;
  57. }
  58. .pure-button-hover,
  59. .pure-button:hover,
  60. .pure-button:focus {
  61. /* csslint ignore:start */
  62. filter: alpha(opacity=90);
  63. /* csslint ignore:end */
  64. background-image: -webkit-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
  65. background-image: linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
  66. }
  67. .pure-button:focus {
  68. outline: 0;
  69. }
  70. .pure-button-active,
  71. .pure-button:active {
  72. box-shadow: 0 0 0 1px rgba(0,0,0, 0.15) inset, 0 0 6px rgba(0,0,0, 0.20) inset;
  73. border-color: #000\9;
  74. }
  75. .pure-button[disabled],
  76. .pure-button-disabled,
  77. .pure-button-disabled:hover,
  78. .pure-button-disabled:focus,
  79. .pure-button-disabled:active {
  80. border: none;
  81. background-image: none;
  82. /* csslint ignore:start */
  83. filter: alpha(opacity=40);
  84. /* csslint ignore:end */
  85. opacity: 0.40;
  86. cursor: not-allowed;
  87. box-shadow: none;
  88. pointer-events: none;
  89. }
  90. .pure-button-hidden {
  91. display: none;
  92. }
  93. .pure-button-primary,
  94. .pure-button-selected,
  95. a.pure-button-primary,
  96. a.pure-button-selected {
  97. background-color: rgb(0, 120, 231);
  98. color: #fff;
  99. }
  100. /* Button Groups */
  101. .pure-button-group .pure-button {
  102. margin: 0;
  103. border-radius: 0;
  104. border-right: 1px solid #111; /* fallback color for rgba() for IE7/8 */
  105. border-right: 1px solid rgba(0, 0, 0, 0.2);
  106. }
  107. .pure-button-group .pure-button:first-child {
  108. border-top-left-radius: 2px;
  109. border-bottom-left-radius: 2px;
  110. }
  111. .pure-button-group .pure-button:last-child {
  112. border-top-right-radius: 2px;
  113. border-bottom-right-radius: 2px;
  114. border-right: none;
  115. }