_examples.scss 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. .s2-example + pre,
  2. .s2-event-log + pre {
  3. margin: -15px -15px 15px;
  4. border-radius: 0;
  5. border-width: 0 0 1px;
  6. }
  7. @media (min-width: 768px) {
  8. .s2-example + pre,
  9. .s2-event-log + pre {
  10. margin-top: -16px;
  11. margin-left: 0;
  12. margin-right: 0;
  13. border-width: 1px;
  14. border-bottom-left-radius: 4px;
  15. border-bottom-right-radius: 4px;
  16. }
  17. }
  18. .s2-event-log {
  19. background: #002451;
  20. font-family: Menlo, 'Bitstream Vera Sans Mono', 'DejaVu Sans Mono', Monaco, Consolas, monospace;
  21. color: white;
  22. position: relative;
  23. padding: 45px 15px 15px;
  24. margin: 0 -15px 15px;
  25. &:after {
  26. content: "Event Log";
  27. position: absolute;
  28. top: 15px;
  29. left: 15px;
  30. font-size: 12px;
  31. font-weight: bold;
  32. color: #BBB;
  33. text-transform: uppercase;
  34. letter-spacing: 1px;
  35. }
  36. }
  37. .s2-example {
  38. position: relative;
  39. padding: 45px 15px 15px;
  40. margin: 0 -15px 15px;
  41. background-color: #FAFAFA;
  42. box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.05);
  43. border-color: #E5E5E5 #EEE #EEE;
  44. border-style: solid;
  45. border-width: 1px 0;
  46. &:after {
  47. content: "Example";
  48. position: absolute;
  49. top: 15px;
  50. left: 15px;
  51. font-size: 12px;
  52. font-weight: bold;
  53. color: #BBB;
  54. text-transform: uppercase;
  55. letter-spacing: 1px;
  56. }
  57. }
  58. @media (min-width: 768px) {
  59. .s2-example {
  60. margin-left: 0;
  61. margin-right: 0;
  62. background-color: #FFF;
  63. border-width: 1px;
  64. border-color: #eee;
  65. border-radius: 4px 4px 0 0;
  66. box-shadow: none;
  67. }
  68. .s2-event-log {
  69. margin-left: 0;
  70. margin-right: 0;
  71. margin-top: -15px;
  72. border-width: 1px;
  73. border-color: #eee;
  74. box-shadow: none;
  75. }
  76. }