styles.css 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. /**
  2. * Styles généraux
  3. */
  4. /**
  5. * Grosse font pour le vidéo-proj
  6. */
  7. body {
  8. font-size: 130%;
  9. }
  10. #left-panel,
  11. #right-panel {
  12. font-family: Arial, Helvetica;
  13. position: absolute;
  14. top: 0;
  15. bottom: 0;
  16. }
  17. #left-panel {
  18. background: #fff;
  19. border-right: 1px solid #aaa;
  20. right: 40%;
  21. left: 0;
  22. }
  23. #right-panel {
  24. background: #f4f4f4;
  25. left: 60%;
  26. right: 0;
  27. }
  28. .panel-inner {
  29. padding: 10px;
  30. }
  31. #left-panel nav {
  32. display: inline-block;
  33. }
  34. #left-panel nav ul {
  35. padding-left: 0;
  36. margin: 0;
  37. }
  38. #left-panel nav ul li {
  39. display: inline-block;
  40. }
  41. a {
  42. text-decoration: none;
  43. color: #59d;
  44. }
  45. button a {
  46. color: #fff;
  47. }
  48. button.active {
  49. background: #9ad;
  50. }
  51. #editor-js,#editor-html {
  52. /*display: none;*/
  53. position: absolute;
  54. top: 510px;
  55. }
  56. /**
  57. * Styles pour l'éditeur Ace
  58. */
  59. #editor {
  60. font-size: 90%;
  61. position: absolute;
  62. top: 90px;
  63. right: 0;
  64. bottom: 0; /*200px;*/
  65. left: 0;
  66. border-top: 1px solid #aaa;
  67. border-bottom: 1px solid #aaa;
  68. }
  69. .container {
  70. margin: 50px auto;
  71. background: #fff;
  72. border: 1px solid #ddd;
  73. padding: 30px;
  74. width: 96%;
  75. border-radius: 4px;
  76. box-sizing: border-box;
  77. /*max-width: 600px;*/
  78. }
  79. input[type="submit"],
  80. button {
  81. padding: 10px;
  82. color: white;
  83. border: none;
  84. border-radius: 3px;
  85. }
  86. .blue {
  87. background: #24d;
  88. }
  89. .red {
  90. background: #d42;
  91. }
  92. .green {
  93. background: #4d2;
  94. }
  95. select,
  96. input {
  97. border: 1px solid #ddd;
  98. padding: 8px;
  99. border-radius: 3px;
  100. }
  101. a,
  102. button {
  103. margin: 5px;
  104. box-sizing: border-box;
  105. }
  106. .bordure-flashy {
  107. border: 2px solid red;
  108. }
  109. #html-content h5 {
  110. margin: 20px 0 5px 0;
  111. }
  112. #html-content p {
  113. margin: 10px 0;
  114. }
  115. /**
  116. * Styles communs pour les différents exemples
  117. */
  118. a.active {
  119. font-weight: bold;
  120. color: #48c;
  121. }