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.

344 lines
6.0 KiB

1 year ago
  1. /**
  2. * All of the CSS for your admin-specific functionality should be
  3. * included in this file.
  4. */
  5. .mtdi-demo-themes.wp-clearfix {
  6. clear: both;
  7. }
  8. .theme-browser .mtdi-each-demo {
  9. cursor: pointer;
  10. float: left;
  11. margin: 0 2% 3% 0;
  12. position: relative;
  13. width: 30.6%;
  14. border: 1px solid #ddd;
  15. box-shadow: 0 1px 1px -1px rgba(0, 0, 0, .1);
  16. box-sizing: border-box;
  17. }
  18. .theme-browser .mtdi-each-demo .mtdi-preview-screenshot {
  19. display: block;
  20. overflow: hidden;
  21. position: relative;
  22. -webkit-backface-visibility: hidden;
  23. transition: opacity .2s ease-in-out;
  24. }
  25. .mtdi-gl-header {
  26. display: inline-block;
  27. width: calc(100% - 40px);
  28. background-color: #ffffff;
  29. margin-bottom: 20px;
  30. padding: 0 20px;
  31. }
  32. .mtdi_gl-navigation {
  33. font-size: 13px;
  34. width: 100%;
  35. float: left;
  36. }
  37. @media (min-width:640px) {
  38. .mtdi_gl-navigation {
  39. width: calc(100% - 180px);
  40. }
  41. .mtdi_gl-navigation li {
  42. margin: 0;
  43. }
  44. .mtdi_gl-navigation li a {
  45. padding: 15px;
  46. }
  47. .mtdi_gl-search-input {
  48. display: inline-block;
  49. width: 180px;
  50. height: 30px;
  51. margin: 0;
  52. margin-top: 11px;
  53. }
  54. }
  55. .mtdi_gl-navigation ul {
  56. list-style-type: none;
  57. margin: 0;
  58. padding: 0;
  59. overflow: hidden;
  60. list-style: none;
  61. }
  62. .mtdi_gl-navigation li {
  63. float: left;
  64. margin: 0 15px;
  65. }
  66. .mtdi_gl-navigation li a {
  67. display: block;
  68. text-align: center;
  69. text-decoration: none;
  70. color: #444444;
  71. border-bottom: 4px solid #ffffff;
  72. padding: 15px 0;
  73. box-shadow: none;
  74. }
  75. .mtdi_gl-navigation li.active a, .mtdi_gl-navigation li.active a:hover {
  76. border-bottom: 4px solid #666666;
  77. }
  78. .mtdi_gl-item {
  79. float: left;
  80. width: 100%;
  81. margin: 0 0 20px 0;
  82. position: relative;
  83. border: 1px solid #ddd;
  84. -webkit-box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
  85. box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
  86. -webkit-box-sizing: border-box;
  87. -moz-box-sizing: border-box;
  88. box-sizing: border-box;
  89. }
  90. .mtdi_gl-item-image-container {
  91. display: block;
  92. overflow: hidden;
  93. position: relative;
  94. -webkit-backface-visibility: hidden;
  95. -webkit-transition: opacity 0.2s ease-in-out;
  96. transition: opacity 0.2s ease-in-out;
  97. }
  98. .mtdi_gl-item-image {
  99. width: 100%;
  100. -webkit-transition: opacity 0.2s ease-in-out;
  101. transition: opacity 0.2s ease-in-out;
  102. margin: 0;
  103. width: 100%;
  104. height: auto;
  105. vertical-align: middle;
  106. }
  107. @media (min-width:1120px) {
  108. .mtdi_gl-item-container {
  109. margin-right: -30px;
  110. }
  111. .mtdi_gl-item {
  112. width: calc(33.333% - 30px);
  113. margin: 0 30px 30px 0;
  114. }
  115. }
  116. .theme-wrap1 {
  117. clear: both;
  118. position: fixed;
  119. top: 9%;
  120. left: 104px;
  121. right: 29px;
  122. bottom: 3%;
  123. background: #fff;
  124. box-shadow: 0 1px 20px 5px rgba(0, 0, 0, .1);
  125. z-index: 10000;
  126. box-sizing: border-box;
  127. }
  128. .theme-overlay .theme-screenshots {
  129. float: left;
  130. margin: 0 30px 0 0;
  131. width: 55%;
  132. max-width: 1200px;
  133. text-align: center;
  134. }
  135. .theme-info1 {
  136. clear: both;
  137. float: left;
  138. margin: 0;
  139. width: 28%;
  140. max-width: 1200px;
  141. text-align: center;
  142. }
  143. .theme-screenshots1 {
  144. width: 72%;
  145. float: left;
  146. }
  147. .theme-screenshots1 iframe {
  148. width: 100%;
  149. height: 546px;
  150. }
  151. .theme-overlay .theme-screenshots1 .screenshot {
  152. text-align: center;
  153. background-color: #191e23;
  154. border: 1px solid #fff;
  155. box-sizing: border-box;
  156. overflow: hidden;
  157. position: relative;
  158. box-shadow: none !important;
  159. height: 592px;
  160. }
  161. .mtdi-demo-popup-close {
  162. position: absolute;
  163. right: -8px;
  164. top: -7px;
  165. background: skyblue;
  166. color: #ffffff;
  167. border-radius: 66px;
  168. padding: 5px;
  169. text-decoration: none;
  170. cursor: pointer;
  171. }
  172. .theme-wrap1 .theme-footer {
  173. position: absolute;
  174. right: 0;
  175. left: 0;
  176. bottom: 0;
  177. z-index: 999;
  178. background: #eee;
  179. }
  180. .mtdi-leftsidewrap {
  181. text-align: left;
  182. margin-left: 20px;
  183. }
  184. .mtdi-plugin-req-wrapper {
  185. margin-right: 14px;
  186. background: #f5f5f5;
  187. padding: 1px;
  188. margin-bottom: 12px;
  189. }
  190. .mtdi-plugin-req-wrapper ul {
  191. padding: 14px;
  192. padding-top: 0;
  193. padding-bottom: 0;
  194. }
  195. iframe#demoiframe {
  196. display: none;
  197. }
  198. #loadingMessage {
  199. width: 38%;
  200. margin-left: 348px;
  201. margin-top: 122px;
  202. }
  203. a.button.instalplugin.alignright {
  204. pointer-events: none;
  205. }
  206. .mtdi-demo-import-step.button-primary.updating-message:before {
  207. margin-top: 12px;
  208. }
  209. .mtdi-plugin-req-wrapper {
  210. height: 240px;
  211. overflow: scroll;
  212. overflow-x: hidden;
  213. }
  214. .mtdi-demo-import-step.button-primary.updating-message::before, .mtdi-install-setup.button-primary.updating-message::before {
  215. margin-top: 12px;
  216. }
  217. .demo-import-actions {
  218. margin-top: 20px;
  219. }
  220. .demo-import-actions .plugin-action-note {
  221. background: rgba(0, 142, 194, 0.1);
  222. padding: 10px;
  223. margin: 15px;
  224. border: 1px solid #008EC2;
  225. border-radius: 3px;
  226. }
  227. .mtdi-popup-wrapper .theme-about1 {
  228. height: 100%;
  229. }
  230. .mtdi-popup-wrapper .theme-info1 {
  231. height: 100%;
  232. overflow: scroll;
  233. }
  234. .demo-import-actions .plugin-action-note {
  235. background: rgba(0, 142, 194, 0.1);
  236. padding: 10px;
  237. margin: 15px;
  238. margin-bottom: 40px;
  239. border: 1px solid #008EC2;
  240. border-radius: 3px;
  241. }
  242. #demo-import-success-note-wrapper {
  243. position: fixed;
  244. top: 50%;
  245. left: 50%;
  246. background: #fff;
  247. padding: 80px 30px 30px;
  248. transform: translate(-50%, -50%);
  249. box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
  250. border-radius: 5px;
  251. }
  252. .mtdi-note-header {
  253. font-weight: 700;
  254. margin: 10px 0 -10px;
  255. text-align: center;
  256. font-size: 26px;
  257. text-transform: uppercase;
  258. }
  259. .mtdi-note-content {
  260. font-size: 14px;
  261. text-align: center;
  262. border: 1px solid #e1e1e1;
  263. padding: 20px;
  264. line-height: 1.8;
  265. font-weight: 600;
  266. background: #fbfbfb;
  267. margin: 40px 0 30px;
  268. }
  269. .mtdi-note-footer {
  270. text-align: center;
  271. }
  272. .mtdi-note-footer .button .dashicons {
  273. margin: 11px 0 0 5px;
  274. }
  275. .mtdi-note-close {
  276. display: inline-block;
  277. width: auto;
  278. background: #007CBA;
  279. color: #fff;
  280. font-size: 16px;
  281. padding: 8px 15px;
  282. border-radius: 5px;
  283. cursor: pointer;
  284. position: absolute;
  285. right: 30px;
  286. top: 30px;
  287. }
  288. .mtdi-note-close::before {
  289. margin-right: 5px;
  290. display: inline-block;
  291. position: relative;
  292. top: 2px;
  293. }
  294. .theme-info1>.description {
  295. padding: 0px 15px;
  296. }