- Grunt configured
- first install the dependencies with 'sudo npm install' - then run with 'grunt'
This commit is contained in:
Adriaan Wormgoor
parent
4ec660fd74
commit
8289c084ca
|
|
@ -0,0 +1,142 @@
|
|||
/*global module:false*/
|
||||
module.exports = function(grunt) {
|
||||
|
||||
// Project configuration.
|
||||
grunt.initConfig({
|
||||
// Metadata.
|
||||
pkg: grunt.file.readJSON('package.json'),
|
||||
banner: '/*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - ' +
|
||||
'<%= grunt.template.today("yyyy-mm-dd") %>\n' +
|
||||
'<%= pkg.homepage ? "* " + pkg.homepage + "\\n" : "" %>' +
|
||||
'* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>;' +
|
||||
' Licensed <%= _.pluck(pkg.licenses, "type").join(", ") %> */\n',
|
||||
concat: {
|
||||
options: {
|
||||
// separator: ';'
|
||||
},
|
||||
dist: {
|
||||
src: [
|
||||
'www/js/SettingsWindow.js',
|
||||
'www/js/d3dServerInterfacing.js',
|
||||
'www/js/verticalShapes.js',
|
||||
'www/js/buttonbehaviors.js',
|
||||
'www/js/canvasDrawing.js',
|
||||
'www/js/previewRendering.js',
|
||||
'www/js/gcodeGenerating.js',
|
||||
'www/js/init_layout.js',
|
||||
'www/js/Printer.js',
|
||||
'www/js/Progressbar.js',
|
||||
'www/js/Thermometer.js',
|
||||
'www/js/utils.js',
|
||||
'www/js/sidebar.js',
|
||||
'www/js/message.js',
|
||||
'www/js/main.js'
|
||||
],
|
||||
dest: 'www/js/<%= pkg.name %>.js'
|
||||
}
|
||||
},
|
||||
uglify: {
|
||||
options: {
|
||||
// banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n',
|
||||
mangle: false,
|
||||
beautify: false,
|
||||
compress: {},
|
||||
report: 'min',
|
||||
preserveComments: 'false'
|
||||
},
|
||||
build: {
|
||||
src: ['www/js/*.js', '!www/js/<%= pkg.name %>.min.js'],
|
||||
dest: 'www/js/<%= pkg.name %>.min.js'
|
||||
}
|
||||
},
|
||||
jshint: {
|
||||
options: {
|
||||
globals: {
|
||||
jQuery: true
|
||||
},
|
||||
browser: true,
|
||||
curly: true,
|
||||
eqeqeq: true,
|
||||
immed: true,
|
||||
latedef: true,
|
||||
newcap: true,
|
||||
noarg: true,
|
||||
sub: true,
|
||||
undef: true,
|
||||
unused: true,
|
||||
boss: true,
|
||||
eqnull: true
|
||||
},
|
||||
// gruntfile: {
|
||||
// src: 'Gruntfile.js'
|
||||
// },
|
||||
lib_test: {
|
||||
src: ['www/js/*.js', '!www/js/<%= pkg.name %>.js', '!www/js/<%= pkg.name %>.min.js']
|
||||
}
|
||||
},
|
||||
less: {
|
||||
development: {
|
||||
options: {
|
||||
paths: ["www/css"]
|
||||
},
|
||||
files: {
|
||||
"www/css/styles.css": "less/styles.less"
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// javascript: {
|
||||
// files: ["www/js/*", '!www/js/*.min.js'],
|
||||
// // tasks: ["less", "css_prefix"]
|
||||
// tasks: ["uglify"]
|
||||
// },
|
||||
styles: {
|
||||
files: ["less/*"],
|
||||
tasks: ["less", "autoprefixer", "cssmin"]
|
||||
}
|
||||
},
|
||||
autoprefixer: {
|
||||
options: {
|
||||
browsers: ['> 1%', 'last 2 versions', 'ie 8', 'ie 9', 'ff 17', 'opera 12.1']
|
||||
},
|
||||
// prefix all specified files and save them separately
|
||||
single_file: {
|
||||
options: {},
|
||||
// expand: true,
|
||||
// flatten: true,
|
||||
src: 'www/css/styles.css', // -> src/css/file1.css, src/css/file2.css
|
||||
dest: 'www/css/styles.css' // -> dest/css/file1.css, dest/css/file2.css
|
||||
}
|
||||
},
|
||||
cssmin: {
|
||||
minify: {
|
||||
expand: true,
|
||||
cwd: 'www/css/',
|
||||
src: ['*.css', '!*.min.css'],
|
||||
dest: 'www/css/',
|
||||
ext: '.min.css'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// These plugins provide necessary tasks.
|
||||
grunt.loadNpmTasks('grunt-contrib-less');
|
||||
grunt.loadNpmTasks('grunt-contrib-concat');
|
||||
grunt.loadNpmTasks('grunt-contrib-uglify');
|
||||
grunt.loadNpmTasks('grunt-contrib-jshint');
|
||||
grunt.loadNpmTasks('grunt-contrib-watch');
|
||||
grunt.loadNpmTasks('grunt-autoprefixer');
|
||||
grunt.loadNpmTasks('grunt-contrib-cssmin');
|
||||
|
||||
// Default task.
|
||||
grunt.registerTask('default', [
|
||||
'less',
|
||||
'autoprefixer',
|
||||
'cssmin',
|
||||
// 'concat',
|
||||
// 'uglify',
|
||||
// 'jshint',
|
||||
'watch'
|
||||
]);
|
||||
|
||||
};
|
||||
|
|
@ -5,8 +5,9 @@
|
|||
*/
|
||||
body {
|
||||
background-color: #fcfcfc;
|
||||
-moz-user-select: none; /* disable cut copy paste */
|
||||
-webkit-user-select: none; /* disable cut copy paste */
|
||||
user-select: none; /* disable cut copy paste */
|
||||
// -moz-user-select: none; /* disable cut copy paste */
|
||||
// -webkit-user-select: none; /* disable cut copy paste */
|
||||
overflow:hidden; /* This chops off any overhanging divs */
|
||||
}
|
||||
img {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,22 @@
|
|||
{
|
||||
"name": "doodle3dclient",
|
||||
"version": "0.9.0",
|
||||
"description": "Doodle3D client app",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/Doodle3D/doodle3d-client.git"
|
||||
},
|
||||
"author": "Peter Uithoven, Adriaan Wormgoor, Rick Companje",
|
||||
"readmeFilename": "README.md",
|
||||
"devDependencies": {
|
||||
"grunt": "~0.4.1",
|
||||
"grunt-cli": "~0.1.9",
|
||||
"grunt-contrib-less": "~0.7.0",
|
||||
"grunt-contrib-watch": "~0.5.3",
|
||||
"grunt-contrib-uglify": "~0.2.4",
|
||||
"grunt-contrib-jshint": "~0.6.4",
|
||||
"grunt-autoprefixer": "~0.4.0",
|
||||
"grunt-contrib-cssmin": "~0.6.2",
|
||||
"grunt-contrib-concat": "~0.3.0"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1 @@
|
|||
.debugContainer{position:absolute;top:0;left:0;z-index:500;background-color:#f0f;display:none}#debug_textArea{position:absolute;bottom:0;z-index:500;display:none}.debugBtn{width:25px;height:25px;background-color:#03b;float:left}.agentInfo{background:#fff;border:1px #333 solid;display:none;float:left;opacity:.7}.agentInfoToggle{display:block}#debug_display{position:absolute;top:0;left:0;display:none;background-color:#fff;opacity:.7;color:#000}
|
||||
|
|
@ -0,0 +1 @@
|
|||
form{margin:10px;max-width:600px}form input{margin:1px}body,th,td{font-family:Helvetica,Arial,"Nimbus Sans L",sans-serif;font-size:13px}.settingsContainer{position:relative;width:100%;height:100%}form fieldset{max-width:600px;border:1px solid #bbb;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;margin-bottom:20px;padding:8px}form fieldset fieldset{max-width:580px;margin:15px 0 5px;clear:left;float:left}form fieldset legend{margin-left:10px;font-weight:700}form label{min-width:150px;display:block;float:left;margin:1px 0 0;clear:left}form div{float:left}form input[type=text],form input[type=number],form input[type=password]{border:1px solid #90c0ff;margin-right:5px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}form input[type=text].small,form input[type=number].small,form input[type=password].small{width:50px}form input[type=text].large,form input[type=number].large,form input[type=password].large{width:250px}form input[type=radio]{margin:4px 4px 0 0}form textarea{border:1px solid #90c0ff;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}form .startgcode_left{float:left;margin-right:20px}form textarea.gcode{width:252px;height:150px}form small{margin:3px 0 0;display:block;clear:left}form .button{display:inline-block}form #passwordLabel,form #password{display:none}form input.error,form textarea.error,form select.error{border:red solid 2px}form .errorMsg{color:red;margin:0 0 0 1em}
|
||||
|
|
@ -1,35 +1,35 @@
|
|||
/*
|
||||
|
||||
GLOBAL CONTAINER
|
||||
GLOBAL CONTAINER
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
body {
|
||||
background-color: #fcfcfc;
|
||||
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none; /* disable cut copy paste */
|
||||
/* disable cut copy paste */
|
||||
overflow: hidden; /* This chops off any overhanging divs */
|
||||
user-select: none;
|
||||
/* disable cut copy paste */
|
||||
overflow: hidden;
|
||||
/* This chops off any overhanging divs */
|
||||
}
|
||||
|
||||
img {
|
||||
z-index: 5; /*pointer-events: none;
|
||||
*/
|
||||
/*-webkit-touch-callout: none;
|
||||
*/
|
||||
/*disable callout, image save panel */
|
||||
/*-webkit-tap-highlight-color: transparent;
|
||||
*/
|
||||
/* "turn off" link highlight */
|
||||
z-index: 5;
|
||||
/*pointer-events:none;*/
|
||||
/*-webkit-touch-callout: none; */
|
||||
/*disable callout, image save panel */
|
||||
/*-webkit-tap-highlight-color: transparent; */
|
||||
/* "turn off" link highlight */
|
||||
}
|
||||
|
||||
/* http://stackoverflow.com/questions/5348092/prevent-default-press-but-not-default-drag-in-ios-mobilesafari */
|
||||
|
||||
.btn {
|
||||
background-repeat: no-repeat; /* -webkit-user-select: none;
|
||||
*/
|
||||
cursor: pointer;
|
||||
background-repeat: no-repeat;
|
||||
/* -webkit-user-select: none;*/
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#landscape {
|
||||
|
|
@ -46,7 +46,6 @@ cursor: pointer;
|
|||
overflow: hidden;
|
||||
margin: 0px auto;
|
||||
outline: 2px solid #5e8c71;
|
||||
|
||||
-webkit-box-shadow: 0 0 8px rgba(8, 8, 8, 0.25);
|
||||
box-shadow: 0 0 8px rgba(8, 8, 8, 0.25);
|
||||
}
|
||||
|
|
@ -62,15 +61,11 @@ cursor: pointer;
|
|||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bgTop,.bgMiddle,.bgBottom {
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
|
||||
filter: alpha(opacity=100);
|
||||
.bgTop,
|
||||
.bgMiddle,
|
||||
.bgBottom {
|
||||
opacity: 1.0;
|
||||
|
||||
-webkit-transition: opacity .35s linear;
|
||||
-moz-transition: opacity .35s linear;
|
||||
-o-transition: opacity .35s linear;
|
||||
-ms-transition: opacity .35s linear;
|
||||
transition: opacity .35s linear;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
|
|
@ -91,9 +86,10 @@ cursor: pointer;
|
|||
|
||||
/*
|
||||
|
||||
CENTER PANEL
|
||||
CENTER PANEL
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
.centerpanel {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
|
|
@ -149,10 +145,8 @@ CENTER PANEL
|
|||
background-color: #fff;
|
||||
border: 4px solid #000;
|
||||
border-radius: 15px;
|
||||
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-ms-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
z-index: 15;
|
||||
}
|
||||
|
|
@ -202,6 +196,7 @@ CENTER PANEL
|
|||
}
|
||||
|
||||
/* DEBUG THING */
|
||||
|
||||
#preview_tmp {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
|
|
@ -219,8 +214,9 @@ CENTER PANEL
|
|||
}
|
||||
|
||||
/*
|
||||
DOODLE UP/DOWN/LEFT/RIGHT buttons
|
||||
*/
|
||||
DOODLE UP/DOWN/LEFT/RIGHT buttons
|
||||
*/
|
||||
|
||||
.manipulationBtns {
|
||||
margin: 2px 5px;
|
||||
position: absolute;
|
||||
|
|
@ -276,33 +272,30 @@ DOODLE UP/DOWN/LEFT/RIGHT buttons
|
|||
}
|
||||
|
||||
/*
|
||||
HEIGHT-related RESPONSIVE STUFF
|
||||
*/
|
||||
HEIGHT-related RESPONSIVE STUFF
|
||||
*/
|
||||
|
||||
@media screen and (max-height: 700px) {
|
||||
.logopanel {
|
||||
height: 22%;
|
||||
}
|
||||
}
|
||||
|
||||
.doodlecontainer {
|
||||
.doodlecontainer {
|
||||
height: 68%;
|
||||
}
|
||||
}
|
||||
|
||||
.d3dlogo {
|
||||
.d3dlogo {
|
||||
top: 25%;
|
||||
max-width: 399px;
|
||||
height: 74px;
|
||||
background-image: url('../img/logo/logo_small.png');
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 655px) {
|
||||
.bgMiddle {
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
|
||||
filter: alpha(opacity=0);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 525px) {
|
||||
|
|
@ -311,8 +304,7 @@ HEIGHT-related RESPONSIVE STUFF
|
|||
height: 57px;
|
||||
max-width: 307px;
|
||||
background-image: url('../img/logo/logo_smaller.png');
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 375px) {
|
||||
|
|
@ -320,20 +312,20 @@ HEIGHT-related RESPONSIVE STUFF
|
|||
height: 40px;
|
||||
max-width: 216px;
|
||||
background-image: url('../img/logo/logo_smallest.png');
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
LEFT PANEL
|
||||
LEFT PANEL
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
.leftpanel {
|
||||
position: absolute;
|
||||
width: 17%; /* background-color: rgba(67, 204, 67, 0.4);
|
||||
*/
|
||||
top: 0px;
|
||||
width: 17%;
|
||||
/* background-color: rgba(67, 204, 67, 0.4);*/
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
}
|
||||
|
|
@ -379,14 +371,15 @@ top: 0px;
|
|||
|
||||
/*
|
||||
|
||||
RIGHT PANEL
|
||||
RIGHT PANEL
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
.rightpanel {
|
||||
position: absolute;
|
||||
width: 17%; /* background-color: rgba(255, 0, 254, 0.4);
|
||||
*/
|
||||
top: 0;
|
||||
width: 17%;
|
||||
/* background-color: rgba(255, 0, 254, 0.4);*/
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
|
@ -431,26 +424,26 @@ top: 0;
|
|||
|
||||
/*
|
||||
|
||||
PROGRESSGUAGE AND THERMOMETER SHARED STYLES
|
||||
PROGRESSGUAGE AND THERMOMETER SHARED STYLES
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
.progressbarAppear {
|
||||
/*margin-right: 1.5% !important;
|
||||
*/
|
||||
right: -0.5% !important;
|
||||
/*margin-right: 1.5% !important;*/
|
||||
right: -0.5% !important;
|
||||
}
|
||||
|
||||
.thermometerAppear {
|
||||
/*margin-right: 1.5% !important;
|
||||
*/
|
||||
right: -6.5% !important;
|
||||
/*margin-right: 1.5% !important;*/
|
||||
right: -6.5% !important;
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
PROGRESS GUAGE
|
||||
PROGRESS GUAGE
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
.progressbarCanvasContainerParent {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
|
@ -462,18 +455,13 @@ PROGRESS GUAGE
|
|||
float: right;
|
||||
border: solid #000;
|
||||
border-width: 2px 0 2px 2px;
|
||||
border-radius: 15px 0 0 15px; /*padding: 5px 0px 5px 5px;
|
||||
*/
|
||||
padding: 5px;
|
||||
border-radius: 15px 0 0 15px;
|
||||
/*padding: 5px 0px 5px 5px;*/
|
||||
padding: 5px;
|
||||
background-color: #fff;
|
||||
|
||||
-webkit-box-shadow: 0 2px 5px rgba(37, 37, 37, 0.35);
|
||||
box-shadow: 0 2px 5px rgba(37, 37, 37, 0.35);
|
||||
|
||||
-webkit-transition: right 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
-moz-transition: right 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
-o-transition: right 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
-ms-transition: right 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
transition: right 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
right: -60%;
|
||||
margin-top: 5%;
|
||||
|
|
@ -491,9 +479,10 @@ padding: 5px;
|
|||
|
||||
/*
|
||||
|
||||
THERMOMETER
|
||||
THERMOMETER
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
.thermometerContainerParent {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
|
@ -509,14 +498,9 @@ THERMOMETER
|
|||
border-width: 2px 0 2px 2px;
|
||||
border-radius: 15px 0 0 15px;
|
||||
padding: 5px;
|
||||
|
||||
-webkit-box-shadow: 0 2px 5px rgba(37, 37, 37, 0.35);
|
||||
box-shadow: 0 2px 5px rgba(37, 37, 37, 0.35);
|
||||
|
||||
-webkit-transition: right 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
-moz-transition: right 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
-o-transition: right 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
-ms-transition: right 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
transition: right 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
|
||||
right: -55%;
|
||||
}
|
||||
|
|
@ -532,11 +516,10 @@ THERMOMETER
|
|||
}
|
||||
|
||||
/*
|
||||
under all the above styles w.r.t. the cascading effect
|
||||
*/
|
||||
under all the above styles w.r.t. the cascading effect
|
||||
*/
|
||||
|
||||
.disabled {
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
|
||||
filter: alpha(opacity=30);
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
|
@ -547,14 +530,20 @@ under all the above styles w.r.t. the cascading effect
|
|||
|
||||
/*
|
||||
|
||||
REST
|
||||
REST
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
/* CLEARFIX */
|
||||
|
||||
/* http://nicolasgallagher.com/micro-clearfix-hack/ */
|
||||
.clearfix:before,.clearfix:after {
|
||||
content: " "; /* 1 */
|
||||
display: table; /* 2 */
|
||||
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
/* 1 */
|
||||
display: table;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
|
|
@ -562,15 +551,17 @@ display: table; /* 2 */
|
|||
}
|
||||
|
||||
/* For IE 6/7 only*/
|
||||
|
||||
.clearfix {
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
SETTINGS POPUP
|
||||
SETTINGS POPUP
|
||||
|
||||
*/
|
||||
|
||||
*/
|
||||
#contentOverlay {
|
||||
background-color: rgba(255, 255, 255, 0.65);
|
||||
z-index: 20;
|
||||
|
|
@ -597,7 +588,6 @@ SETTINGS POPUP
|
|||
width: 80%;
|
||||
height: 75%;
|
||||
margin: 7% 8%;
|
||||
|
||||
-webkit-box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65);
|
||||
box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65);
|
||||
border: 2px solid #222;
|
||||
|
|
@ -631,9 +621,8 @@ SETTINGS POPUP
|
|||
width: 83%;
|
||||
height: 98%;
|
||||
margin: .5%;
|
||||
|
||||
-ms-overflow-y: scroll;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
border: 1px solid #bbbbbb;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
|
@ -667,7 +656,6 @@ SETTINGS POPUP
|
|||
border: 2px solid #333;
|
||||
border-width: 0 0 2px 2px;
|
||||
font-weight: bold;
|
||||
|
||||
-webkit-box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65);
|
||||
box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65);
|
||||
color: #333;
|
||||
|
|
@ -692,201 +680,199 @@ SETTINGS POPUP
|
|||
background: #97DD8A;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px),only screen and (max-width: 720px) and (min-device-pixel-ratio: 1.5),only screen and (max-width: 720px) and (-webkit-min-device-pixel-ratio: 1.5) {
|
||||
@media only screen and (max-width: 480px), only screen and (max-width: 720px) and (min-device-pixel-ratio: 1.5), only screen and (max-width: 720px) and (-webkit-min-device-pixel-ratio: 1.5) {
|
||||
/*
|
||||
TOP LOGO
|
||||
*/
|
||||
.centerpanel {
|
||||
|
||||
.centerpanel {
|
||||
left: 0;
|
||||
margin-left: 0;
|
||||
width: 100%; /* background-color: rgba(0, 135, 255, 0.4);
|
||||
*/
|
||||
}
|
||||
width: 100%;
|
||||
/* background-color: rgba(0, 135, 255, 0.4);*/
|
||||
}
|
||||
|
||||
.logopanel {
|
||||
.logopanel {
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.d3dlogo {
|
||||
.d3dlogo {
|
||||
top: 0;
|
||||
height: 40px;
|
||||
max-width: 216px;
|
||||
background-image: url('../img/logo/logo_smallest.png');
|
||||
}
|
||||
}
|
||||
|
||||
.drawareacontainer {
|
||||
/* position: absolute;
|
||||
*/
|
||||
height: 70%;
|
||||
}
|
||||
.drawareacontainer {
|
||||
/* position: absolute;*/
|
||||
height: 70%;
|
||||
}
|
||||
|
||||
.bottompanel {
|
||||
.bottompanel {
|
||||
height: 10%;
|
||||
}
|
||||
}
|
||||
|
||||
.bottompanel .manipulationBtns {
|
||||
.bottompanel .manipulationBtns {
|
||||
margin: 2px -27;
|
||||
right: 22%;
|
||||
width: 38%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
LEFT
|
||||
*/
|
||||
.leftpanel {
|
||||
|
||||
.leftpanel {
|
||||
width: 100px;
|
||||
background-color: #fff;
|
||||
z-index: 50;
|
||||
|
||||
-webkit-transition: left 0.3s ease-out;
|
||||
-moz-transition: left 0.3s ease-out;
|
||||
-o-transition: left 0.3s ease-out;
|
||||
-ms-transition: left 0.3s ease-out;
|
||||
transition: left 0.3s ease-out;
|
||||
}
|
||||
}
|
||||
|
||||
.hideleft {
|
||||
.hideleft {
|
||||
left: -101px;
|
||||
}
|
||||
}
|
||||
|
||||
.shadowright {
|
||||
.shadowright {
|
||||
-webkit-box-shadow: 2px 0 4px rgba(42, 42, 41, 0.6);
|
||||
box-shadow: 2px 0 4px rgba(42, 42, 41, 0.6);
|
||||
}
|
||||
}
|
||||
|
||||
.btnNew {
|
||||
.btnNew {
|
||||
margin: 5% 5% 1% 5%;
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
||||
.btnSave {
|
||||
.btnSave {
|
||||
margin-left: 9%;
|
||||
width: 75%;
|
||||
}
|
||||
}
|
||||
|
||||
.btnOops {
|
||||
.btnOops {
|
||||
margin-left: 6%;
|
||||
width: 71%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
RIGHT
|
||||
*/
|
||||
.rightpanel {
|
||||
|
||||
.rightpanel {
|
||||
width: 100px;
|
||||
background-color: #fff;
|
||||
z-index: 50;
|
||||
|
||||
-webkit-transition: right 0.3s ease-out;
|
||||
-moz-transition: right 0.3s ease-out;
|
||||
-o-transition: right 0.3s ease-out;
|
||||
-ms-transition: right 0.3s ease-out;
|
||||
transition: right 0.3s ease-out;
|
||||
}
|
||||
}
|
||||
|
||||
.hideright {
|
||||
.hideright {
|
||||
right: -101px;
|
||||
}
|
||||
}
|
||||
|
||||
.shadowleft {
|
||||
.shadowleft {
|
||||
-webkit-box-shadow: -2px 0 4px rgba(42, 42, 41, 0.6);
|
||||
box-shadow: -2px 0 4px rgba(42, 42, 41, 0.6);
|
||||
}
|
||||
}
|
||||
|
||||
.btnPrint {
|
||||
.btnPrint {
|
||||
margin: 1% 5% 5% 5%;
|
||||
width: 90%;
|
||||
}
|
||||
}
|
||||
|
||||
.btnStop {
|
||||
.btnStop {
|
||||
margin: 5% 6% 1% 5%;
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
REST
|
||||
*/
|
||||
.sidebutton {
|
||||
|
||||
.sidebutton {
|
||||
display: block;
|
||||
position: absolute; /* top: 50%;
|
||||
*/
|
||||
/* margin-top: -20px;
|
||||
*/
|
||||
top: 40px; /*float: right;
|
||||
*/
|
||||
width: 25px;
|
||||
position: absolute;
|
||||
/* top: 50%;*/
|
||||
/* margin-top: -20px;*/
|
||||
top: 40px;
|
||||
/*float:right;*/
|
||||
width: 25px;
|
||||
height: 38px;
|
||||
border: 1px solid #808;
|
||||
background: url('../img/arrows.png') no-repeat;
|
||||
background-color: #eee;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebutton:active {
|
||||
.sidebutton:active {
|
||||
background-color: #aaa;
|
||||
}
|
||||
}
|
||||
|
||||
.leftpanel .sidebutton {
|
||||
.leftpanel .sidebutton {
|
||||
right: -27px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.rightpanel .sidebutton {
|
||||
.rightpanel .sidebutton {
|
||||
left: -27px;
|
||||
background-position: -25px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebuttonin:active {
|
||||
.sidebuttonin:active {
|
||||
background-color: #888;
|
||||
}
|
||||
}
|
||||
|
||||
.leftpanel .sidebuttonin {
|
||||
.leftpanel .sidebuttonin {
|
||||
background-color: #ccc;
|
||||
background-position: -25px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.rightpanel .sidebuttonin {
|
||||
.rightpanel .sidebuttonin {
|
||||
background-color: #ccc;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
|
||||
SETTINGS POPUP -MOBILE
|
||||
SETTINGS POPUP - MOBILE
|
||||
|
||||
*/
|
||||
#contentOverlay {
|
||||
z-index: 200;
|
||||
}
|
||||
|
||||
#contentOverlay #settings {
|
||||
#contentOverlay {
|
||||
z-index: 200;
|
||||
}
|
||||
|
||||
#contentOverlay #settings {
|
||||
width: 87%;
|
||||
height: 82%;
|
||||
margin: 6% 4%;
|
||||
}
|
||||
|
||||
#contentOverlay #settings > .right {
|
||||
width: 14%;
|
||||
}
|
||||
}
|
||||
|
||||
#contentOverlay #settings > .right {
|
||||
width: 14%;
|
||||
}
|
||||
@media only screen and (min-width: 1000px) and (max-device-pixel-ratio: 1.5), only screen and (min-width: 1000px) and (-webkit-max-device-pixel-ratio: 1.5) {
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (orientation: portrait) {
|
||||
#landscape {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#portrait {
|
||||
#portrait {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.vertImage {
|
||||
.vertImage {
|
||||
margin: 0px;
|
||||
padding: 0px; /*border: 2px solid #f0f;
|
||||
*/
|
||||
max-width: 100%;
|
||||
padding: 0px;
|
||||
/*border: 2px solid #f0f;*/
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto; /* for ie9 */
|
||||
}
|
||||
|
||||
width: auto;
|
||||
/* for ie9 */
|
||||
}
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue