Development of an internal social media platform with personalised dashboards for students
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.

student_page.css 5.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293
  1. @import url(http://fonts.googleapis.com/css?family=Roboto); /* FREE GOOGLE FONT */
  2. body {
  3. font-family: 'Roboto', sans-serif;
  4. line-height: 30px;
  5. }
  6. .set-radius-zero {
  7. border-radius: 0px;
  8. -moz-border-radius: 0px;
  9. -webkit-border-radius: 0px;
  10. }
  11. .content-wrapper {
  12. margin-top: 40px;
  13. min-height: 600px;
  14. padding-bottom: 60px;
  15. }
  16. .page-head-line {
  17. font-weight: 900;
  18. padding-bottom: 20px;
  19. border-bottom: 2px solid #F0677C;
  20. text-transform: uppercase;
  21. color: #F0677C;
  22. font-size: 20px;
  23. margin-bottom: 40px;
  24. }
  25. .btn {
  26. border-radius: 0px;
  27. -webkit-border-radius: 0px;
  28. -moz-border-radius: 0px;
  29. }
  30. .progress {
  31. height: 8px;
  32. border-radius: 0px;
  33. -webkit-border-radius: 0px;
  34. -moz-border-radius: 0px;
  35. }
  36. .login-icon {
  37. height: 60px;
  38. width: 60px;
  39. padding: 13px;
  40. border-radius: 50%;
  41. font-size: 30px;
  42. margin-bottom: 20px;
  43. color: #fff;
  44. text-align: center;
  45. cursor:pointer;
  46. background-color:#F0677C;
  47. -webkit-border-radius:50%;
  48. -moz-border-radius:50%;
  49. }
  50. /* =============================================================
  51. HEADER SECTION STYLES
  52. ============================================================ */
  53. header {
  54. background-color: #F0677C;
  55. color: #fff;
  56. padding: 10px;
  57. text-align: right;
  58. }
  59. /* =============================================================
  60. LOGO SECTION STYLES
  61. ============================================================ */
  62. .left-div {
  63. padding-left: 30px;
  64. margin-top: 40px;
  65. margin-bottom: 30px;
  66. }
  67. .navbar-brand {
  68. width: 250px;
  69. padding-top: 30px;
  70. }
  71. /* USER SETTINGS DIV */
  72. .user-settings-wrapper .nav > li > a {
  73. position: relative;
  74. display: block;
  75. padding: 15px 18px;
  76. border-radius: 50%;
  77. -webkit-border-radius: 50%;
  78. -moz-border-radius: 50%;
  79. height: 60px;
  80. width: 60px;
  81. background-color: #F0677C;
  82. color: #fff;
  83. }
  84. .user-settings-wrapper {
  85. margin-top: 10px;
  86. }
  87. .user-settings-wrapper li {
  88. display: inline-block;
  89. }
  90. .user-settings-wrapper .dropdown-settings {
  91. width: 200px;
  92. padding: 10px;
  93. }
  94. .user-settings-wrapper .nav > li > a:hover,.user-settings-wrapper .nav > li > a:focus {
  95. text-decoration: none;
  96. background-color: #C36464!important;
  97. }
  98. .user-settings-wrapper img {
  99. height: 64px;
  100. width: 64px;
  101. border: 1px solid #000000;
  102. }
  103. .user-settings-wrapper .dropdown-menu {
  104. margin: 0px;
  105. border-radius: 0px!important;
  106. -moz-border-radius: 0px!important;
  107. -webkit-border-radius: 0px!important;
  108. }
  109. .user-settings-wrapper .btn {
  110. border-radius: 0px!important;
  111. -moz-border-radius: 0px!important;
  112. -webkit-border-radius: 0px!important;
  113. }
  114. .user-settings-wrapper .media-heading {
  115. padding-top: 10px;
  116. }
  117. /* MENU LINKS SECTION*/
  118. .menu-section {
  119. background-color: #3D3D3D;
  120. }
  121. #menu-top a {
  122. color: #FFF;
  123. text-decoration: none;
  124. font-weight: 500;
  125. padding: 10px 10px 10px 10px;
  126. text-transform: uppercase;
  127. }
  128. .menu-top-active {
  129. background-color: #C36464;
  130. }
  131. .menu-section .nav > li > a:hover,.menu-section .nav > li > a:focus {
  132. background-color: #F0677C!important;
  133. }
  134. .menu-section .dropdown-menu > li > a:hover,.menu-section .dropdown-menu > li > a:focus {
  135. background-color: #F0677C!important;
  136. }
  137. .navbar-inverse {
  138. background-color: #C36464;
  139. border-color: transparent;
  140. }
  141. .navbar-toggle {
  142. background-color: #F0677C;
  143. border: 1px solid #fff;
  144. }
  145. .navbar {
  146. margin-bottom: 0px;
  147. }
  148. /* =============================================================
  149. FOOTER SECTION STYLES
  150. ============================================================ */
  151. footer {
  152. padding: 10px;
  153. color: #fff;
  154. font-size: 12px;
  155. background-color: #C36464;
  156. }
  157. footer a, footer a:hover {
  158. color: #fff;
  159. text-decoration: none;
  160. }
  161. /*==============================================
  162. DASHBOARD STYLES
  163. =============================================*/
  164. /* DASHBOARD ICONS */
  165. .bk-clr-one {
  166. background-color: #B9B739;
  167. }
  168. .bk-clr-two {
  169. background-color: #F94C4C;
  170. }
  171. .bk-clr-three {
  172. background-color: #119c7e;
  173. }
  174. .bk-clr-four {
  175. background-color: #b739b9;
  176. }
  177. .dashboard-div-icon {
  178. height: 75px;
  179. width: 75px;
  180. border: 2px solid #fff;
  181. padding: 20px;
  182. border-radius: 50%;
  183. -webkit-border-radius:50%;
  184. -moz-border-radius:50%;
  185. font-size: 30px;
  186. margin-bottom: 20px;
  187. color: #fff;
  188. }
  189. .dashboard-div-wrapper {
  190. border-radius: 5px;
  191. text-align: center;
  192. padding: 15px;
  193. color: #fff;
  194. margin-bottom: 50px;
  195. }
  196. .dashboard-div-wrapper .progress {
  197. height: 2px;
  198. }
  199. /* NOTICE BOARD */
  200. .notice-board .panel {
  201. border-radius: 0px;
  202. -webkit-border-radius: 0px;
  203. -moz-border-radius: 0px;
  204. }
  205. .notice-board ul {
  206. padding-left: 0px;
  207. list-style: none;
  208. }
  209. .notice-board li {
  210. padding: 10px;
  211. border-bottom: 1px solid #E5E5E5;
  212. }
  213. .notice-board li span {
  214. margin-right: 10px;
  215. border: 1px solid #DBDBDB;
  216. padding: 5px;
  217. }
  218. .notice-board li a, li a:hover {
  219. text-decoration: none;
  220. color: #000;
  221. }
  222. /* SOCIAL BUTTONS */
  223. .btn-social {
  224. color: white;
  225. opacity: 0.8;
  226. }
  227. .btn-social:hover {
  228. color: white;
  229. opacity: 1;
  230. text-decoration: none;
  231. }
  232. .btn-facebook {
  233. background-color: #3b5998;
  234. }
  235. .btn-twitter {
  236. background-color: #00aced;
  237. }
  238. .btn-linkedin {
  239. background-color: #0e76a8;
  240. }
  241. .btn-google {
  242. background-color: #c32f10;
  243. }