Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Separate files and nicer JavaScript

  • Loading branch information...
commit 66ea8ee9f5db0f654f4a4a75df17864889f2dfce 1 parent 57a19d8
@Calvein authored
Showing with 48 additions and 994 deletions.
  1. +47 −553 index.html
  2. +0 −439 normalize.css
  3. +1 −2  upload.php
View
600 index.html
@@ -1,560 +1,54 @@
-<!doctype html>
-<html>
-<head>
-<meta charset="utf-8">
-<title>Simple uploader - by Calvein</title>
-<link href="normalize.css" rel="stylesheet">
-<link href="http://fonts.googleapis.com/css?family=Pacifico&text='Simple uploader'" rel="stylesheet">
-<style>
- /* Useless stuff */
- body {
- margin: 0 auto;
- text-align: center;
- background: url('fabric_1.png');
- }
-
- a { color: #00e; }
- a:visited { color: #551a8b; }
- a:hover { color: #06e; }
-
- h1 {
- margin: 0;
- font: 48px 'Pacifico', Comic sans, cursive;
- font-weight: normal;
- color: #333;
- text-shadow: 0 -1px 1px rgba(100, 100, 100, .7);
- }
-
- h2 {
- font: 16px Georgia;
- color: #222;
- }
-
- form {
- width: 150px;
- margin: 30px auto;
- text-align: left;
- }
-
- p {
- font: 14px Georgia;
- color: #222;
- }
-
- hr {
- margin: 20px 150px 10px;
- border-width: 1px 0;
- border-style: solid;
- border-top-color: #888;
- border-bottom-color: #ccc;
- }
-
- footer {
- font-style: italic;
- font-size: 12px;
- line-height: 16px;
- color: #222;
- }
-
- footer img, footer a {
- vertical-align: text-bottom;
- }
-
- footer a:nth-of-type(1) {
- color: #c5376d;
- }
-
- footer a:nth-of-type(2) {
- color: #000;
- }
-
- footer iframe {
- width: 120px !important;
- vertical-align: bottom;
- }
-
- /* Usefull stuff */
- #uploader {
- display: inline-block;
- position: relative;
- width: 150px;
- height: 32px;
- background-image: -webkit-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 87%) 100%);
- background-image: -moz-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 87%) 100%);
- background-image: -ms-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 87%) 100%);
- background-image: -o-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 87%) 100%);
- background-image: linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 87%) 100%);
- box-shadow: inset 0 1px rgba(255, 255, 255, .4),
- 0 1px 3px rgba(0, 0, 0, .25);
- border: 1px solid #d7d7d7;
- border-radius: 4px;
- -webkit-transition: .05s, width .5s;
- -moz-transition: .05s, width .5s;
- -ms-transition: .05s, width .5s;
- -o-transition: .05s, width .5s;
- transition: .05s, width .5s;
- }
-
- #uploader:hover, #uploader.over {
- background-image: -webkit-linear-gradient(top, hsl(0, 0%, 97%) 0%, hsl(0, 0%, 89%) 100%);
- background-image: -moz-linear-gradient(top, hsl(0, 0%, 97%) 0%, hsl(0, 0%, 89%) 100%);
- background-image: -ms-linear-gradient(top, hsl(0, 0%, 97%) 0%, hsl(0, 0%, 89%) 100%);
- background-image: -o-linear-gradient(top, hsl(0, 0%, 97%) 0%, hsl(0, 0%, 89%) 100%);
- background-image: linear-gradient(top, hsl(0, 0%, 97%) 0%, hsl(0, 0%, 89%) 100%);
- box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4),
- 0 1px 4px rgba(0, 0, 0, .25);
- }
-
- #uploader.over {
- outline: 3px dashed #999;
- }
-
- #uploader:active {
- background-image: -webkit-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 88%) 100%);
- background-image: -moz-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 88%) 100%);
- background-image: -ms-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 88%) 100%);
- background-image: -o-linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 88%) 100%);
- background-image: linear-gradient(top, hsl(0, 0%, 95%) 0%, hsl(0, 0%, 88%) 100%);
- box-shadow: inset 0 2px 3px rgba(100, 100, 100, .25),
- 0 1px 3px rgba(0, 0, 0, .25);
- }
-
- #uploader > * {
- display: inline-block;
- margin: 0;
- vertical-align: top;
- -webkit-transition: .2s;
- -moz-transition: .2s;
- -ms-transition: .2s;
- -o-transition: .2s;
- transition: .2s;
- }
-
- #uploader figure {
- width: 24px;
- height: 24px;
- margin: 3px 3px 0;
- border: 1px solid #afafaf;
- text-align: center;
- background-image: -webkit-linear-gradient(top, #ddd 0%, #bbb 45%, #b0b0b0 50%, #c5c5c5 100%);
- background-image: -moz-linear-gradient(top, #ddd 0%, #bbb 45%, #b0b0b0 50%, #c5c5c5 100%);
- background-image: -ms-linear-gradient(top, #ddd 0%, #bbb 45%, #b0b0b0 50%, #c5c5c5 100%);
- background-image: -o-linear-gradient(top, #ddd 0%, #bbb 45%, #b0b0b0 50%, #c5c5c5 100%);
- background-image: linear-gradient(top, #ddd 0%, #bbb 45%, #b0b0b0 50%, #c5c5c5 100%);
- box-shadow: inset 0 1px 2px rgba(0, 0, 0, .25);
- }
-
- #uploader figure > div {
- width: 24px;
- height: 0;
- overflow: hidden;
- }
-
- #uploader img {
- max-width: 24px;
- max-height: 24px;
- vertical-align: middle;
- }
-
- #uploader label {
- position: relative;
- width: 117px;
- border-left: 1px solid #d7d7d7;
- font: 13px/32px sans-serif;
- text-align: center;
- font-weight: bold;
- color: #666;
- text-shadow: 0 1px 2px rgba(255, 255, 255, .6);
- cursor: pointer;
- pointer-events: none;
- z-index: 1;
- }
-
- #file {
- position: absolute;
- width: 100%;
- height: 100%;
- left: 0;
- top: 0;
- opacity: 0;
- cursor: pointer;
- z-index: 1;
- }
-
- #uploader progress, #uploader ul {
- display: inline-block;
- position: absolute;
- width: 110px;
- height: 8px;
- left: 0;
- top: 13px;
- opacity: 0;
- -webkit-transition: opacity .5s;
- -moz-transition: opacity .5s;
- -ms-transition: opacity .5s;
- -o-transition: opacity .5s;
- transition: opacity .5s;
- -webkit-appearance: none;
- -moz-appearance: none;
- }
-
- /* Won't work with the webkit declaration, webkit doesn't care */
- #uploader progress {
- background-image: -moz-linear-gradient(top, #C7C7C7 0%, #D7D7D7 100%);
- border-radius: 3px;
- border: none;
- box-shadow: inset 0 1px #bbb,
- 0 -1px 1px rgba(0, 0, 0, .2);
- }
-
- #uploader progress::-webkit-progress-bar {
- background-image: -webkit-linear-gradient(top, #C7C7C7 0%, #D7D7D7 100%);
- box-shadow: inset 0 1px #bbb,
- 0 -1px 1px rgba(0, 0, 0, .2);
- }
-
- #uploader progress::-webkit-progress-value, #uploader progress::-webkit-progress-bar {
- border-radius: 3px;
- }
-
- #uploader progress::-webkit-progress-value {
- border: 1px solid #63a633;
- background-image: -webkit-linear-gradient(top, #7BC446 0%, #59AA1E 50%, #60B125 100%);
- -webkit-transition: .5s;
- }
-
- #uploader progress::-moz-progress-bar {
- border: 1px solid #63a633;
- border-radius: 3px;
- background-image: -moz-linear-gradient(top, #7BC446 0%, #59AA1E 50%, #60B125 100%);
- -moz-transition: .5s;
- }
-
- #uploader ul {
- top: 0;
- padding: 0;
- list-style: none;
- }
-
- #uploader ul > li {
- position: absolute;
- padding-left: 21px;
- text-transform: uppercase;
- font: 12px/32px Arial, sans-serif
- }
-
- #uploader ul *::before, #uploader ul *::after {
- content: "";
- position: absolute;
- top: 50%;
- left: 0;
- }
-
- #uploader ul.ok li:first-child {
- opacity: 0;
- color: #6fac42;
- font-weight: bold;
- -webkit-animation: fadeout 3s 1 ease-in;
- -moz-animation: fadeout 3s 1 ease-in;
- }
-
- #uploader ul li:first-child::before {
- left: 3px;
- width: 14px;
- height: 14px;
- margin-top: -7px;
- border-radius: 14px;
- background: #7AC245;
- box-shadow: inset 0 0 3px rgba(111, 172, 66, .6),
- 0 -1px 3px rgba(111, 172, 66, .2);
- }
-
- #uploader ul li:first-child::after {
- left: 8px;
- width: 2px;
- height: 7px;
- border-width: 0 2px 2px 0;
- border-style: solid;
- border-color: white;
- margin-top: -5px;
- -webkit-transform: rotate(45deg);
- -moz-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- -o-transform: rotate(45deg);
- transform: rotate(45deg);
- }
-
- #uploader ul.ok li:last-child {
- -webkit-animation: fadein 3s 1 ease-in;
- -moz-animation: fadein 3s 1 ease-in;
- }
-
- #uploader ul li:last-child::before {
- z-index: 10;
- left: 9px;
- width: 2px;
- height: 8px;
- margin-top: -4px;
- background: white;
- -webkit-transform: rotate(45deg);
- -moz-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- -o-transform: rotate(45deg);
- transform: rotate(45deg);
- }
-
- #uploader ul li:last-child a {
- text-decoration: none;
- color: #b3b3b3;
- font-weight: bold;
- }
-
- #uploader ul li:last-child a::before {
- width: 14px;
- height: 14px;
- border-radius: 14px;
- }
-
- #uploader ul li:last-child a::before, #uploader ul li:last-child a::after {
- margin: -7px 0 0 3px;
- background: #C53333;
- box-shadow: inset 0 0 3px rgba(0, 0, 0, .6),
- 0 -1px 3px rgba(0, 0, 0, .2);
- }
-
- #uploader ul li:last-child a::after {
- left: 3px;
- width: 8px;
- height: 2px;
- margin-top: -1px;
- background: white;
- box-shadow: 0 0 3px rgba(0, 0, 0, .6);
- -webkit-transform: rotate(45deg);
- -moz-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- -o-transform: rotate(45deg);
- transform: rotate(45deg);
- }
-
- @-webkit-keyframes fadeout {
- 0% { opacity: 1; }
- 25% { opacity: 1; }
- 50% { opacity: 0; }
- }
-
- @-moz-keyframes fadeout {
- 0% { opacity: 1; }
- 25% { opacity: 1; }
- 50% { opacity: 0; }
- }
-
- @-webkit-keyframes fadein {
- 0% { opacity: 0; }
- 50% { opacity: 0; }
- 75% { opacity: 1; }
- }
-
- @-moz-keyframes fadein {
- 0% { opacity: 0; }
- 50% { opacity: 0; }
- 75% { opacity: 1; }
- }
-</style>
+<!doctype html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>Simple uploader - by Calvein</title>
+ <link href="http://fonts.googleapis.com/css?family=Pacifico&text='Simple uploader'" rel="stylesheet">
+ <link href="http://necolas.github.com/normalize.css/2.0.1/normalize.css" rel="stylesheet">
+ <link href="style.css" rel="stylesheet">
</head>
<body>
- <header>
- <h1>Simple uploader</h1>
- <h2>By <a href="http://twitter.com/Calvein">Calvein</a> based on the original idea by <a href="http://twitter.com/jessedodds">Jesse Dodds</a>
- </header>
- <form>
- <div id="uploader">
- <figure><div></div></figure><!--
- --><label>
- Choose a file...
- </label>
- <input type=file id=file><!--
- --><progress max=100 value=30></progress>
- <ul>
- <li>Complete</li>
- <li><a href=#>Remove</a></li>
- </ul>
- </div>
- </form>
- <p>
- It's done in plain JavaScript and CSS3, there is no images.<br>The pattern comes from <a href="http://subtlepatterns.com/">Subtle Patterns</a>,
- the icons are edited version of <a href="http://twitter.com/necolas">Nicolas Gallagher</a>'s <a href="http://nicolasgallagher.com/pure-css-gui-icons/">ones</a>.<br>
- It works only (well I only tested those) on Chrome and Firefox.
- </p>
- <hr>
- <footer>
- Get the <img src="http://dribbble.com/favicon.ico" alt="Dribbble"> <a href="http://dribbble.com/shots/251571-Image-upload-idea">shot</a> |
- Get the <img src="https://github.com/favicon.ico" alt="GitHub"> <a href="https://github.com/Calvein/Simple-uploader">code</a> |
- <a href="http://twitter.com/Calvein" class="twitter-follow-button" data-show-count="false">Follow @calvein</a>
- </footer>
+ <header>
+ <h1>Simple uploader</h1>
+ <h2>By <a href="http://twitter.com/Calvein">Calvein</a> based on the original idea by <a href="http://twitter.com/jessedodds">Jesse Dodds</a>
+ </header>
+ <form>
+ <div id="uploader">
+ <figure><div></div></figure><!--
+ --><label>
+ Choose a file...
+ </label>
+ <input type=file id=file><!--
+ --><progress max=100 value=30></progress>
+ <ul>
+ <li>Complete</li>
+ <li><a href=#>Remove</a></li>
+ </ul>
+ </div>
+ </form>
+ <p>
+ It's done in plain JavaScript and CSS3, there is no images.<br>The pattern comes from <a href="http://subtlepatterns.com/">Subtle Patterns</a>,
+ the icons are edited version of <a href="http://twitter.com/necolas">Nicolas Gallagher</a>'s <a href="http://nicolasgallagher.com/pure-css-gui-icons/">ones</a>.<br>
+ It works only (well I only tested those) on Chrome and Firefox.
+ </p>
+ <hr>
+ <footer>
+ Get the <img src="http://dribbble.com/favicon.ico" alt="Dribbble"> <a href="http://dribbble.com/shots/251571-Image-upload-idea">shot</a> |
+ Get the <img src="https://github.com/favicon.ico" alt="GitHub"> <a href="https://github.com/Calvein/Simple-uploader">code</a> |
+ <a href="http://twitter.com/Calvein" class="twitter-follow-button" data-show-count="false">Follow @calvein</a>
+ </footer>
<script src="http://platform.twitter.com/widgets.js"></script>
+<script src="script.js"></script>
<script>
-function $(q){return $uploader.querySelector(q)}
-// https://gist.github.com/1002315
-function cssProp(s){return eval(0+"O-Moz-Webkit-Ms-".replace(/.*?-|$/g,"||(s='$&"+s+"')in new Image().style&&s").replace(/-(.)/g,"'+'$1'.toUpperCase()+'"))}
-
-// Declare Elements
-var $uploader = document.querySelector('#uploader'),
- $figure = $('figure'),
- $mask = $('figure > div'),
- $label = $('label'),
- $file = $('#file'),
- $progress = $('progress'),
- $ok = $('ul');
-
-function uploadFile(e) {
- // If it's dropped
- this.classList.remove('over');
- e.stopPropagation();
- e.preventDefault();
- var files = this.files || e.dataTransfer.files,
- file = files[0],
- isImage = /^image\//.test(file.type),
- dataURI = '',
- xhr = new XMLHttpRequest(),
- upload = xhr.upload;
-
- // Reader
- if (isImage) {
- var reader = new FileReader();
-
- // http://code.google.com/p/chromium/issues/detail?id=48367
- //reader.addEventListener('onload', function(e) {
- reader.onload = function(e) {
- dataURI = this.result;
- var img = document.createElement('img');
- img.src = this.result;
- img.alt = file.name;
- img.style.display = 'inline';
- $mask.insertBefore(img, null);
- };
-
- reader.readAsDataURL(file);
- } else {
- $figure.style.display = 'none';
- $label.style.borderLeftWidth = 0;
- $ok.style.left = 0;
- $uploader.style.width = '118px';
- }
-
- // XHR
- // upload.php is a tiny test in php
- xhr.open('POST', 'upload.php');
-
- upload.addEventListener('loadstart', function(e) {
- $label.style.display = 'none';
- $progress.style.opacity = 1;
- $file.style.zIndex = -1;
- if (isImage) {
- $uploader.style.width = '32px';
- $progress.style.left = '40px';
- $ok.style.left = '40px';
- } else {
- $uploader.style.width = 0;
- $uploader.style.borderWidth = 0;
- }
- }, false);
-
- upload.addEventListener('progress', function(e) {
- if (e.lengthComputable) {
- var percentLoaded = Math.round((e.loaded / e.total) * 100);
- if (percentLoaded < 100) {
- $progress.value = percentLoaded;
- $mask.style.height = 20 * percentLoaded / 100 + 'px';
- }
- }
- }, false);
-
- upload.addEventListener('load', function(e) {
- if ('webkitNotifications' in window && webkitNotifications.checkPermission() === 0) {
- webkitNotifications.createNotification(dataURI, 'Upload complete', 'The ' + file.type.split('/')[0] + ' "' + file.fileName + '" was successfully uploaded').show();
- }
-
- $mask.style.height = '24px';
- $progress.value = 100;
- $progress.style.opacity = 0;
- $ok.style.opacity = 1;
- $ok.className = 'ok';
- }, false);
-
- xhr.setRequestHeader("Cache-Control", "no-cache");
- xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
- xhr.setRequestHeader("X-File-Name", file.name);
- xhr.send(file);
-}
-
-$file.addEventListener('click', function(e) {
- if ('webkitNotifications' in window && webkitNotifications.checkPermission() !== 0)
- webkitNotifications.requestPermission();
-}, false);
-$file.addEventListener('change', uploadFile, false);
-$uploader.addEventListener('drop', uploadFile, false);
-
-function hover(e) {
- this.classList.toggle('over');
-}
-$uploader.addEventListener('dragenter', hover, false);
-$uploader.addEventListener('dragleave', hover, false);
-
-$uploader.addEventListener('dragover', function(e) {
- e.stopPropagation();
- e.preventDefault();
-}, false);
-
-// Remove link
-$('a').addEventListener('click', function(e) {
- e.preventDefault();
-
- $uploader.style.opacity = 0;
- $uploader.style[cssProp('animation')] = 'fadeout 1.5s 1 ease-in';
-}, false);
-
-$uploader.addEventListener('animationend', animationEnd, false);
-$uploader.addEventListener('webkitAnimationEnd', animationEnd, false);
-
-function animationEnd(e) {
- if (e.target.id && e.animationName === 'fadeout') {
- // reset the styles
- var $img = $('img')
- if ($img)
- $img.parentNode.removeChild($img);
- $label.style.display = 'inline-block';
- $progress.style.opacity = 0;
- $file.style.zIndex = 1;
- $ok.style.left = '40px';
- $ok.style.opacity = 0;
- $figure.style.display = 'inline-block';
- $label.style.borderLeftWidth = '1px';
- $uploader.style.borderWidth = '1px';
- $uploader.style[cssProp('transition')] = 'width 0s';
- $uploader.style.width = '150px';
- $uploader.style.opacity = 1;
-
- // reset the input
- $file.value = '';
- // You may want to delete it on the server too, feel free to add an AJAX request here
-
- $uploader.style[cssProp('animationName')] = 'fadein';
- } else {
- $uploader.style[cssProp('transition')] = 'width .5s';
- }
-}
-
-</script>
-<script>
- var _gaq = _gaq || [];
- _gaq.push(['_setAccount', 'UA-25537500-1']);
- _gaq.push(['_trackPageview']);
-
- (function() {
- var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
- ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
- var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
- })();
+ var _gaq = _gaq || [];
+ _gaq.push(['_setAccount', 'UA-25537500-1']);
+ _gaq.push(['_trackPageview']);
+
+ (function() {
+ var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+ var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+ })();
</script>
</body>
</html>
View
439 normalize.css
@@ -1,439 +0,0 @@
-/*! normalize.css 2011-08-31T22:02 UTC · http://github.com/necolas/normalize.css */
-
-/* =============================================================================
- HTML5 display definitions
- ========================================================================== */
-
-/*
- * Corrects block display not defined in IE6/7/8/9 & FF3
- */
-
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-nav,
-section {
- display: block;
-}
-
-/*
- * Corrects inline-block display not defined in IE6/7/8/9 & FF3
- */
-
-audio,
-canvas,
-video {
- display: inline-block;
- *display: inline;
- *zoom: 1;
-}
-
-/*
- * Prevents modern browsers from displaying 'audio' without controls
- */
-
-audio:not([controls]) {
- display: none;
-}
-
-/*
- * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
- * Known issue: no IE6 support
- */
-
-[hidden] {
- display: none;
-}
-
-
-/* =============================================================================
- Base
- ========================================================================== */
-
-/*
- * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
- * http://clagnut.com/blog/348/#c790
- * 2. Keeps page centred in all browsers regardless of content height
- * 3. Prevents iOS text size adjust after orientation change, without disabling user zoom
- * www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
- */
-
-html {
- font-size: 100%; /* 1 */
- overflow-y: scroll; /* 2 */
- -webkit-text-size-adjust: 100%; /* 3 */
- -ms-text-size-adjust: 100%; /* 3 */
-}
-
-/*
- * Addresses margins handled incorrectly in IE6/7
- */
-
-body {
- margin: 0;
-}
-
-/*
- * Addresses font-family inconsistency between 'textarea' and other form elements.
- */
-
-body,
-button,
-input,
-select,
-textarea {
- font-family: sans-serif;
-}
-
-
-/* =============================================================================
- Links
- ========================================================================== */
-
-a {
- color: #00e;
-}
-
-a:visited {
- color: #551a8b;
-}
-
-/*
- * Addresses outline displayed oddly in Chrome
- */
-
-a:focus {
- outline: thin dotted;
-}
-
-/*
- * Improves readability when focused and also mouse hovered in all browsers
- * people.opera.com/patrickl/experiments/keyboard/test
- */
-
-a:hover,
-a:active {
- outline: 0;
-}
-
-
-/* =============================================================================
- Typography
- ========================================================================== */
-
-/*
- * Addresses styling not present in IE7/8/9, S5, Chrome
- */
-
-abbr[title] {
- border-bottom: 1px dotted;
-}
-
-/*
- * Addresses style set to 'bolder' in FF3/4, S4/5, Chrome
-*/
-
-b,
-strong {
- font-weight: bold;
-}
-
-blockquote {
- margin: 1em 40px;
-}
-
-/*
- * Addresses styling not present in S5, Chrome
- */
-
-dfn {
- font-style: italic;
-}
-
-/*
- * Addresses styling not present in IE6/7/8/9
- */
-
-mark {
- background: #ff0;
- color: #000;
-}
-
-/*
- * Corrects font family set oddly in IE6, S4/5, Chrome
- * en.wikipedia.org/wiki/User:Davidgothberg/Test59
- */
-
-pre,
-code,
-kbd,
-samp {
- font-family: monospace, serif;
- _font-family: 'courier new', monospace;
- font-size: 1em;
-}
-
-/*
- * Improves readability of pre-formatted text in all browsers
- */
-
-pre {
- white-space: pre;
- white-space: pre-wrap;
- word-wrap: break-word;
-}
-
-/*
- * 1. Addresses CSS quotes not supported in IE6/7
- * 2. Addresses quote property not supported in S4
- */
-
-/* 1 */
-
-q {
- quotes: none;
-}
-
-/* 2 */
-
-q:before,
-q:after {
- content: '';
- content: none;
-}
-
-small {
- font-size: 75%;
-}
-
-/*
- * Prevents sub and sup affecting line-height in all browsers
- * gist.github.com/413930
- */
-
-sub,
-sup {
- font-size: 75%;
- line-height: 0;
- position: relative;
- vertical-align: baseline;
-}
-
-sup {
- top: -0.5em;
-}
-
-sub {
- bottom: -0.25em;
-}
-
-
-/* =============================================================================
- Lists
- ========================================================================== */
-
-ul,
-ol {
- margin: 1em 0;
- padding: 0 0 0 40px;
-}
-
-dd {
- margin: 0 0 0 40px;
-}
-
-nav ul,
-nav ol {
- list-style: none;
- list-style-image: none;
-}
-
-
-/* =============================================================================
- Embedded content
- ========================================================================== */
-
-/*
- * 1. Removes border when inside 'a' element in IE6/7/8/9, F3
- * 2. Improves image quality when scaled in IE7
- * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
- */
-
-img {
- border: 0; /* 1 */
- -ms-interpolation-mode: bicubic; /* 2 */
-}
-
-/*
- * Corrects overflow displayed oddly in IE9
- */
-
-svg:not(:root) {
- overflow: hidden;
-}
-
-
-/* =============================================================================
- Figures
- ========================================================================== */
-
-/*
- * Addresses margin not present in IE6/7/8/9, S5, O11
- */
-
-figure {
- margin: 0;
-}
-
-
-/* =============================================================================
- Forms
- ========================================================================== */
-
-/*
- * Corrects margin displayed oddly in IE6/7
- */
-
-form {
- margin: 0;
-}
-
-/*
- * Define consistent margin and padding
- */
-
-fieldset {
- margin: 0 2px;
- padding: 0.35em 0.625em 0.75em;
-}
-
-/*
- * 1. Corrects color not being inherited in IE6/7/8/9
- * 2. Corrects alignment displayed oddly in IE6/7
- */
-
-legend {
- border: 0; /* 1 */
- *margin-left: -7px; /* 2 */
-}
-
-/*
- * 1. Corrects font size not being inherited in all browsers
- * 2. Addresses margins set differently in IE6/7, F3/4, S5, Chrome
- * 3. Improves appearance and consistency in all browsers
- */
-
-button,
-input,
-select,
-textarea {
- font-size: 100%; /* 1 */
- margin: 0; /* 2 */
- vertical-align: baseline; /* 3 */
- *vertical-align: middle; /* 3 */
-}
-
-/*
- * 1. Addresses FF3/4 setting line-height using !important in the UA stylesheet
- * 2. Corrects inner spacing displayed oddly in IE6/7
- */
-
-button,
-input {
- line-height: normal; /* 1 */
- *overflow: visible; /* 2 */
-}
-
-/*
- * Corrects overlap and whitespace issue for buttons and inputs in IE6/7
- * Known issue: reintroduces inner spacing
- */
-
-table button,
-table input {
- *overflow: auto;
-}
-
-/*
- * 1. Improves usability and consistency of cursor style between image-type 'input' and others
- * 2. Corrects inability to style clickable 'input' types in iOS
- */
-
-button,
-html input[type="button"],
-input[type="reset"],
-input[type="submit"] {
- cursor: pointer; /* 1 */
- -webkit-appearance: button; /* 2 */
-}
-
-/*
- * 1. Addresses box sizing set to content-box in IE8/9
- * 2. Addresses excess padding in IE8/9
- */
-
-input[type="checkbox"],
-input[type="radio"] {
- box-sizing: border-box; /* 1 */
- padding: 0; /* 2 */
-}
-
-/*
- * 1. Addresses appearance set to searchfield in S5, Chrome
- * 2. Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof)
- */
-
-input[type="search"] {
- -webkit-appearance: textfield; /* 1 */
- -moz-box-sizing: content-box;
- -webkit-box-sizing: content-box; /* 2 */
- box-sizing: content-box;
-}
-
-/*
- * Corrects inner padding displayed oddly in S5, Chrome on OSX
- */
-
-input[type="search"]::-webkit-search-decoration {
- -webkit-appearance: none;
-}
-
-/*
- * Corrects inner padding and border displayed oddly in FF3/4
- * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
- */
-
-button::-moz-focus-inner,
-input::-moz-focus-inner {
- border: 0;
- padding: 0;
-}
-
-/*
- * 1. Removes default vertical scrollbar in IE6/7/8/9
- * 2. Improves readability and alignment in all browsers
- */
-
-textarea {
- overflow: auto; /* 1 */
- vertical-align: top; /* 2 */
-}
-
-
-/* =============================================================================
- Tables
- ========================================================================== */
-
-/*
- * Remove most spacing between table cells
- */
-
-table {
- border-collapse: collapse;
- border-spacing: 0;
-}
View
3  upload.php
@@ -1,3 +1,2 @@
<?php
-
-die(file_put_contents('/donnees/workspaces/upload/'.$_SERVER['HTTP_X_FILE_NAME'], file_get_contents("php://input")));
+die(file_put_contents('/donnees/workspaces/upload/'.$_SERVER['HTTP_X_FILE_NAME'], file_get_contents("php://input")));
Please sign in to comment.
Something went wrong with that request. Please try again.