Home Explore Help
Sign In
caryoscelus
/
zeronet-conservancy
mirror of https://github.com/zeronet-conservancy/zeronet-conservancy.git
Watch 1
Star 0
Fork 0
Files Issues 0 Wiki
Branch: optional-rich
Branches Tags
zeronet-cons...
/
plugins
/
UiFileManager
/
media
/
css
/
UiFileManager.css

UiFileManager.css 8.4 KB
Permalink History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148 
  1. body { background-color: #EEEEF5; font-family: "Segoe UI", Helvetica, Arial; height: 95000px; overflow: hidden; }
    2. 

  2. body.loaded { height: auto; overflow: auto }
    3. 

  3. h1 { font-weight: lighter; }
    4. 

  4. 

  5. a { color: #333 }
    6. 

  6. a:hover { text-decoration: none }
    7. 

  7. input::placeholder { color: rgba(255, 255, 255, 0.3) }
    8. 

  8. 

  9. h2 { font-weight: lighter; }
    10. 

  10. 

  11. .link { background-color: transparent; outline: 5px solid transparent; transition: all 0.3s }
    12. 

  12. .link:active { background-color: #fbf5ff; outline: 5px solid #fbf5ff; transition: none }
    13. 

  13. 

  14. .manager.editing .files { float: left; width: 280px; }
    15. 

  15. 

  16. .sidebar-button {
    17. 

  17. 	display: inline-block; padding: 25px 19px; text-decoration: none; position: absolute;
    18. 

  18. 	border-right: 1px solid #EEE; line-height: 10px; color: #7801F5; transition: all 0.3s
    19. 

  19. }
    20. 

  20. .sidebar-button:active { background-color: #f5e7ff; transition: none }
    21. 

  21. /*.sidebar-button:hover { background-color: #fbf5ff; }*/
    22. 

  22. .sidebar-button span { transition: 1s all; transform-origin: 2.5px 7px; display: inline-block; }
    23. 

  23. .manager.sidebar_closed .sidebar-button span { transform: rotateZ(180deg); }
    24. 

  24. .manager.sidebar_closed .files { margin-left: -300px; }
    25. 

  25. .manager.sidebar_closed .editor { width: 100%; }
    26. 

  26. 

  27. .button {
    28. 

  28. 	padding: 5px 10px; margin-left: 10px; background-color: #752ff2; border-bottom: 2px solid #caadff; background-position: -50px center;
    29. 

  29. 	border-radius: 2px; text-decoration: none; transition: all 0.5s ease-out; display: inline-block;
    30. 

  30. 	color: #333; font-size: 12px; vertical-align: 2px; text-transform: uppercase; color: white; max-width: 100px;
    31. 

  31. }
    32. 

  32. .button:hover { background-color: #9e71ed; transition: none; }
    33. 

  33. .button:active { position: relative; top: 1px }
    34. 

  34. .button.loading, .button.disabled { color: rgba(255,255,255,0.7);; pointer-events: none; border-bottom: 2px solid #666; background-color: #999; }
    35. 

  35. .button.loading { background: #999 url(../img/loading.gif) no-repeat center center; transition: all 0.5s ease-out; color: rgba(0,0,0,0); }
    36. 

  36. .button.done { background-color: #4dc758; transition: all 0.3s; border-color: #4dc758; pointer-events: none; }
    37. 

  37. .button.hidden { max-width: 0px; display: inline-block; padding-left: 0px; padding-right: 0px; margin: 0px; }
    38. 

  38. 

  39. /* List */
    40. 

  40. 

  41. .files {
    42. 

  42. 	width: 97%; box-sizing: border-box; color: #555; position: relative; z-index: 1; transition: all 0.6s;
    43. 

  43. 	font-size: 14px; box-shadow: 0px 9px 20px -15px #a5cbec; max-width: 400px; border: 1px solid #EEEEF5;
    44. 

  44. }
    45. 

  45. .files .tr { white-space: nowrap }
    46. 

  46. .files .td { display: inline-block; width: 60px }
    47. 

  47. .files .tbody .td { line-height: 18px; vertical-align: bottom; }
    48. 

  48. .files .td.name { min-width: 100px }
    49. 

  49. .files .td.size { width: 60px; text-align: right; padding-left: 5px; }
    50. 

  50. .files .td.status { text-align: right; }
    51. 

  51. .files .td.peer { width: 60px }
    52. 

  52. .files .td.uploaded { width: 130px; text-align: right; }
    53. 

  53. .files .td.added { width: 90px }
    54. 

  54. .files .orderby { color: inherit; text-decoration: none; transition: all 0.3s; outline: 5px solid transparent; }
    55. 

  55. .files .orderby:hover { text-decoration: underline; }
    56. 

  56. .files .orderby .icon-arrow-down { opacity: 0; transition: all 0.3s ease-in-out; }
    57. 

  57. .files .orderby.selected .icon-arrow-down { opacity: 0.3; }
    58. 

  58. .files .orderby:active { background-color: rgba(133, 239, 255, 0.09); outline: 5px solid rgba(133, 239, 255, 0.09); transition: none; }
    59. 

  59. .files .orderby:hover .icon-arrow-down { opacity: 0.5; }
    60. 

  60. .files .orderby:not(.desc) .icon-arrow-down { transform: rotateZ(180deg); }
    61. 

  61. .files .tr.editing .td { background-color: #ede1f582; border-top-color: #ece9ef; }
    62. 

  62. .files .thead { /*background: linear-gradient(358deg, #e7f1f7, #e9f2f72e);*/ }
    63. 

  63. .files .thead .td {
    64. 

  64. 	border-top: none; color: #8984c2; background-color: #f7f7fc;
    65. 

  65. 	font-size: 12px; /*text-transform: uppercase; background-color: transparent; font-weight: bold;*/
    66. 

  66. }
    67. 

  67. .files .thead .td a:last-of-type { font-weight: bold; }
    68. 

  68. .files .thead .td a { text-decoration: none; }
    69. 

  69. .files .thead .td a:hover { text-decoration: underline; }
    70. 

  70. .files .tbody { max-height: calc(100vh - 95px); overflow-y: auto; overflow-x: hidden; }
    71. 

  71. .files .tr { background-color: white; }
    72. 

  72. .files .td { padding: 10px 20px; border-top: 1px solid #EEE; font-size: 13px; white-space: nowrap; }
    73. 

  73. .files .td.full { width: 100%; box-sizing: border-box;  white-space: pre-line; }
    74. 

  74. .files .td.pre { width: 0px; color: transparent; padding-left: 0px; border-left: 2px solid transparent; }
    75. 

  75. .files .tbody .td { height: 18px; }
    76. 

  76. .files .tbody .td.full { height: auto; }
    77. 

  77. .files .td.pre .checkbox-outer { opacity: 0.6; margin-left: -11px; margin-top: -15px; width: 18px; height: 12px; display: inline-block; }
    78. 

  78. .files .tr.modified .td.pre { border-left-color: #7801F5 }
    79. 

  79. .files .tr.added .td.pre { border-left-color: #00ec93 }
    80. 

  80. .files .tr.ignored .td.pre { border-left-color: #999; }
    81. 

  81. .files .tr.ignored { opacity: 0.5; }
    82. 

  82. .files .tr.optional { background: linear-gradient(90deg, #fff6dd, 30%, white, 10%, white); }
    83. 

  83. .files .tr.optional_empty { color: #999; font-style: italic; }
    84. 

  84. .files .td.error { background-color: #F44336; color: white; }
    85. 

  85. .files .td.site { width: 70px }
    86. 

  86. .files .td.site .link { color: inherit; text-decoration: none }
    87. 

  87. .files .td.status .percent {
    88. 

  88. 	transition: all 1s ease-in-out; display: inline-block; width: 80px; background-color: #EEE; font-size: 10px;
    89. 

  89. 	height: 15px; line-height: 15px; text-align: center; margin-right: 20px;
    90. 

  90. }
    91. 

  91. .files .td.name { padding-left: 10px; width: calc(100% - 167px); max-height: 18px; padding-right: 10px; }
    92. 

  92. .files .tr.nobuttons .td.name { width: calc(100% - 127px); }
    93. 

  93. .files .tr.nobuttons .td.buttons { width: 0px; }
    94. 

  94. .files .td.name .title { color: inherit; text-decoration: none }
    95. 

  95. .files .td.name .link { display: inline-block; overflow: hidden; text-overflow: ellipsis; vertical-align: -4px; max-width: 100%; }
    96. 

  96. .files .pinned .td.name .link { max-width: calc(100% - 40px); }
    97. 

  97. .files .thead .td.uploaded { text-align: left }
    98. 

  98. .files .thead .td.uploaded .title { padding-left: 7px; }
    99. 

  99. .files .peer .icon-profile { background: currentColor; color: #47d094; font-size: 10px; top: 1px; margin-right: 13px }
    100. 

  100. .files .peer .icon-profile:before { background: currentColor }
    101. 

  101. .files .peer .num { color: #969696; }
    102. 

  102. .files .uploaded .uploaded-text { display: inline-block; text-align: right; }
    103. 

  103. .files .uploaded .dots-container { display: inline-block; width: 0px; padding-right: 65px;; }
    104. 

  104. .files .td.buttons { width: 40px; padding-left: 0px; padding-right: 0px; }
    105. 

  105. .files .td.buttons .edit {
    106. 

  106. 	background-color: #2196f336; border-radius: 15px; padding: 1px 9px; font-size: 80%; text-decoration: none; color: #1976D2;
    107. 

  107. }
    108. 

  108. .files .checkbox-outer { padding: 15px; padding-left: 20px; padding-right: 0px; }
    109. 

  109. .files .checkbox {
    110. 

  110. 	display: inline-block; width: 12px; height: 12px; border: 2px solid #00000014;
    111. 

  111. 	border-radius: 3px; vertical-align: -3px; margin-right: 10px;
    112. 

  112. }
    113. 

  113. .files .selected .checkbox { border-color: #dedede }
    114. 

  114. .files .selected .checkbox:after {
    115. 

  115. 	background-color: #dedede; content: ""; text-decoration: none; display: block; width: 10px; height: 10px; margin-left: 1px; margin-top: 1px;
    116. 

  116. }
    117. 

  117. .files .tbody .td.size { font-size: 13px }
    118. 

  118. .files .tbody .td.added, #PageFiles .files .td.access { font-size: 12px; color: #999 }
    119. 

  119. .files .tr.type-dir .name { font-weight: bold; }
    120. 

  120. .files .tr.type-parent .name .link { display: inline-block; width: 100%; padding: 5px; margin-top: -5px; }
    121. 

  121. .files .foot .td { color: #a4a4a4; background-color: #f7f7fc; }
    122. 

  122. .files .foot .create { float: right; text-decoration: none; position: relative; }
    123. 

  123. .files .foot .create .link { color: #8c42ed; text-decoration: none; }
    124. 

  124. .files .foot .create .link:active { background-color: #8c42ed3b; outline: 5px solid #8c42ed3b; }
    125. 

  125. .files .foot .create .menu { top: 40px; }
    126. 

  126. 

  127. 

  128. /* Editor */
    129. 

  129. 

  130. .editor { background-color: #F7F7FC; float: left; width: calc(100% - 280px); box-sizing: border-box; transition: all 0.6s; }
    131. 

  131. .editor .CodeMirror { height: calc(100vh - 79px); visibility: hidden; }
    132. 

  132. .editor textarea { width: 100%; height: 800px; white-space: pre; }
    133. 

  133. .editor .title { margin-left: 20px; }
    134. 

  134. .editor .editor-head {
    135. 

  135. 	padding: 15px 20px; padding-left: 45px; font-size: 18px; font-weight: lighter; border: 1px solid #EEEEF5;
    136. 

  136.     white-space: nowrap; overflow: hidden;
    137. 

  137. }
    138. 

  138. .editor.loaded .CodeMirror { visibility: inherit; }
    139. 

  139. .editor.error .CodeMirror { display: none; }
    140. 

  140. .editor .button.save { min-width: 30px; text-align: center; transition: all 0.3s; }
    141. 

  141. .editor .button.save.done { min-width: 80px; }
    142. 

  142. .editor .error-message { text-align: center; padding: 50px; }
    143. 

  143. 

  144. .editor .CodeMirror-foldmarker {
    145. 

  145. 	line-height: .3; cursor: pointer; background-color: #ffeb3b61; text-shadow: none; font-family: inherit;
    146. 

  146. 	color: #050505; border: 1px solid #ffdf7f; padding: 0px 5px;
    147. 

  147. }
    148. 

  148. .editor .CodeMirror-activeline-background { background-color: #F6F6F6 !important; }
    149.