sergio.hinojosa
/
eval-desempeno-v2
1
0
Förgrening 0
Kod Ärenden 0 Pull-förfrågningar 0 Släpp 0 Wiki Aktiviteter
Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.
7 Incheckningar
3 Grenar
14MB
Gren: master
Grenar Taggar
${ item.name }
Skapa branchen ${ searchTerm }
från 'master'
${ noResults }
eval-desempeno-v2/public/plugins/dropzone/dropzone.css

468 lines
12KB
Rå Permalänk Blame Historik 

  1. @-webkit-keyframes passing-through {

  2.   0% {

  3.     opacity: 0;

  4.     -webkit-transform: translateY(40px);

  5.     -moz-transform: translateY(40px);

  6.     -ms-transform: translateY(40px);

  7.     -o-transform: translateY(40px);

  8.     transform: translateY(40px);

  9.   }

  10.   30%, 70% {

  11.     opacity: 1;

  12.     -webkit-transform: translateY(0px);

  13.     -moz-transform: translateY(0px);

  14.     -ms-transform: translateY(0px);

  15.     -o-transform: translateY(0px);

  16.     transform: translateY(0px);

  17.   }

  18.   100% {

  19.     opacity: 0;

  20.     -webkit-transform: translateY(-40px);

  21.     -moz-transform: translateY(-40px);

  22.     -ms-transform: translateY(-40px);

  23.     -o-transform: translateY(-40px);

  24.     transform: translateY(-40px);

  25.   }

  26. }

  27. @-moz-keyframes passing-through {

  28.   0% {

  29.     opacity: 0;

  30.     -webkit-transform: translateY(40px);

  31.     -moz-transform: translateY(40px);

  32.     -ms-transform: translateY(40px);

  33.     -o-transform: translateY(40px);

  34.     transform: translateY(40px);

  35.   }

  36.   30%, 70% {

  37.     opacity: 1;

  38.     -webkit-transform: translateY(0px);

  39.     -moz-transform: translateY(0px);

  40.     -ms-transform: translateY(0px);

  41.     -o-transform: translateY(0px);

  42.     transform: translateY(0px);

  43.   }

  44.   100% {

  45.     opacity: 0;

  46.     -webkit-transform: translateY(-40px);

  47.     -moz-transform: translateY(-40px);

  48.     -ms-transform: translateY(-40px);

  49.     -o-transform: translateY(-40px);

  50.     transform: translateY(-40px);

  51.   }

  52. }

  53. @keyframes passing-through {

  54.   0% {

  55.     opacity: 0;

  56.     -webkit-transform: translateY(40px);

  57.     -moz-transform: translateY(40px);

  58.     -ms-transform: translateY(40px);

  59.     -o-transform: translateY(40px);

  60.     transform: translateY(40px);

  61.   }

  62.   30%, 70% {

  63.     opacity: 1;

  64.     -webkit-transform: translateY(0px);

  65.     -moz-transform: translateY(0px);

  66.     -ms-transform: translateY(0px);

  67.     -o-transform: translateY(0px);

  68.     transform: translateY(0px);

  69.   }

  70.   100% {

  71.     opacity: 0;

  72.     -webkit-transform: translateY(-40px);

  73.     -moz-transform: translateY(-40px);

  74.     -ms-transform: translateY(-40px);

  75.     -o-transform: translateY(-40px);

  76.     transform: translateY(-40px);

  77.   }

  78. }

  79. @-webkit-keyframes slide-in {

  80.   0% {

  81.     opacity: 0;

  82.     -webkit-transform: translateY(40px);

  83.     -moz-transform: translateY(40px);

  84.     -ms-transform: translateY(40px);

  85.     -o-transform: translateY(40px);

  86.     transform: translateY(40px);

  87.   }

  88.   30% {

  89.     opacity: 1;

  90.     -webkit-transform: translateY(0px);

  91.     -moz-transform: translateY(0px);

  92.     -ms-transform: translateY(0px);

  93.     -o-transform: translateY(0px);

  94.     transform: translateY(0px);

  95.   }

  96. }

  97. @-moz-keyframes slide-in {

  98.   0% {

  99.     opacity: 0;

  100.     -webkit-transform: translateY(40px);

  101.     -moz-transform: translateY(40px);

  102.     -ms-transform: translateY(40px);

  103.     -o-transform: translateY(40px);

  104.     transform: translateY(40px);

  105.   }

  106.   30% {

  107.     opacity: 1;

  108.     -webkit-transform: translateY(0px);

  109.     -moz-transform: translateY(0px);

  110.     -ms-transform: translateY(0px);

  111.     -o-transform: translateY(0px);

  112.     transform: translateY(0px);

  113.   }

  114. }

  115. @keyframes slide-in {

  116.   0% {

  117.     opacity: 0;

  118.     -webkit-transform: translateY(40px);

  119.     -moz-transform: translateY(40px);

  120.     -ms-transform: translateY(40px);

  121.     -o-transform: translateY(40px);

  122.     transform: translateY(40px);

  123.   }

  124.   30% {

  125.     opacity: 1;

  126.     -webkit-transform: translateY(0px);

  127.     -moz-transform: translateY(0px);

  128.     -ms-transform: translateY(0px);

  129.     -o-transform: translateY(0px);

  130.     transform: translateY(0px);

  131.   }

  132. }

  133. @-webkit-keyframes pulse {

  134.   0% {

  135.     -webkit-transform: scale(1);

  136.     -moz-transform: scale(1);

  137.     -ms-transform: scale(1);

  138.     -o-transform: scale(1);

  139.     transform: scale(1);

  140.   }

  141.   10% {

  142.     -webkit-transform: scale(1.1);

  143.     -moz-transform: scale(1.1);

  144.     -ms-transform: scale(1.1);

  145.     -o-transform: scale(1.1);

  146.     transform: scale(1.1);

  147.   }

  148.   20% {

  149.     -webkit-transform: scale(1);

  150.     -moz-transform: scale(1);

  151.     -ms-transform: scale(1);

  152.     -o-transform: scale(1);

  153.     transform: scale(1);

  154.   }

  155. }

  156. @-moz-keyframes pulse {

  157.   0% {

  158.     -webkit-transform: scale(1);

  159.     -moz-transform: scale(1);

  160.     -ms-transform: scale(1);

  161.     -o-transform: scale(1);

  162.     transform: scale(1);

  163.   }

  164.   10% {

  165.     -webkit-transform: scale(1.1);

  166.     -moz-transform: scale(1.1);

  167.     -ms-transform: scale(1.1);

  168.     -o-transform: scale(1.1);

  169.     transform: scale(1.1);

  170.   }

  171.   20% {

  172.     -webkit-transform: scale(1);

  173.     -moz-transform: scale(1);

  174.     -ms-transform: scale(1);

  175.     -o-transform: scale(1);

  176.     transform: scale(1);

  177.   }

  178. }

  179. @keyframes pulse {

  180.   0% {

  181.     -webkit-transform: scale(1);

  182.     -moz-transform: scale(1);

  183.     -ms-transform: scale(1);

  184.     -o-transform: scale(1);

  185.     transform: scale(1);

  186.   }

  187.   10% {

  188.     -webkit-transform: scale(1.1);

  189.     -moz-transform: scale(1.1);

  190.     -ms-transform: scale(1.1);

  191.     -o-transform: scale(1.1);

  192.     transform: scale(1.1);

  193.   }

  194.   20% {

  195.     -webkit-transform: scale(1);

  196.     -moz-transform: scale(1);

  197.     -ms-transform: scale(1);

  198.     -o-transform: scale(1);

  199.     transform: scale(1);

  200.   }

  201. }

  202. .dropzone, .dropzone * {

  203.   box-sizing: border-box;

  204. }

  205. 

  206. .dropzone {

  207.   min-height: 150px;

  208.   border: 2px solid rgba(0, 0, 0, 0.3);

  209.   background: white;

  210.   padding: 20px 20px;

  211. }

  212. .dropzone.dz-clickable {

  213.   cursor: pointer;

  214. }

  215. .dropzone.dz-clickable * {

  216.   cursor: default;

  217. }

  218. .dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {

  219.   cursor: pointer;

  220. }

  221. .dropzone.dz-started .dz-message {

  222.   display: none;

  223. }

  224. .dropzone.dz-drag-hover {

  225.   border-style: solid;

  226. }

  227. .dropzone.dz-drag-hover .dz-message {

  228.   opacity: 0.5;

  229. }

  230. .dropzone .dz-message {

  231.   text-align: center;

  232.   margin: 2em 0;

  233. }

  234. .dropzone .dz-message .dz-button {

  235.   background: none;

  236.   color: inherit;

  237.   border: none;

  238.   padding: 0;

  239.   font: inherit;

  240.   cursor: pointer;

  241.   outline: inherit;

  242. }

  243. .dropzone .dz-preview {

  244.   position: relative;

  245.   display: inline-block;

  246.   vertical-align: top;

  247.   margin: 16px;

  248.   min-height: 100px;

  249. }

  250. .dropzone .dz-preview:hover {

  251.   z-index: 1000;

  252. }

  253. .dropzone .dz-preview:hover .dz-details {

  254.   opacity: 1;

  255. }

  256. .dropzone .dz-preview.dz-file-preview .dz-image {

  257.   border-radius: 20px;

  258.   background: #999;

  259.   background: linear-gradient(to bottom, #eee, #ddd);

  260. }

  261. .dropzone .dz-preview.dz-file-preview .dz-details {

  262.   opacity: 1;

  263. }

  264. .dropzone .dz-preview.dz-image-preview {

  265.   background: white;

  266. }

  267. .dropzone .dz-preview.dz-image-preview .dz-details {

  268.   -webkit-transition: opacity 0.2s linear;

  269.   -moz-transition: opacity 0.2s linear;

  270.   -ms-transition: opacity 0.2s linear;

  271.   -o-transition: opacity 0.2s linear;

  272.   transition: opacity 0.2s linear;

  273. }

  274. .dropzone .dz-preview .dz-remove {

  275.   font-size: 14px;

  276.   text-align: center;

  277.   display: block;

  278.   cursor: pointer;

  279.   border: none;

  280. }

  281. .dropzone .dz-preview .dz-remove:hover {

  282.   text-decoration: underline;

  283. }

  284. .dropzone .dz-preview:hover .dz-details {

  285.   opacity: 1;

  286. }

  287. .dropzone .dz-preview .dz-details {

  288.   z-index: 20;

  289.   position: absolute;

  290.   top: 0;

  291.   left: 0;

  292.   opacity: 0;

  293.   font-size: 13px;

  294.   min-width: 100%;

  295.   max-width: 100%;

  296.   padding: 2em 1em;

  297.   text-align: center;

  298.   color: rgba(0, 0, 0, 0.9);

  299.   line-height: 150%;

  300. }

  301. .dropzone .dz-preview .dz-details .dz-size {

  302.   margin-bottom: 1em;

  303.   font-size: 16px;

  304. }

  305. .dropzone .dz-preview .dz-details .dz-filename {

  306.   white-space: nowrap;

  307. }

  308. .dropzone .dz-preview .dz-details .dz-filename:hover span {

  309.   border: 1px solid rgba(200, 200, 200, 0.8);

  310.   background-color: rgba(255, 255, 255, 0.8);

  311. }

  312. .dropzone .dz-preview .dz-details .dz-filename:not(:hover) {

  313.   overflow: hidden;

  314.   text-overflow: ellipsis;

  315. }

  316. .dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {

  317.   border: 1px solid transparent;

  318. }

  319. .dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {

  320.   background-color: rgba(255, 255, 255, 0.4);

  321.   padding: 0 0.4em;

  322.   border-radius: 3px;

  323. }

  324. .dropzone .dz-preview:hover .dz-image img {

  325.   -webkit-transform: scale(1.05, 1.05);

  326.   -moz-transform: scale(1.05, 1.05);

  327.   -ms-transform: scale(1.05, 1.05);

  328.   -o-transform: scale(1.05, 1.05);

  329.   transform: scale(1.05, 1.05);

  330.   -webkit-filter: blur(8px);

  331.   filter: blur(8px);

  332. }

  333. .dropzone .dz-preview .dz-image {

  334.   border-radius: 20px;

  335.   overflow: hidden;

  336.   width: 120px;

  337.   height: 120px;

  338.   position: relative;

  339.   display: block;

  340.   z-index: 10;

  341. }

  342. .dropzone .dz-preview .dz-image img {

  343.   display: block;

  344. }

  345. .dropzone .dz-preview.dz-success .dz-success-mark {

  346.   -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);

  347.   -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);

  348.   -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);

  349.   -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);

  350.   animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);

  351. }

  352. .dropzone .dz-preview.dz-error .dz-error-mark {

  353.   opacity: 1;

  354.   -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);

  355.   -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);

  356.   -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);

  357.   -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);

  358.   animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);

  359. }

  360. .dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {

  361.   pointer-events: none;

  362.   opacity: 0;

  363.   z-index: 500;

  364.   position: absolute;

  365.   display: block;

  366.   top: 50%;

  367.   left: 50%;

  368.   margin-left: -27px;

  369.   margin-top: -27px;

  370. }

  371. .dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {

  372.   display: block;

  373.   width: 54px;

  374.   height: 54px;

  375. }

  376. .dropzone .dz-preview.dz-processing .dz-progress {

  377.   opacity: 1;

  378.   -webkit-transition: all 0.2s linear;

  379.   -moz-transition: all 0.2s linear;

  380.   -ms-transition: all 0.2s linear;

  381.   -o-transition: all 0.2s linear;

  382.   transition: all 0.2s linear;

  383. }

  384. .dropzone .dz-preview.dz-complete .dz-progress {

  385.   opacity: 0;

  386.   -webkit-transition: opacity 0.4s ease-in;

  387.   -moz-transition: opacity 0.4s ease-in;

  388.   -ms-transition: opacity 0.4s ease-in;

  389.   -o-transition: opacity 0.4s ease-in;

  390.   transition: opacity 0.4s ease-in;

  391. }

  392. .dropzone .dz-preview:not(.dz-processing) .dz-progress {

  393.   -webkit-animation: pulse 6s ease infinite;

  394.   -moz-animation: pulse 6s ease infinite;

  395.   -ms-animation: pulse 6s ease infinite;

  396.   -o-animation: pulse 6s ease infinite;

  397.   animation: pulse 6s ease infinite;

  398. }

  399. .dropzone .dz-preview .dz-progress {

  400.   opacity: 1;

  401.   z-index: 1000;

  402.   pointer-events: none;

  403.   position: absolute;

  404.   height: 16px;

  405.   left: 50%;

  406.   top: 50%;

  407.   margin-top: -8px;

  408.   width: 80px;

  409.   margin-left: -40px;

  410.   background: rgba(255, 255, 255, 0.9);

  411.   -webkit-transform: scale(1);

  412.   border-radius: 8px;

  413.   overflow: hidden;

  414. }

  415. .dropzone .dz-preview .dz-progress .dz-upload {

  416.   background: #333;

  417.   background: linear-gradient(to bottom, #666, #444);

  418.   position: absolute;

  419.   top: 0;

  420.   left: 0;

  421.   bottom: 0;

  422.   width: 0;

  423.   -webkit-transition: width 300ms ease-in-out;

  424.   -moz-transition: width 300ms ease-in-out;

  425.   -ms-transition: width 300ms ease-in-out;

  426.   -o-transition: width 300ms ease-in-out;

  427.   transition: width 300ms ease-in-out;

  428. }

  429. .dropzone .dz-preview.dz-error .dz-error-message {

  430.   display: block;

  431. }

  432. .dropzone .dz-preview.dz-error:hover .dz-error-message {

  433.   opacity: 1;

  434.   pointer-events: auto;

  435. }

  436. .dropzone .dz-preview .dz-error-message {

  437.   pointer-events: none;

  438.   z-index: 1000;

  439.   position: absolute;

  440.   display: block;

  441.   display: none;

  442.   opacity: 0;

  443.   -webkit-transition: opacity 0.3s ease;

  444.   -moz-transition: opacity 0.3s ease;

  445.   -ms-transition: opacity 0.3s ease;

  446.   -o-transition: opacity 0.3s ease;

  447.   transition: opacity 0.3s ease;

  448.   border-radius: 8px;

  449.   font-size: 13px;

  450.   top: 130px;

  451.   left: -10px;

  452.   width: 140px;

  453.   background: #be2626;

  454.   background: linear-gradient(to bottom, #be2626, #a92222);

  455.   padding: 0.5em 1.2em;

  456.   color: white;

  457. }

  458. .dropzone .dz-preview .dz-error-message:after {

  459.   content: "";

  460.   position: absolute;

  461.   top: -6px;

  462.   left: 64px;

  463.   width: 0;

  464.   height: 0;

  465.   border-left: 6px solid transparent;

  466.   border-right: 6px solid transparent;

  467.   border-bottom: 6px solid #be2626;

  468. }