A corporation manager and dashboard for EVE Online
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.
 
 
 
 
 

268 lines
4.0 KiB

  1. @import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,700);
  2. body {
  3. display: flex;
  4. min-height: 100vh;
  5. flex-direction: column;
  6. margin: 0;
  7. font-family: "Open Sans", sans-serif;
  8. line-height: 1.3;
  9. color: #EAEAEA;
  10. background-color: black;
  11. background-size: cover;
  12. background-position: center;
  13. background-attachment: fixed;
  14. }
  15. a {
  16. color: #78CEFF;
  17. text-decoration: none;
  18. }
  19. a:hover {
  20. color: #68BEDD;
  21. text-decoration: underline;
  22. }
  23. h1 {
  24. margin-top: 0.5em;
  25. }
  26. #container {
  27. display: flex;
  28. flex: 1;
  29. }
  30. #container > div {
  31. width: 100%;
  32. }
  33. .styled-border {
  34. border-color: #4A4A4A;
  35. border-style: solid;
  36. }
  37. main, header, footer {
  38. background-color: rgba(0, 0, 0, 0.8);
  39. }
  40. main {
  41. border-width: 1px;
  42. }
  43. header {
  44. border-width: 0 0 1px 0;
  45. }
  46. footer {
  47. padding: 0.5em 0;
  48. font-size: 85%;
  49. text-align: center;
  50. color: #BABABA;
  51. border-width: 1px 0 0;
  52. }
  53. header > div, footer > div {
  54. margin: 0 auto;
  55. }
  56. header > div > div {
  57. display: inline-block;
  58. }
  59. @media (min-width: 800px) {
  60. main, header > div, footer > div {
  61. max-width: 1000px;
  62. width: 80%;
  63. }
  64. main {
  65. margin: 2em auto;
  66. padding: 0.5em 1.5em;
  67. }
  68. footer > div {
  69. padding: 0.5em 1.5em;
  70. }
  71. header > div > .left {
  72. margin: 0.5em 1.5em 0.5em 0;
  73. }
  74. header > div > .right {
  75. margin: 0.5em 0;
  76. float: right;
  77. }
  78. }
  79. @media (max-width: 799px) {
  80. main {
  81. margin: 1.5em auto;
  82. padding: 0 1em;
  83. }
  84. footer > div {
  85. padding: 0.5em 1em;
  86. }
  87. header > div > div {
  88. margin: 0.5em 1em;
  89. }
  90. header > div > .left {
  91. margin-bottom: 0em;
  92. }
  93. }
  94. header nav {
  95. display: inline-block;
  96. margin-left: 1.5em;
  97. }
  98. header .aligned {
  99. vertical-align: middle;
  100. }
  101. header .spacer {
  102. height: 32px;
  103. visibility: hidden;
  104. }
  105. header .sep {
  106. color: #777777;
  107. }
  108. footer ul {
  109. margin: 0;
  110. padding: 0;
  111. }
  112. footer ul li {
  113. display: inline-block;
  114. list-style: none;
  115. }
  116. footer ul li:not(:last-child):after {
  117. content: " \00b7";
  118. }
  119. #corp-masthead {
  120. height: 32px;
  121. margin-right: 0.25em;
  122. }
  123. #corp-masthead-link:hover {
  124. text-decoration: none;
  125. }
  126. #corp-title {
  127. font-size: 120%;
  128. color: #EAEAEA;
  129. }
  130. #corp-title:hover {
  131. color: #BABABA;
  132. text-decoration: none;
  133. }
  134. #flashes {
  135. margin-top: 0.5em;
  136. }
  137. #flashes > div {
  138. padding: 0.5em 0.75em;
  139. border-left-width: 4px;
  140. border-left-style: solid;
  141. }
  142. #flashes > .success {
  143. border-color: #33AA22;
  144. background-color: rgba(60, 255, 30, 0.2);
  145. }
  146. #flashes > .error {
  147. border-color: #AA3322;
  148. background-color: rgba(255, 60, 30, 0.2);
  149. }
  150. #character-portrait {
  151. height: 32px;
  152. margin-right: 0.25em;
  153. box-sizing: border-box;
  154. border-width: 1px;
  155. }
  156. #character-summary {
  157. font-size: 90%;
  158. }
  159. #character-options {
  160. position: absolute;
  161. margin-top: 1em;
  162. margin-left: -5px;
  163. padding: 0.5em;
  164. background-color: rgba(0, 0, 0, 0.8);
  165. border-width: 1px;
  166. }
  167. #character-options:after, #character-options:before {
  168. bottom: 100%;
  169. left: 20px;
  170. border: solid transparent;
  171. content: " ";
  172. height: 0;
  173. width: 0;
  174. position: absolute;
  175. pointer-events: none;
  176. }
  177. #character-options:after {
  178. border-bottom-color: black;
  179. border-width: 10px;
  180. margin-left: -10px;
  181. }
  182. #character-options:before {
  183. border-bottom-color: #4A4A4A;
  184. border-width: 12px;
  185. margin-left: -12px;
  186. }
  187. #style-options {
  188. line-height: 0;
  189. }
  190. #style-options form {
  191. display: inline-block;
  192. }
  193. #style-options form:not(:first-child) {
  194. margin-left: 0.25em;
  195. }
  196. #style-options input[type="submit"] {
  197. display: inline-block;
  198. height: 24px;
  199. width: 24px;
  200. background-color: transparent;
  201. background-size: contain;
  202. background-position: center;
  203. background-repeat: no-repeat;
  204. font-size: 0;
  205. border: 0;
  206. cursor: pointer;
  207. }
  208. #error pre {
  209. white-space: pre-wrap;
  210. }
  211. #login-button {
  212. height: 30px;
  213. padding-bottom: 2px;
  214. }
  215. #logout-form {
  216. margin-bottom: 1em;
  217. }