repository.less 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629
  1. @import "../ui/var";
  2. @repoHeaderBorderColor: #D6D6D6;
  3. @repoHeaderBgColor: #FFF;
  4. @repoHeaderNameColor: #888;
  5. /* repository main */
  6. #repo-wrapper {
  7. padding-bottom: 100px;
  8. }
  9. #repo-header {
  10. height: 69px;
  11. border-bottom: 1px solid@repoHeaderBorderColor;
  12. background-color: @repoHeaderBgColor;
  13. }
  14. #repo-header-name {
  15. line-height: 66px;
  16. color: @repoHeaderNameColor;
  17. font-size: 1.6em;
  18. font-weight: normal;
  19. margin-bottom: 0;
  20. i {
  21. margin-right: 12px;
  22. vertical-align: middle;
  23. }
  24. .divider {
  25. margin: 0 4px;
  26. }
  27. }
  28. #repo-header-meta {
  29. line-height: 66px;
  30. li {
  31. > a {
  32. padding: 0;
  33. &:hover {
  34. background-color: transparent;
  35. }
  36. }
  37. }
  38. a {
  39. & > .btn {
  40. line-height: 16px;
  41. margin-left: 16px;
  42. font-size: 13px;
  43. i {
  44. margin-right: 6px;
  45. }
  46. .num {
  47. margin-left: 6px;
  48. }
  49. }
  50. }
  51. }
  52. #repo-header-download-btn {
  53. > .btn > i {
  54. margin-right: 0 !important;
  55. }
  56. &:hover {
  57. &:after, .btn {
  58. background-color: @btnHoverBlackColor;
  59. color: #FFF;
  60. }
  61. }
  62. &:after {
  63. background-color: @btnBlackColor;
  64. padding: 9px 16px 8px 0;
  65. margin-left: -8px !important;
  66. color: #FFF;
  67. border-top: 1px solid@btnBlackColor;
  68. border-bottom: 1px solid@btnBlackColor;
  69. border-top-right-radius: .25em;
  70. border-bottom-right-radius: .25em;
  71. }
  72. }
  73. #repo-header-download-drop {
  74. line-height: 24px;
  75. width: 440px;
  76. top: 50px;
  77. left: -370px;
  78. padding: 20px;
  79. box-sizing: border-box;
  80. z-index: 1;
  81. .btn > i {
  82. margin-right: 6px;
  83. }
  84. button,
  85. input {
  86. font-size: 11px;
  87. }
  88. }
  89. #repo-content {
  90. padding: 18px 0;
  91. }
  92. .repo-wide-wrapper {
  93. padding: 18px 0;
  94. position: relative;
  95. }
  96. #repo-clone-url {
  97. border-right: none;
  98. width: 190px;
  99. border-left: none;
  100. }
  101. #repo-clone-help {
  102. clear: both;
  103. line-height: 48px;
  104. }
  105. #repo-clone-zip {
  106. line-height: 48px;
  107. a {
  108. cursor: pointer;
  109. color: white;
  110. overflow: visible;
  111. padding: .6em 1.2em;
  112. }
  113. .btn {
  114. margin: 0 6px;
  115. }
  116. }
  117. #repo-desc {
  118. font-size: 1.2em;
  119. .no-description{
  120. color: #999;
  121. }
  122. }
  123. #repo-sidebar-nav {
  124. .label {
  125. font-size: 12px;
  126. line-height: 1.4em;
  127. margin-top: 2px;
  128. }
  129. i {
  130. margin-right: 6px;
  131. }
  132. }
  133. #repo-sidebar-mini {
  134. margin-top: 6px;
  135. width: 60px;
  136. li {
  137. margin-bottom: 4px;
  138. }
  139. li > a {
  140. position: relative;
  141. padding-left: 12px;
  142. width: 24px;
  143. text-align: center;
  144. > i.octicon {
  145. font-size: 21px;
  146. }
  147. }
  148. .num {
  149. position: absolute;
  150. font-size: 12px;
  151. top: 0;
  152. left: 36px;
  153. padding: 0 2px;
  154. min-width: 16px;
  155. height: 16px;
  156. text-align: center;
  157. line-height: 16px;
  158. border-radius: 4px;
  159. opacity: 0.7;
  160. -webkit-transform: scale(0.9);
  161. font-weight: bold;
  162. }
  163. }
  164. #repo-file-nav {
  165. padding: .6em 0 1em 0;
  166. > li > a {
  167. padding-left: 0;
  168. &:hover {
  169. background-color: transparent;
  170. }
  171. }
  172. li.repo-jump > a {
  173. padding-right: 0;
  174. .btn {
  175. margin-left: -1px;
  176. }
  177. }
  178. }
  179. #repo-branch-switch {
  180. > a {
  181. .btn {
  182. padding-right: 30px;
  183. }
  184. &:after {
  185. position: absolute;
  186. top: 12px;
  187. right: 30px;
  188. margin-left: 0;
  189. color: @baseFontColor;
  190. }
  191. }
  192. > .drop-down {
  193. top: 40px;
  194. left: 0;
  195. }
  196. }
  197. #repo-branch-filter-ipt {
  198. width: 100%;
  199. border-left: none;
  200. border-right: none;
  201. box-sizing: border-box;
  202. }
  203. #repo-branch-tag {
  204. .tab-nav {
  205. border-bottom: 1px solid #EAEAEA;
  206. a {
  207. padding: .3em .8em;
  208. }
  209. .js-tab-nav-show {
  210. background-color: #EEE;
  211. font-weight: bold;
  212. }
  213. }
  214. .switching-list {
  215. max-height: 300px;
  216. overflow-y: auto;
  217. }
  218. }
  219. #repo-branch-list,
  220. #repo-tag-list {
  221. li {
  222. i {
  223. margin-right: 12px;
  224. opacity: 0;
  225. }
  226. }
  227. li.checked {
  228. i {
  229. opacity: 1;
  230. }
  231. }
  232. }
  233. #repo-bread {
  234. .bread {
  235. padding-right: 0;
  236. font-size: 16px;
  237. font-weight: bold;
  238. }
  239. }
  240. #repo-main {
  241. padding-right: 40px;
  242. box-sizing: border-box;
  243. }
  244. #repo-files-table {
  245. margin-bottom: 20px;
  246. th, td {
  247. text-align: left;
  248. line-height: 32px;
  249. }
  250. td.icon {
  251. width: 16px;
  252. padding-right: .1em;
  253. padding-left: 1em;
  254. }
  255. td.name {
  256. max-width: 120px;
  257. .text-truncate {
  258. max-width: 100%;
  259. }
  260. }
  261. td.age {
  262. max-width: 120px;
  263. text-align: right;
  264. }
  265. td.msg {
  266. max-width: 440px;
  267. .text-truncate {
  268. max-width: 100%;
  269. }
  270. }
  271. td.age,
  272. td.size,
  273. td.msg a {
  274. color: #888;
  275. }
  276. td.msg a:hover {
  277. color: #428BCA;
  278. text-decoration: underline;
  279. }
  280. tbody {
  281. background-color: #FFF;
  282. tr:hover {
  283. background-color: #ffffEE;
  284. }
  285. }
  286. thead {
  287. background-color: #F0F0F0;
  288. .author {
  289. a {
  290. margin: 0 .4em;
  291. }
  292. }
  293. .last-commit {
  294. strong {
  295. color: #444;
  296. }
  297. .text-truncate {
  298. margin-left: .4em;
  299. }
  300. }
  301. .last-commit .text-truncate,
  302. .age {
  303. font-weight: normal;
  304. color: #888;
  305. }
  306. }
  307. }
  308. #repo-readme,
  309. #repo-read-file {
  310. margin-bottom: 80px;
  311. }
  312. #repo-bare-start {
  313. margin-bottom: 100px;
  314. .panel-content {
  315. background-color: #FFF;
  316. }
  317. pre {
  318. margin: 0 40px;
  319. padding: 6px 10px;
  320. border: 1px solid #ddd;
  321. background: #f8f8f8;
  322. }
  323. }
  324. .repo-bare {
  325. #repo-bare-start {
  326. h2 {
  327. margin-top: 30px;
  328. margin-bottom: 24px;
  329. }
  330. }
  331. #repo-header-meta {
  332. display: none;
  333. }
  334. #repo-clone-ssh {
  335. margin-left: 200px;
  336. }
  337. #repo-clone-copy {
  338. margin-right: 200px;
  339. }
  340. #repo-clone-help {
  341. clear: both;
  342. width: 100%;
  343. }
  344. #repo-clone-url {
  345. width: 520px;
  346. }
  347. }
  348. /* repository create */
  349. #team-create-form,
  350. #repo-migrate-form,
  351. #repo-create-form {
  352. width: 800px;
  353. margin: 60px auto auto auto;
  354. background: white;
  355. h2 {
  356. margin: .5em 1em;
  357. }
  358. .field {
  359. margin: 1.2em 0 2em 0;
  360. }
  361. .ipt {
  362. width: 540px;
  363. }
  364. textarea {
  365. height: 120px;
  366. }
  367. .avatar {
  368. vertical-align: middle;
  369. margin-right: .6em;
  370. width: 28px;
  371. height: 28px;
  372. }
  373. &:hover {
  374. box-shadow: 0px 0px 6px #CCC;
  375. }
  376. }
  377. #repo-create-cancel {
  378. margin-left: 4em;
  379. }
  380. #repo-create-owner-list {
  381. top: 30px;
  382. left: 0;
  383. width: auto;
  384. max-width: 300px;
  385. .octicon {
  386. margin-right: 12px;
  387. opacity: 0;
  388. }
  389. .avatar {
  390. width: 20px;
  391. height: 20px;
  392. }
  393. li {
  394. white-space: nowrap;
  395. &.checked {
  396. .octicon {
  397. opacity: 1;
  398. }
  399. }
  400. a {
  401. text-overflow: ellipsis;
  402. -o-text-overflow: ellipsis;
  403. overflow: hidden;
  404. }
  405. }
  406. }
  407. .file-name {
  408. margin-left: 1em;
  409. }
  410. .file-size {
  411. font-size: 13px;
  412. color: #888;
  413. margin-left: 1em;
  414. }
  415. .code-view {
  416. overflow: auto;
  417. overflow-x: auto;
  418. overflow-y: hidden;
  419. background: white;
  420. .view-raw {
  421. min-height: 40px;
  422. text-align: center;
  423. padding-top: 20px;
  424. .btn {
  425. font-size: 1.05em;
  426. line-height: 16px;
  427. padding: 6px 8px;
  428. }
  429. }
  430. table {
  431. width: 100%;
  432. td {
  433. padding: 0;
  434. }
  435. }
  436. .lines-num {
  437. vertical-align: top;
  438. text-align: right;
  439. color: #999;
  440. background: #f5f5f5;
  441. width: 1%;
  442. span {
  443. font-family: Monaco,Menlo,Consolas,"Courier New",monospace;
  444. line-height: 1.6;
  445. padding: 0 10px;
  446. cursor: pointer;
  447. display: block;
  448. }
  449. }
  450. .lines-code > pre {
  451. border: none;
  452. border-left: 1px solid #ddd;
  453. > ol.linenums > li {
  454. padding: 0 10px;
  455. &.active {
  456. background: #ffffdd;
  457. }
  458. }
  459. }
  460. }
  461. .repo-setting-zone {
  462. padding: 30px;
  463. }
  464. #team-repositories-list,
  465. #team-members-list,
  466. #repo-collab-list {
  467. list-style: none;
  468. padding: 10px 0 5px 0;
  469. li.collab {
  470. clear: both;
  471. height: 50px;
  472. padding: 0 15px 0 15px;
  473. }
  474. a.member {
  475. color: #444;
  476. height: 50px;
  477. line-height: 50px;
  478. &:hover {
  479. color: #4183C4;
  480. }
  481. }
  482. .avatar {
  483. margin-right: 1em;
  484. width: 40px;
  485. }
  486. .remove-collab {
  487. color: #DD4B39;
  488. }
  489. }
  490. .repo-user-list-block {
  491. position: relative;
  492. top: 5px;
  493. }
  494. .setting-list {
  495. width: 100%;
  496. list-style: none;
  497. }
  498. #commits-list {
  499. padding-top: 20px;
  500. h4{
  501. line-height: 30px;
  502. margin-bottom: 0;
  503. }
  504. }
  505. .commit-list {
  506. th {
  507. background-color: #FFF;
  508. line-height: 28px !important;
  509. }
  510. .date {
  511. width: 120px;
  512. }
  513. .author {
  514. padding-left: 20px;
  515. min-width: 180px;
  516. img {
  517. margin-top: -4px;
  518. }
  519. }
  520. .sha a {
  521. font-family: Consolas, Menlo, Monaco, "Lucida Console", monospace;
  522. font-size: 14px;
  523. }
  524. }
  525. .diff-head-box {
  526. margin-top: 10px;
  527. .panel-body {
  528. padding: 10px 15px 5px 10px;
  529. }
  530. .author {
  531. img {
  532. margin-top: -7px;
  533. }
  534. }
  535. }
  536. .diff-detail-box {
  537. margin: 15px 0;
  538. line-height: 30px;
  539. ol {
  540. clear: both;
  541. padding-left: 0;
  542. margin-bottom: 28px;
  543. li {
  544. list-style: none;
  545. padding-bottom: 4px;
  546. margin-bottom: 4px;
  547. border-bottom: 1px dashed #DDD;
  548. padding-left: 6px;
  549. }
  550. }
  551. span.status{
  552. display: inline-block;
  553. width: 12px;
  554. height: 12px;
  555. margin-right: 8px;
  556. vertical-align: middle;
  557. &.modify {
  558. background-color: #f0db88;
  559. }
  560. &.add {
  561. background-color: #b4e2b4;
  562. }
  563. &.del {
  564. background-color: #e9aeae;
  565. }
  566. &.rename {
  567. background-color: #dad8ff;
  568. }
  569. }
  570. }
  571. .diff-box {
  572. .count {
  573. margin-right: 12px;
  574. .bar {
  575. background-color: #e75316;
  576. height: 12px;
  577. width: 40px;
  578. display: inline-block;
  579. margin: 2px 4px 0 4px;
  580. vertical-align: text-top;
  581. .add {
  582. background-color: #77c64a;
  583. height: 12px;
  584. }
  585. }
  586. }
  587. .file {
  588. color: #888;
  589. }
  590. .panel-header {
  591. font-size: 14px;
  592. }
  593. }
  594. .diff-file-box .code-diff tbody tr:hover td, .diff-file-box .code-diff tbody tr:hover pre {
  595. background-color: #FFF8D2 !important;
  596. border-color: #F0DB88 !important;
  597. }
  598. .diff-file-box .file-body.file-code .lines-num-old {
  599. border-right: 1px solid #DDD;
  600. }
  601. .file-content .file-body.file-code .lines-num {
  602. text-align: right;
  603. color: #999;
  604. background: #fafafa;
  605. width: 1%;
  606. }
  607. .diff-file-box .code-diff tbody tr.tag-code td, .diff-file-box .code-diff tbody tr.tag-code pre {
  608. background-color: #E0E0E0 !important;
  609. border-color: #ADADAD !important;
  610. }
  611. .diff-file-box .code-diff tbody tr.del-code td, .diff-file-box .code-diff tbody tr.del-code pre {
  612. background-color: #ffe2dd !important;
  613. border-color: #e9aeae !important;
  614. }
  615. .diff-file-box .code-diff tbody tr.add-code td, .diff-file-box .code-diff tbody tr.add-code pre {
  616. background-color: #d1ffd6 !important;
  617. border-color: #b4e2b4 !important;
  618. }
  619. .compare-head-box {
  620. margin-top: 10px;
  621. .compare {
  622. padding: 0 15px 15px 15px;
  623. }
  624. }