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.

_side_toolbar_container.scss 2.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. /**
  2. * Toolbar side panel main container element.
  3. */
  4. #sideToolbarContainer {
  5. background-color: rgba(0,0,0,0.8);
  6. height: 100%;
  7. left: $defaultToolbarSize;
  8. max-width: $sidebarWidth;
  9. overflow: hidden;
  10. position: absolute;
  11. top: 0;
  12. width: 0;
  13. z-index: 800;
  14. /**
  15. * Labels inside the side panel.
  16. */
  17. label {
  18. color: $defaultColor;
  19. }
  20. /**
  21. * Form elements and blocks.
  22. */
  23. input, select, a,
  24. .sideToolbarBlock, .form-control, .button-control {
  25. display: block;
  26. margin-top: 15px;
  27. margin-left: 10%;
  28. width: 80%;
  29. }
  30. /**
  31. * Specify styling of elements inside a block.
  32. */
  33. .sideToolbarBlock {
  34. input, button, a, select {
  35. margin-left: 0;
  36. margin-top: 5px;
  37. width: 100%;
  38. }
  39. input[type='checkbox'] {
  40. display: inline;
  41. width: auto !important;
  42. > label {
  43. margin-top: 5px;
  44. width: 80%;
  45. }
  46. }
  47. }
  48. /**
  49. * Inner container, for example contact list, settings or profile.
  50. */
  51. .sideToolbarContainer__inner {
  52. display: none;
  53. height: 100%;
  54. width: $sidebarWidth;
  55. position: absolute;
  56. box-sizing: border-box;
  57. color: #FFF;
  58. /**
  59. * Titles and subtitles of inner containers.
  60. */
  61. div.title, div.subTitle {
  62. margin: 10px 0;
  63. }
  64. /**
  65. * Main title size.
  66. */
  67. div.title {
  68. color: $defaultColor !important;
  69. font-size: 16px;
  70. text-align: center;
  71. }
  72. /**
  73. * Subtitle specific properties.
  74. */
  75. div.subTitle {
  76. color: $defaultSideBarFontColor !important;
  77. font-size: 11px;
  78. font-weight: 500;
  79. margin-left: 10%;
  80. text-align: left;
  81. }
  82. /**
  83. * First element after a title.
  84. */
  85. .first {
  86. margin-top: 0 !important;
  87. }
  88. /**
  89. * Buttons in the side toolbar container.
  90. */
  91. .button-control {
  92. margin: 9px 0;
  93. width: 100%;
  94. }
  95. }
  96. }
  97. #device_settings {
  98. width : auto !important;
  99. text-align: center;
  100. }
  101. /**
  102. * Profile
  103. */
  104. .auth_container {
  105. ul {
  106. padding: 0;
  107. li {
  108. list-style-type: none;
  109. a.authButton {
  110. width: 160px;
  111. margin: 10px 20px;
  112. padding: 3px 29px;
  113. box-sizing: border-box;
  114. background-color: #06a5df;
  115. border-radius: 4px;
  116. cursor: pointer;
  117. color: $defaultColor;
  118. text-decoration: none;
  119. text-align: center;
  120. }
  121. }
  122. }
  123. }