repository.less 13 KB

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