overview.css 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285
  1. /* Function Table*/
  2. table {
  3. border-collapse: collapse;
  4. margin-bottom: 15px;
  5. width: 100%;
  6. }
  7. table th {
  8. padding: 5px;
  9. text-align: center;
  10. }
  11. table thead th {
  12. background: #eee;
  13. padding: 0;
  14. }
  15. .table > tbody > tr > th {
  16. vertical-align: middle;
  17. padding: 0;
  18. border: 1px solid #e6e6e6;
  19. }
  20. .table > thead:first-child > tr:first-child > th {
  21. background: rgba(60, 141, 188, 0.6);
  22. font-size: 16px;
  23. color: #333;
  24. }
  25. .table > tbody > tr > td {
  26. text-align: center;
  27. vertical-align: middle;
  28. margin: 0;
  29. padding: 0;
  30. font-size: 12px;
  31. }
  32. .table > tbody > tr.warning > td {
  33. background-color: inherit;
  34. }
  35. .table > tbody > tr.mainTr.warning > td {
  36. padding: 5px;
  37. font-weight: bold;
  38. font-size: 14px;
  39. background-color: #eee;
  40. color: #555
  41. }
  42. .mainTr:hover {
  43. filter: saturate(0.9) brightness(0.9);
  44. -webkit-filter: saturate(1) brightness(0.9);
  45. cursor: pointer
  46. }
  47. .table.in {
  48. margin-bottom: 0;
  49. background-color: #f4f4f4;
  50. }
  51. .table.in > thead:first-child > tr:first-child > th {
  52. background: #f4f4f4;
  53. font-size: 14px;
  54. text-align: center;
  55. color: #e14d57;
  56. border: 0;
  57. }
  58. .table.in > thead > tr > th {
  59. width: 25%;
  60. }
  61. .table.in > tbody tr td {
  62. padding: 0;
  63. }
  64. .table > tbody > tr.warning > td.function_yes {
  65. background-color: #44ab44;
  66. color: #fff;
  67. }
  68. .table > tbody > tr.warning > td.function_yesHalf {
  69. background-color: hsl(32, 74%, 50%);
  70. color: #fff;
  71. }
  72. .table > tbody > tr.warning > td.function_no {
  73. background-color: #e11;
  74. color: #fff;
  75. }
  76. .tb tr:hover {
  77. background-color: #ddd;
  78. }
  79. .sgtr:hover {
  80. background-color: #ddd;
  81. }
  82. /* Function Table End*/
  83. /* Browser Table*/
  84. .table > tbody > tr > td {
  85. text-align: center;
  86. vertical-align: middle;
  87. border: 1px solid #e6e6e6;
  88. margin: 0;
  89. padding: 5px;
  90. }
  91. #browserTable tr:hover td,
  92. #browserTable td.hover {
  93. filter: saturate(0.8) brightness(0.8);
  94. -webkit-filter: saturate(0.8) brightness(0.8);
  95. }
  96. #browserTable .productName {
  97. background: #eee;
  98. font-weight: bold;
  99. color: #555;
  100. font-size: 14px;
  101. }
  102. td.browser_yes {
  103. background-color: rgba(68, 171, 68, 1);
  104. color: #fff;
  105. margin-top: 20px;
  106. }
  107. td.browser_no {
  108. background-color: #e11;
  109. color: #fff;
  110. }
  111. th.lib_name {
  112. width: 25%;
  113. color: #0f0f0f;
  114. background-color: rgb(238, 238, 238) !important;
  115. font-size: 12px !important;
  116. }
  117. td.browser_version {
  118. width: 25%;
  119. font-size: 12px !important;
  120. }
  121. .table > thead > tr > th {
  122. vertical-align: middle;
  123. border: 2px solid #e6e6e6;
  124. color: #555;
  125. }
  126. /* Browser Table End*/
  127. /*plugins Table*/
  128. .secondTr {
  129. background-color: #f4f4f4;
  130. }
  131. .secondTr:hover {
  132. background-color: rgba(60, 141, 188, 0.5);
  133. }
  134. .plugs-logo {
  135. height: 24px;
  136. }
  137. #plugsTable tbody tr:hover {
  138. background: #ddd;
  139. }
  140. /*plugins Table End*/
  141. /*license Table*/
  142. #licenseTable tbody tr:hover {
  143. background: #ddd;
  144. }
  145. #licenseTable p {
  146. margin: 0;
  147. }
  148. .licenseLink {
  149. color: rgba(68, 171, 68, 1);
  150. }
  151. /*license Table END*/
  152. /*choice Table*/
  153. #choiceTable .indexName {
  154. font-weight: bold;
  155. }
  156. #choiceTable p {
  157. margin: 0;
  158. }
  159. /*choice Table END*/
  160. /* span */
  161. span.chromeIcon {
  162. content: url(../img/overview/chrome_24px.png);
  163. }
  164. span.firefoxIcon {
  165. content: url(../img/overview/firefox_24px.png);
  166. }
  167. span.ieIcon {
  168. content: url(../img/overview/ie_24px.png);
  169. }
  170. span.operaIcon {
  171. content: url(../img/overview/opera_24px.png);
  172. }
  173. span.safariIcon {
  174. content: url(../img/overview/safari_24px.png);
  175. }
  176. /* span End*/
  177. /*check*/
  178. .check_big {
  179. font-weight: bold;
  180. font-size: 20px;
  181. color: rgba(68, 171, 68, 1);
  182. }
  183. .checkHalf_big {
  184. font-weight: bold;
  185. font-size: 20px;
  186. color: orange;
  187. }
  188. .error_big {
  189. font-weight: bold;
  190. font-size: 20px;
  191. }
  192. .table > tbody > tr.mainTr.warning > td.check_big {
  193. font-weight: bold;
  194. font-size: 20px;
  195. color: rgba(68, 171, 68, 1);
  196. }
  197. .table > tbody > tr.mainTr.warning > td.checkHalf_big {
  198. font-weight: bold;
  199. font-size: 20px;
  200. color: orange;
  201. }
  202. .table > tbody > tr.mainTr.warning > td.error_big {
  203. font-weight: bold;
  204. font-size: 20px;
  205. }
  206. .table.in > tbody tr td.check_small {
  207. font-weight: bold;
  208. font-size: 14px;
  209. color: rgba(68, 171, 68, 1);
  210. width: 18.8%;
  211. }
  212. .table > tbody > tr > td.error_small {
  213. font-size: 15px;
  214. width: 18.8%;
  215. }
  216. .table > tbody > tr > td.check_small {
  217. color: rgba(68, 171, 68, 1);
  218. font-size: 14px;
  219. font-weight: bold;
  220. }
  221. /*check End*/
  222. a:hover {
  223. color: #23527c;
  224. }
  225. .img-fluid {
  226. max-width: 100%;
  227. height: auto;
  228. }