custom_portal.css 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  1. /*
  2. ===============================================================================
  3. This file contain extra CSS rules to customize the YunoHost user portal and
  4. can be used to customize app tiles, buttons, etc...
  5. ===============================================================================
  6. */
  7. body {
  8. background: #fff;
  9. }
  10. #ynh-logo {
  11. background-image: url("logo_tera.png");
  12. opacity: 1;
  13. height: 10em;
  14. }
  15. .logged #ynh-logo {
  16. background-image: url("logo_tera_simple.png");
  17. }
  18. .login-form .form-group {
  19. border: 1px solid #bbb;
  20. }
  21. .user-container,
  22. .user-menu a,
  23. .link-btn,
  24. .footer a {
  25. color: #555;
  26. }
  27. .user-menu a:hover,
  28. .footer a:hover {
  29. color: #000;
  30. }
  31. .form-text:disabled:hover {
  32. background: #797b83;
  33. }
  34. .link-btn,
  35. .link-btn:hover {
  36. background: none;
  37. }
  38. .bluebg {
  39. background: #3498DB!important;
  40. }
  41. .bluebg:hover:after,
  42. .bluebg:focus:after,
  43. .bluebg:hover:before,
  44. .bluebg:focus:before {
  45. background: #16527A!important;
  46. }
  47. .purplebg {
  48. background: #9B59B6!important;
  49. }
  50. .purplebg:hover:after,
  51. .purplebg:focus:after,
  52. .purplebg:hover:before,
  53. .purplebg:focus:before {
  54. background: #532C64!important;
  55. }
  56. .redbg {
  57. background: #E74C3C!important;
  58. }
  59. .redbg:hover:after,
  60. .redbg:focus:after,
  61. .redbg:hover:before,
  62. .redbg:focus:before {
  63. background: #921E12!important;
  64. }
  65. .orangebg {
  66. background: #F39C12!important;
  67. }
  68. .orangebg:hover:after,
  69. .orangebg:focus:after,
  70. .orangebg:hover:before,
  71. .orangebg:focus:before {
  72. background: #7F5006!important;
  73. }
  74. .greenbg {
  75. background: #2ECC71!important;
  76. }
  77. .greenbg:hover:after,
  78. .greenbg:focus:after,
  79. .greenbg:hover:before,
  80. .greenbg:focus:before {
  81. background: #176437!important;
  82. }
  83. .darkbluebg {
  84. background: #34495E!important;
  85. }
  86. .darkbluebg:hover:after,
  87. .darkbluebg:focus:after,
  88. .darkbluebg:hover:before,
  89. .darkbluebg:focus:before {
  90. background: #07090C!important;
  91. }
  92. .lightbluebg {
  93. background: #6A93D4!important;
  94. }
  95. .lightbluebg:hover:after,
  96. .lightbluebg:focus:after,
  97. .lightbluebg:hover:before,
  98. .lightbluebg:focus:before {
  99. background: #2B5394!important;
  100. }
  101. .yellowbg {
  102. background: #F1C40F!important;
  103. }
  104. .yellowbg:hover:after,
  105. .yellowbg:focus:after,
  106. .yellowbg:hover:before,
  107. .yellowbg:focus:before {
  108. background: #796307!important;
  109. }
  110. .lightpinkbg {
  111. background: #F76F87!important;
  112. }
  113. .lightpinkbg:hover:after,
  114. .lightpinkbg:focus:after,
  115. .lightpinkbg:hover:before,
  116. .lightpinkbg:focus:before {
  117. background: #DA0C31!important;
  118. }
  119. /* Following colors are not used yet */
  120. .pinkbg {
  121. background: #D66D92!important;
  122. }
  123. .pinkbg:hover:after,
  124. .pinkbg:focus:after,
  125. .pinkbg:hover:before,
  126. .pinkbg:focus:before {
  127. background: #992B52!important;
  128. }
  129. .turquoisebg {
  130. background: #1ABC9C!important;
  131. }
  132. .turquoisebg:hover:after,
  133. .turquoisebg:focus:after,
  134. .turquoisebg:hover:before,
  135. .turquoisebg:focus:before {
  136. background: #0B4C3F!important;
  137. }
  138. .lightyellow {
  139. background: #FFC973!important;
  140. }
  141. .lightyellow:hover:after,
  142. .lightyellow:focus:after,
  143. .lightyellow:hover:before,
  144. .lightyellow:focus:before {
  145. background: #F39500!important;
  146. }
  147. .lightgreen {
  148. background: #B5F36D!important;
  149. }
  150. .lightgreen:hover:after,
  151. .lightgreen:focus:after,
  152. .lightgreen:hover:before,
  153. .lightgreen:focus:before {
  154. background: #77CF11!important;
  155. }
  156. .purpledarkbg {
  157. background: #8E44AD!important;
  158. }
  159. .purpledarkbg:hover:after,
  160. .purpledarkbg:focus:after,
  161. .purpledarkbg:hover:before,
  162. .purpledarkbg:focus:before {
  163. background: #432051!important;
  164. }