badges.less 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152
  1. table.collection {
  2. .table;
  3. .table-bordered;
  4. .table-striped;
  5. }
  6. table.collection .name {
  7. text-align: left;
  8. vertical-align: middle;
  9. }
  10. table.collection .awards {
  11. width: 10%;
  12. text-align: center;
  13. vertical-align: middle;
  14. }
  15. table.collection .criteria {
  16. width: 40%;
  17. text-align: left;
  18. vertical-align: top;
  19. }
  20. table.collection .badgeimage,
  21. table.collection .status {
  22. width: 15%;
  23. text-align: center;
  24. vertical-align: middle;
  25. }
  26. table.collection .description {
  27. width: 25%;
  28. text-align: left;
  29. }
  30. table.collection .actions {
  31. width: 11em;
  32. text-align: center;
  33. vertical-align: middle;
  34. }
  35. a.criteria-action {
  36. padding: 0px 3px;
  37. float: right;
  38. }
  39. table.issuedbadgebox {
  40. width: 750px;
  41. background-color: #fff;
  42. }
  43. table.badgeissuedimage {
  44. width: 150px;
  45. text-align: center;
  46. }
  47. table.badgeissuedinfo {
  48. width: 600px;
  49. }
  50. table.badgeissuedinfo .bvalue {
  51. text-align: left;
  52. vertical-align: middle;
  53. }
  54. table.badgeissuedinfo .bfield {
  55. width: 125px;
  56. text-align: left;
  57. font-style: italic;
  58. }
  59. ul.badges {
  60. margin: 0;
  61. list-style: none;
  62. }
  63. .badges li {
  64. position: relative;
  65. display: inline-block;
  66. padding-bottom: 2em;
  67. text-align: center;
  68. vertical-align: top;
  69. width: 150px;
  70. }
  71. .badges li .badge-name {
  72. display: block;
  73. padding: 5px;
  74. }
  75. .badges li > img {
  76. position: absolute;
  77. }
  78. .badges li .badge-image {
  79. width: 90px;
  80. height: 90px;
  81. left: 10px;
  82. top: 0px;
  83. z-index: 1;
  84. }
  85. .badges li .badge-actions {
  86. position: relative;
  87. }
  88. div.badge {
  89. position: relative;
  90. display: block;
  91. }
  92. div.badge .expireimage {
  93. width: 100px;
  94. height: 100px;
  95. left: 20px;
  96. top: 0px;
  97. }
  98. .expireimage {
  99. .opacity(.85);
  100. width: 90px; height: 90px;
  101. left: 30px;
  102. top: 0px;
  103. position: absolute;
  104. z-index:10;
  105. }
  106. .badge-profile {
  107. vertical-align: top;
  108. }
  109. .connected {
  110. color: @alert-success-text;
  111. }
  112. .notconnected {
  113. color: @alert-danger-text;
  114. }
  115. .connecting {
  116. color: @alert-warning-text;
  117. }
  118. #page-badges-award .recipienttable tr td {
  119. vertical-align: top;
  120. }
  121. #page-badges-award .recipienttable tr td.actions .actionbutton {
  122. margin: 0.3em 0;
  123. padding: 0.5em 0;
  124. width: 100%;
  125. }
  126. #page-badges-award .recipienttable tr td.existing,
  127. #page-badges-award .recipienttable tr td.potential {
  128. width: 42%;
  129. }
  130. .statustable {
  131. margin-bottom: 0px;
  132. }
  133. .statusbox.active {
  134. background-color: @alert-success-bg;
  135. }
  136. .statusbox.inactive {
  137. background-color: @alert-warning-bg;
  138. }
  139. .activatebadge {
  140. margin: 0px;
  141. text-align: left;
  142. vertical-align: middle;
  143. }
  144. img#persona_signin {
  145. cursor: pointer;
  146. }
  147. .addcourse {
  148. float: right;
  149. }