選択できるのは25トピックまでです。 トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。

_side_toolbar_container.scss 2.6KB

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