base.less 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646
  1. @font-family-base: 'Rubik', 'Avenir Next', 'Helvetica Neue', sans-serif;
  2. @font-family-code: 'Roboto Mono', Consolas, 'Courier New', monospace;
  3. * {
  4. box-sizing: border-box;
  5. }
  6. *:before,
  7. *:after {
  8. box-sizing: border-box;
  9. }
  10. html {
  11. font-family: sans-serif;
  12. font-size: 100%;
  13. -ms-text-size-adjust: 100%;
  14. -webkit-text-size-adjust: 100%;
  15. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  16. height: 100%;
  17. }
  18. body {
  19. font-family: @font-family-base;
  20. margin: 0;
  21. font-size: 87.5%;
  22. line-height: 1.4;
  23. color: @gray-darker;
  24. background: @white-dark;
  25. -webkit-font-smoothing: antialiased;
  26. -moz-osx-font-smoothing: grayscale;
  27. overflow-x: hidden;
  28. min-height: 100vh;
  29. }
  30. h1,
  31. h2,
  32. h3,
  33. h4,
  34. h5,
  35. h6 {
  36. margin: 0 0 20px;
  37. line-height: 1.2;
  38. font-weight: 600;
  39. }
  40. h1 {
  41. font-size: 2.25rem;
  42. }
  43. h2 {
  44. font-size: 1.875rem;
  45. }
  46. h3 {
  47. font-size: 1.625rem;
  48. }
  49. h4 {
  50. font-size: 1.375rem;
  51. }
  52. h5 {
  53. font-size: 1.25rem;
  54. }
  55. h6 {
  56. font-size: 1.125rem;
  57. }
  58. dl {
  59. margin-top: 0; // Remove browser default
  60. margin-bottom: @line-height-computed;
  61. }
  62. dt,
  63. dd {
  64. line-height: @line-height-base;
  65. }
  66. dt {
  67. font-weight: 700;
  68. }
  69. dd {
  70. margin-left: 0; // Undo browser default
  71. }
  72. ul,
  73. ol {
  74. margin-top: 0;
  75. margin-bottom: (@line-height-computed / 2);
  76. padding: 0 0 0 20px;
  77. ul,
  78. ol {
  79. margin-bottom: 0;
  80. }
  81. }
  82. p,
  83. pre {
  84. margin: 0 0 20px;
  85. }
  86. ul,
  87. ol {
  88. margin: 0 0 20px;
  89. }
  90. p,
  91. ul,
  92. ol,
  93. blockquote {
  94. padding-top: 0;
  95. margin-top: 0;
  96. line-height: 1.5;
  97. }
  98. input,
  99. button,
  100. select,
  101. textarea {
  102. font-family: inherit;
  103. font-size: inherit;
  104. line-height: inherit;
  105. }
  106. //
  107. // Scaffolding
  108. // --------------------------------------------------
  109. // Reset the box-sizing
  110. //
  111. // Heads up! This reset may cause conflicts with some third-party widgets.
  112. // For recommendations on resolving such conflicts, see
  113. // https://getbootstrap.com/docs/3.4/getting-started/#third-box-sizing
  114. // Reset fonts for relevant elements
  115. input,
  116. button,
  117. select,
  118. textarea {
  119. font-family: inherit;
  120. font-size: inherit;
  121. line-height: inherit;
  122. }
  123. a {
  124. cursor: pointer;
  125. transition: color linear 0.2s;
  126. color: @link-color;
  127. text-decoration: none;
  128. &:hover {
  129. text-decoration: none;
  130. }
  131. }
  132. // Figures
  133. //
  134. // We reset this here because previously Normalize had no `figure` margins. This
  135. // ensures we don't break anyone's use of the element.
  136. figure {
  137. margin: 0;
  138. }
  139. img {
  140. vertical-align: middle;
  141. max-width: 100%;
  142. }
  143. /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
  144. //
  145. // 1. Set default font family to sans-serif.
  146. // 2. Prevent iOS and IE text size adjust after device orientation change,
  147. // without disabling user zoom.
  148. //
  149. //
  150. // Remove default margin.
  151. //
  152. // HTML5 display definitions
  153. // ==========================================================================
  154. //
  155. // Correct `block` display not defined for any HTML5 element in IE 8/9.
  156. // Correct `block` display not defined for `details` or `summary` in IE 10/11
  157. // and Firefox.
  158. // Correct `block` display not defined for `main` in IE 11.
  159. //
  160. article,
  161. aside,
  162. details,
  163. figcaption,
  164. figure,
  165. footer,
  166. header,
  167. hgroup,
  168. main,
  169. menu,
  170. nav,
  171. section,
  172. summary {
  173. display: block;
  174. }
  175. //
  176. // 1. Correct `inline-block` display not defined in IE 8/9.
  177. // 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
  178. //
  179. audio,
  180. canvas,
  181. progress,
  182. video {
  183. display: inline-block; // 1
  184. vertical-align: baseline; // 2
  185. }
  186. //
  187. // Prevent modern browsers from displaying `audio` without controls.
  188. // Remove excess height in iOS 5 devices.
  189. //
  190. audio:not([controls]) {
  191. display: none;
  192. height: 0;
  193. }
  194. //
  195. // Address `[hidden]` styling not present in IE 8/9/10.
  196. // Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
  197. //
  198. [hidden],
  199. template {
  200. display: none;
  201. }
  202. // Links
  203. // ==========================================================================
  204. //
  205. // Remove the gray background color from active links in IE 10.
  206. //
  207. a {
  208. background-color: transparent;
  209. }
  210. //
  211. // Improve readability of focused elements when they are also in an
  212. // active/hover state.
  213. //
  214. a:active,
  215. a:hover {
  216. outline: 0;
  217. }
  218. // Text-level semantics
  219. // ==========================================================================
  220. //
  221. // 1. Remove the bottom border in Chrome 57- and Firefox 39-.
  222. // 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
  223. //
  224. abbr[title] {
  225. border-bottom: none; // 1
  226. text-decoration: underline; // 2
  227. text-decoration: underline dotted; // 2
  228. }
  229. b,
  230. strong {
  231. font-weight: bold;
  232. }
  233. dfn {
  234. font-style: italic;
  235. }
  236. mark {
  237. background: #ff0;
  238. color: #000;
  239. }
  240. small {
  241. font-size: 14px;
  242. }
  243. //
  244. // Prevent `sub` and `sup` affecting `line-height` in all browsers.
  245. //
  246. sub,
  247. sup {
  248. font-size: 75%;
  249. line-height: 0;
  250. position: relative;
  251. vertical-align: baseline;
  252. }
  253. sup {
  254. top: -0.5em;
  255. }
  256. sub {
  257. bottom: -0.25em;
  258. }
  259. // Embedded content
  260. // ==========================================================================
  261. //
  262. // Remove border when inside `a` element in IE 8/9/10.
  263. //
  264. img {
  265. border: 0;
  266. }
  267. //
  268. // Correct overflow not hidden in IE 9/10/11.
  269. //
  270. svg:not(:root) {
  271. overflow: hidden;
  272. }
  273. // Grouping content
  274. // ==========================================================================
  275. hr {
  276. box-sizing: content-box;
  277. height: 0;
  278. }
  279. //
  280. // Code (inline and block)
  281. // --------------------------------------------------
  282. // Inline and block code styles
  283. code,
  284. kbd,
  285. pre,
  286. samp {
  287. font-family: @font-family-monospace;
  288. font-size: 1em;
  289. }
  290. // Inline code
  291. code {
  292. padding: 2px 4px;
  293. font-size: 90%;
  294. color: @code-color;
  295. background-color: @code-bg;
  296. border-radius: @border-radius-base;
  297. }
  298. // User input typically entered via keyboard
  299. kbd {
  300. padding: 2px 4px;
  301. font-size: 90%;
  302. color: @kbd-color;
  303. background-color: @kbd-bg;
  304. border-radius: @border-radius-small;
  305. box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
  306. kbd {
  307. padding: 0;
  308. font-size: 100%;
  309. font-weight: 700;
  310. box-shadow: none;
  311. }
  312. }
  313. pre,
  314. code {
  315. border: 0;
  316. background-color: @white-darker;
  317. color: @gray-darker;
  318. border-radius: 3px;
  319. }
  320. pre {
  321. display: block;
  322. padding: ((@line-height-computed - 1) / 2);
  323. font-size: (@font-size-base - 1); // 14px to 13px
  324. line-height: @line-height-base;
  325. word-break: break-all;
  326. white-space: pre-wrap;
  327. word-wrap: break-word;
  328. border-radius: @border-radius-base;
  329. // Account for some code outputs that place code tags in pre tags
  330. code {
  331. padding: 0;
  332. font-size: inherit;
  333. white-space: pre-wrap;
  334. border-radius: 0;
  335. }
  336. }
  337. // Forms
  338. // ==========================================================================
  339. // 1. Correct color not being inherited.
  340. // Known issue: affects color of disabled elements.
  341. // 2. Correct font properties not being inherited.
  342. // 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
  343. //
  344. button,
  345. input,
  346. optgroup,
  347. select,
  348. textarea {
  349. color: inherit; // 1
  350. font: inherit; // 2
  351. margin: 0; // 3
  352. }
  353. //
  354. // Address inconsistent `text-transform` inheritance for `button` and `select`.
  355. // All other form control elements do not inherit `text-transform` values.
  356. // Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
  357. // Correct `select` style inheritance in Firefox.
  358. //
  359. button {
  360. overflow: visible;
  361. }
  362. button,
  363. select {
  364. text-transform: none;
  365. }
  366. //
  367. // 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
  368. // and `video` controls.
  369. // 2. Correct inability to style clickable `input` types in iOS.
  370. // 3. Improve usability and consistency of cursor style between image-type
  371. // `input` and others.
  372. //
  373. button,
  374. html input[type="button"], // 1
  375. input[type="reset"],
  376. input[type="submit"] {
  377. -webkit-appearance: button; // 2
  378. cursor: pointer; // 3
  379. }
  380. //
  381. // Re-set default cursor for disabled elements.
  382. //
  383. button[disabled],
  384. html input[disabled] {
  385. cursor: default;
  386. }
  387. //
  388. // Remove inner padding and border in Firefox 4+.
  389. //
  390. button::-moz-focus-inner,
  391. input::-moz-focus-inner {
  392. border: 0;
  393. padding: 0;
  394. }
  395. //
  396. // It's recommended that you don't attempt to style these elements.
  397. // Firefox's implementation doesn't respect box-sizing, padding, or width.
  398. //
  399. // 1. Address box sizing set to `content-box` in IE 8/9/10.
  400. // 2. Remove excess padding in IE 8/9/10.
  401. //
  402. input[type='checkbox'],
  403. input[type='radio'] {
  404. box-sizing: border-box; // 1
  405. padding: 0; // 2
  406. }
  407. //
  408. // Fix the cursor style for Chrome's increment/decrement buttons. For certain
  409. // `font-size` values of the `input`, it causes the cursor style of the
  410. // decrement button to change from `default` to `text`.
  411. //
  412. input[type='number']::-webkit-inner-spin-button,
  413. input[type='number']::-webkit-outer-spin-button {
  414. height: auto;
  415. }
  416. //
  417. // 1. Address `appearance` set to `searchfield` in Safari and Chrome.
  418. // 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
  419. //
  420. input[type='search'] {
  421. -webkit-appearance: textfield; // 1
  422. box-sizing: content-box; //2
  423. }
  424. //
  425. // Remove inner padding and search cancel button in Safari and Chrome on OS X.
  426. // Safari (but not Chrome) clips the cancel button when the search input has
  427. // padding (and `textfield` appearance).
  428. //
  429. input[type='search']::-webkit-search-cancel-button,
  430. input[type='search']::-webkit-search-decoration {
  431. -webkit-appearance: none;
  432. }
  433. //
  434. // Define consistent border, margin, and padding.
  435. //
  436. fieldset {
  437. border: 1px solid #c0c0c0;
  438. margin: 0 2px;
  439. padding: 0.35em 0.625em 0.75em;
  440. }
  441. //
  442. // 1. Correct `color` not being inherited in IE 8/9/10/11.
  443. // 2. Remove padding so people aren't caught out if they zero out fieldsets.
  444. //
  445. legend {
  446. border: 0; // 1
  447. padding: 0; // 2
  448. }
  449. //
  450. // Remove default vertical scrollbar in IE 8/9/10/11.
  451. //
  452. textarea {
  453. overflow: auto;
  454. }
  455. //
  456. // Don't inherit the `font-weight` (applied by a rule above).
  457. // NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
  458. //
  459. optgroup {
  460. font-weight: bold;
  461. }
  462. // Tables
  463. // ==========================================================================
  464. table {
  465. background-color: @table-bg;
  466. border-collapse: collapse;
  467. border-spacing: 0;
  468. margin: 0 0 20px;
  469. col[class*='col-'] {
  470. position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623)
  471. display: table-column;
  472. float: none;
  473. }
  474. td,
  475. th {
  476. &[class*='col-'] {
  477. position: static; // Prevent border hiding in Firefox and IE9-11 (see https://github.com/twbs/bootstrap/issues/11623)
  478. display: table-cell;
  479. float: none;
  480. }
  481. }
  482. }
  483. td,
  484. th {
  485. padding: 0;
  486. }
  487. th {
  488. text-align: left;
  489. }
  490. caption {
  491. padding-top: @table-cell-padding;
  492. padding-bottom: @table-cell-padding;
  493. color: @text-muted;
  494. text-align: left;
  495. }
  496. // These styles are still used in getsentry
  497. .table {
  498. width: 100%;
  499. max-width: 100%;
  500. margin-bottom: @line-height-computed;
  501. // Cells
  502. > thead,
  503. > tbody,
  504. > tfoot {
  505. > tr {
  506. > th,
  507. > td {
  508. padding: @table-cell-padding;
  509. line-height: @line-height-base;
  510. vertical-align: top;
  511. border-top: 1px solid @table-border-color;
  512. }
  513. }
  514. }
  515. // Bottom align for column headings
  516. > thead > tr > th {
  517. vertical-align: bottom;
  518. border-bottom: 2px solid @table-border-color;
  519. }
  520. // Remove top border from thead by default
  521. > caption + thead,
  522. > colgroup + thead,
  523. > thead:first-child {
  524. > tr:first-child {
  525. > th,
  526. > td {
  527. border-top: 0;
  528. }
  529. }
  530. }
  531. // Account for multiple tbody instances
  532. > tbody + tbody {
  533. border-top: 2px solid @table-border-color;
  534. }
  535. // Nesting
  536. .table {
  537. background-color: @body-bg;
  538. }
  539. }