You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

dashboard.less 4.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
  1. @import "../ui/var";
  2. /*
  3. The dashboard page style
  4. */
  5. @dashboardHeaderBorderColor: #D6D6D6;
  6. @dashboardHeaderLinkColor: #444;
  7. @dashboardHeaderLinkHoverColor: #D9453D;
  8. @dashboardSwitchMenuHoverBgColor: @linkColor;
  9. @dashboardSwitchMenuHoverFontColor: #FFF;
  10. // dashboard header, contains dashboard selection menu and nav of Feed/PR/Issues.
  11. #dashboard-header {
  12. border-bottom: 1px solid @dashboardHeaderBorderColor;
  13. height: 69px;
  14. > .menu-line {
  15. > li {
  16. padding: 12px 0;
  17. }
  18. > li.right {
  19. > a {
  20. font-size: 1.2em;
  21. color: @dashboardHeaderLinkColor;
  22. &:hover {
  23. background-color: transparent;
  24. color: @dashboardHeaderLinkHoverColor;
  25. }
  26. .octicon {
  27. margin-right: 6px;
  28. }
  29. }
  30. .current {
  31. border-bottom: 2px solid #D26911;
  32. }
  33. }
  34. }
  35. }
  36. // dashboard context switch selection
  37. #dashboard-selection-menu {
  38. a img {
  39. margin: -4px 10px 0 0;
  40. }
  41. }
  42. #dashboard {
  43. padding: 24px 0;
  44. }
  45. // dashboard sidebar contains contributed repositories panel,
  46. // and my repositories panel
  47. #dashboard-sidebar {
  48. .panel-header h4 {
  49. margin: 0;
  50. }
  51. > .panel {
  52. margin-bottom: 24px;
  53. border-bottom-left-radius: .3em;
  54. border-bottom-right-radius: .3em;
  55. }
  56. }
  57. #dashboard-sidebar-menu {
  58. border-top-left-radius: .3em;
  59. border-top-right-radius: .3em;
  60. > li {
  61. border: 1px solid #d6d6d6;
  62. float: left;
  63. margin-right: -1px;
  64. border-bottom: none;
  65. > a {
  66. padding-top: .4em;
  67. padding-bottom: .4em;
  68. }
  69. }
  70. > li.first {
  71. border-top-left-radius: .3em;
  72. > a {
  73. border-top-left-radius: .3em;
  74. }
  75. }
  76. > li.drop {
  77. border: none;
  78. float: right;
  79. }
  80. width: 100%;
  81. height: 35px;
  82. > li.js-tab-nav-show {
  83. background-color: #EEEEEE;
  84. }
  85. > li.last {
  86. border-top-right-radius: .3em;
  87. > a {
  88. border-top-right-radius: .3em;
  89. }
  90. }
  91. }
  92. #dashboard-my-mirror,
  93. #dashboard-my-org,
  94. #dashboard-my-repo {
  95. li {
  96. &.private {
  97. background-color: #fcf8e9;
  98. }
  99. border-bottom: 1px solid #EAEAEA;
  100. &:last-child {
  101. border-bottom: none;
  102. }
  103. a {
  104. padding: 6px 1.2em;
  105. display: block;
  106. .octicon {
  107. margin-right: 6px;
  108. color: #888;
  109. }
  110. &:hover {
  111. .repo-name {
  112. text-decoration: underline;
  113. }
  114. }
  115. }
  116. }
  117. .repo-name {
  118. font-size: 1.1em;
  119. }
  120. .repo-star {
  121. color: #888;
  122. }
  123. .repo-contrib-header {
  124. border-top: 1px solid #d6d6d6;
  125. }
  126. }
  127. #dashboard-my-repo {
  128. .panel-header {
  129. .octicon {
  130. margin-right: 6px;
  131. font-size: 12px;
  132. }
  133. }
  134. .repo-count {
  135. margin-left: 4px;
  136. }
  137. }
  138. #dashboard-my-org,
  139. #dashboard-my-mirror {
  140. display: none;
  141. }
  142. // the button of new repository in my repositories panel
  143. #dashboard-new-repo {
  144. width: 50px;
  145. height: 35px;
  146. padding-top: 6px;
  147. margin-right: 1px;
  148. .octicon {
  149. font-size: 2em;
  150. }
  151. border-top-left-radius: .3em;
  152. border-top-right-radius: .3em;
  153. }
  154. // the drop-down menu of #dashboard-new-repo
  155. #dashboard-new-repo-menu {
  156. top: 35px;
  157. width: 180px;
  158. background-color: #FFF;
  159. left: -132px;
  160. .octicon {
  161. margin-right: 6px;
  162. font-size: 1.1em;
  163. }
  164. }
  165. #dashboard-selection-menu {
  166. > .drop-down {
  167. top: 56px;
  168. }
  169. }
  170. // the drop-down menu of #dashboard-selection-menu
  171. #dashboard-switch-menu {
  172. > li {
  173. > a {
  174. img {
  175. margin-top: 0;
  176. }
  177. .octicon {
  178. margin-right: 12px;
  179. }
  180. }
  181. &:last-child {
  182. > a {
  183. border-bottom-left-radius: .3em;
  184. border-bottom-right-radius: .3em;
  185. }
  186. }
  187. }
  188. > li.org > a {
  189. .octicon {
  190. opacity: 0;
  191. }
  192. }
  193. > li.checked > a {
  194. .octicon {
  195. opacity: 1;
  196. }
  197. font-weight: bold;
  198. }
  199. border-bottom-left-radius: .3em;
  200. border-bottom-right-radius: .3em;
  201. }
  202. #dashboard-news {
  203. .news {
  204. margin-right: 2.4em;
  205. .mega-octicon {
  206. color: #CCC;
  207. }
  208. .avatar {
  209. margin: 0 1.2em;
  210. }
  211. .news-content,
  212. .news-time {
  213. color: #888;
  214. }
  215. padding-bottom: 1em;
  216. margin-bottom: 1em;
  217. border-bottom: 1px solid #E6E6E6;
  218. min-height: 30px;
  219. }
  220. .push-news {
  221. .news-content li {
  222. margin-left: 1em;
  223. img {
  224. margin-bottom: -2px;
  225. }
  226. }
  227. }
  228. }