mirror of
https://github.com/Doodle3D/doodle3d-client.git
synced 2024-10-05 16:28:37 +02:00
overhaul of client files to 'www' dir. This dir will now as a 'bin' dir of sorts. Outside of the 'www' dir there will be old files, temp files and also shell scripts which support continuous compilation and minification of css and js files
This commit is contained in:
Adriaan Wormgoor
parent
66271c5287
commit
4ec660fd74
179
css_old/_backup20131010/d3d_btns.css
Normal file
179
css_old/_backup20131010/d3d_btns.css
Normal file
@ -0,0 +1,179 @@
|
||||
/*.logo {
|
||||
background: #f5f5f5 url('../img/logo_full.png') no-repeat left top;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
.logo {
|
||||
background: #f5f5f5 url('../img/logo_small.png') no-repeat left top;
|
||||
}
|
||||
}*/
|
||||
|
||||
/*body {*/
|
||||
/*-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 {*/
|
||||
/*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*/
|
||||
/*}*/
|
||||
|
||||
/*
|
||||
|
||||
INTERFACE BUTTONS
|
||||
|
||||
*/
|
||||
/*
|
||||
#btnNew {
|
||||
left: 10px;
|
||||
top: 10px;
|
||||
width: 194px;
|
||||
height: 170px;
|
||||
background: url('../img/buttons/btnNew.png') no-repeat;
|
||||
}
|
||||
|
||||
#btnPrevious {
|
||||
left: 20px;
|
||||
top: 180px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#btnNext {
|
||||
left: 126px;
|
||||
top: 186px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#btnSave {
|
||||
left: 20px;
|
||||
top: 240px;
|
||||
}
|
||||
|
||||
#btnOops {
|
||||
left: 20px;
|
||||
top: 450px;
|
||||
width: 146px;
|
||||
height: 144px;
|
||||
background: url('../img/buttons/btnOops.png') no-repeat;
|
||||
}
|
||||
*/
|
||||
|
||||
/*
|
||||
#btnPrint {
|
||||
right: 15px;
|
||||
top: 15px;
|
||||
}
|
||||
|
||||
#btnStop {
|
||||
right: 20px;
|
||||
top: 200px;
|
||||
}
|
||||
|
||||
#btnInfo {
|
||||
right: 25px;
|
||||
bottom: 90px;
|
||||
}
|
||||
|
||||
#btnSettings {
|
||||
right: 25px;
|
||||
bottom: 20px;
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
|
||||
/*
|
||||
|
||||
DRAW AREA
|
||||
|
||||
*/
|
||||
|
||||
|
||||
/*#drawAreaContainer > .manipulationBtns {*/
|
||||
/*
|
||||
.drawareacontainer > .manipulationBtns {
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.manipulationBtn {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#btnsUpDown {
|
||||
position: absolute;
|
||||
right: 200px;
|
||||
bottom: -75px;
|
||||
}
|
||||
#btnsUpDown > div {
|
||||
float: left;
|
||||
padding-right: 8px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
#btnsTurnLeftRight {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
bottom: -75px;
|
||||
}
|
||||
#btnsTurnLeftRight >div {
|
||||
float: left;
|
||||
padding-right: 8px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
#btnMoveUp {
|
||||
width: 65px;
|
||||
height: 61px;
|
||||
background: url('../img/buttons/btnUp.png');
|
||||
}
|
||||
|
||||
#btnMoveDown {
|
||||
width: 64px;
|
||||
height: 63px;
|
||||
background: url('../img/buttons/btnDown.png');
|
||||
}
|
||||
|
||||
#btnTwistLeft {
|
||||
width: 59px;
|
||||
height: 61px;
|
||||
background: url('../img/buttons/btnTurnLeft.png');
|
||||
}
|
||||
|
||||
#btnTwistRight {
|
||||
width: 64px;
|
||||
height: 56px;
|
||||
background: url('../img/buttons/btnTurnRight.png');
|
||||
}
|
||||
*/
|
||||
|
||||
/*
|
||||
#displayTemp {
|
||||
position: absolute;
|
||||
right: 55px;
|
||||
top: 334px;
|
||||
font-weight: bold;
|
||||
background: white;
|
||||
display:none;
|
||||
}
|
||||
*/
|
||||
|
||||
/*
|
||||
.disabled {
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
#btnStop.disabled {
|
||||
display: none;
|
||||
}
|
||||
*/
|
||||
93
css_old/_backup20131010/fixedPosInterface.css
Normal file
93
css_old/_backup20131010/fixedPosInterface.css
Normal file
@ -0,0 +1,93 @@
|
||||
/*
|
||||
#drawAreaContainer {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
background-color: #fff;
|
||||
width: 65%;
|
||||
min-width: 500px;
|
||||
max-width: 650px;
|
||||
height: 60%;
|
||||
min-height: 150px;
|
||||
max-height: 450px;
|
||||
border: 4px solid #000;
|
||||
border-radius: 15px;
|
||||
overflow: hidden;
|
||||
z-index: 15;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#canvasContainers {
|
||||
display:table;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#mycanvasContainer {
|
||||
display:table-cell;
|
||||
width: auto;
|
||||
height: 100%;
|
||||
}
|
||||
#mycanvas {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border-right: 2px solid #333;
|
||||
}
|
||||
|
||||
#previewContainer {
|
||||
display:table-cell;
|
||||
width: 150px;
|
||||
height: 100%;
|
||||
}
|
||||
#preview {
|
||||
width: 150px;
|
||||
height: 100%;
|
||||
float: right;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
*/
|
||||
|
||||
/* DEBUG THING */
|
||||
/*
|
||||
#preview_tmp {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 500;
|
||||
border: 1px solid #f80;
|
||||
display: none;
|
||||
}
|
||||
*/
|
||||
|
||||
/*
|
||||
|
||||
Buttons and logo's
|
||||
|
||||
*/
|
||||
/*
|
||||
.button {
|
||||
display: table;
|
||||
}
|
||||
*/
|
||||
|
||||
/*#d3dlogo {*/
|
||||
/*position: absolute;*/
|
||||
/*top: 15px;*/
|
||||
/*left: 31%;*/
|
||||
/*width: 399px;*/
|
||||
/*height: 139px;*/
|
||||
/*background-image: url('../img/logo_full.png');*/
|
||||
/*cursor: pointer;*/
|
||||
/*}*/
|
||||
|
||||
|
||||
74
css_old/_backup20131010/settingsPopup.css
Normal file
74
css_old/_backup20131010/settingsPopup.css
Normal file
@ -0,0 +1,74 @@
|
||||
#contentOverlay {
|
||||
background-color: rgba(255, 255, 255, 0.65);
|
||||
z-index: 20;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display:none;
|
||||
}
|
||||
#settings {
|
||||
background-color: #fff;
|
||||
z-index: 15;
|
||||
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 835px;
|
||||
height: 500px;
|
||||
margin: -250px 0 0 -417.5px;
|
||||
/*padding: 25px;*/
|
||||
|
||||
/*overflow: scroll;*/
|
||||
/*overflow-y: hidden;*/
|
||||
-moz-box-shadow: 0px 2px 6px 0px rgba(16, 16, 16, 0.65);
|
||||
-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;
|
||||
border-radius: 15px;
|
||||
-moz-border-radius: 15px;
|
||||
-webkit-border-radius: 15px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#settings header {
|
||||
margin: 25px 25px 0 25px;
|
||||
height: 44px;
|
||||
}
|
||||
|
||||
div.content {
|
||||
margin: 15px 25px 25px 25px;
|
||||
height: 388px;
|
||||
display: table;
|
||||
}
|
||||
|
||||
div.content > div {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
div.content > div.settings {
|
||||
border: 1px solid rgb(187, 187, 187);
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
|
||||
width: 660px;
|
||||
overflow: scroll;
|
||||
max-height: 368px;
|
||||
overflow-x: hidden;
|
||||
padding: 10px 10px 10px 10px;
|
||||
}
|
||||
div.content > div.manipulationBtns {
|
||||
display: table-cell;
|
||||
vertical-align: bottom;
|
||||
width: 125px;
|
||||
|
||||
}
|
||||
|
||||
div.content .btnOK {
|
||||
width: 85px;
|
||||
height: 86px;
|
||||
background: url('../img/buttons/btnOk_settings.png') no-repeat;
|
||||
margin: 0 0 0 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
329
css_old/_backup20131011/fixedPosInterface.css
Normal file
329
css_old/_backup20131011/fixedPosInterface.css
Normal file
@ -0,0 +1,329 @@
|
||||
body {
|
||||
/* This chops off any overhanging divs */
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: table;
|
||||
}
|
||||
|
||||
/*#landscape {*/
|
||||
/*position:relative;*/
|
||||
/*width: 1024px;*/
|
||||
/*max-height: 768px;*/
|
||||
/*background-color: #808;*/
|
||||
/*border: 10px solid #ff0;*/
|
||||
/*margin: 0px auto;*/
|
||||
/*}*/
|
||||
|
||||
|
||||
#verticalShapes {
|
||||
position:absolute;
|
||||
right: -56px;
|
||||
bottom: 15px;
|
||||
/*background-color: #fff;*/
|
||||
}
|
||||
|
||||
.verticalshape {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 2px solid #333;
|
||||
border-radius: 0px 5px 5px 0px;
|
||||
margin-top: 4px;
|
||||
/*background-color: #f0f;*/
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.straight {
|
||||
background: url('../img/vertical_shape_icons/straight.png') no-repeat;
|
||||
}
|
||||
.diverging {
|
||||
background: url('../img/vertical_shape_icons/diverging.png') no-repeat;
|
||||
}
|
||||
.converging {
|
||||
background: url('../img/vertical_shape_icons/converging.png') no-repeat;
|
||||
}
|
||||
.sinus {
|
||||
background: url('../img/vertical_shape_icons/sinus.png') no-repeat;
|
||||
}
|
||||
|
||||
|
||||
/* Portrait */
|
||||
@media screen and (orientation:portrait) {
|
||||
body {
|
||||
/* background-color: #08F;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: none;
|
||||
}
|
||||
#portrait {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
/* Landscape */
|
||||
@media screen and (orientation:landscape) {
|
||||
body {
|
||||
/* background-color: #8F0;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: block;
|
||||
}
|
||||
#portrait {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.uiButtonsContainer {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 1024px;
|
||||
min-height: 500px;
|
||||
max-height: 768px;
|
||||
height: 100%;
|
||||
/* height: 768px;*/
|
||||
}
|
||||
.uiButtonsContainer:before {
|
||||
content:' ';
|
||||
display:block;
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:0;
|
||||
right:0;
|
||||
bottom:0;
|
||||
border: 2px solid #333;
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 31%;
|
||||
width: 399px;
|
||||
height: 139px;
|
||||
background-image: url('../img/logo_full.png');
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
position: absolute;
|
||||
top: 193px;
|
||||
left: 193px;
|
||||
width: 650px;
|
||||
height: 450px;
|
||||
background-color: #fff;
|
||||
border: 4px solid #000;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
#preview_tmp {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 500;
|
||||
border: 1px solid #f80;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mycanvas, #preview {
|
||||
/*border: 1px solid #08c;*/
|
||||
float: left;
|
||||
}
|
||||
|
||||
#mycanvas {
|
||||
width: 500px;
|
||||
height: 450px;
|
||||
border: 0px solid #333;
|
||||
border-right: 2px solid #333;
|
||||
}
|
||||
|
||||
#preview {
|
||||
/*border: 1px solid #f8c;*/
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 150px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.vertImage {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
/*border: 2px solid #f0f;*/
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto; /* for ie9 */
|
||||
}
|
||||
|
||||
|
||||
.bgTop {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgMiddle {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgBottom {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
|
||||
/* PRINT PROGRESS DISPLAY */
|
||||
#printProgressContainer {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: 370px;
|
||||
width: 110px;
|
||||
margin: 5px 0px;
|
||||
font-weight: bold;
|
||||
display:none;
|
||||
}
|
||||
#progressbarContainer {
|
||||
margin: 3px 0px;
|
||||
width: inherit;
|
||||
height: 20px;
|
||||
background-color: #fff;
|
||||
border: 2px solid #333;
|
||||
border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
}
|
||||
.progressAmount {
|
||||
margin: 0px 5px;
|
||||
}
|
||||
#progressbar {
|
||||
position: relative;
|
||||
/*margin-bottom: -20px;*/
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #4c4;
|
||||
border: 0px solid #f0f;
|
||||
border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
}
|
||||
|
||||
/* THERMOMETER */
|
||||
#thermometerContainer {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 360px;
|
||||
}
|
||||
#thermometerCanvas {
|
||||
/*background: #59b2b8;*/
|
||||
/*zoom: 2;*/
|
||||
}
|
||||
|
||||
|
||||
/* The code below is for resizing UI elements as the viewport becomes less high (suitable for tablets & smartphones) */
|
||||
|
||||
@media screen and (max-height: 675px) {
|
||||
.bgMiddle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 74px;
|
||||
background-image: url('../img/logo_small.png');
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(0px,-5px) scale(.94);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-5px) scale(.94);
|
||||
/*-moz-transform: translate(-3px,-3px);*/
|
||||
}
|
||||
#btnOops {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-10px) scale(0.94);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
-moz-transform: translate(5px,-5px);
|
||||
}
|
||||
|
||||
|
||||
.btn {
|
||||
zoom: 0.94;
|
||||
-moz-transform: scale(.94);
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
top: 128px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 560px) {
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 57px;
|
||||
background-image: url('../img/logo_smaller_wide.png');
|
||||
margin-top: 14px;
|
||||
/*zoom: 0.8;*/
|
||||
/*-moz-transform: translate(-20px,-15px) scale(.8);*/
|
||||
/*-moz-transform: ;*/
|
||||
/*left: 34%;*/
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(0px,-7px) scale(0.86);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 6px;
|
||||
-moz-transform: translate(10px,-10px);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(-10px,-10px) scale(.86);
|
||||
}
|
||||
|
||||
.btn {
|
||||
zoom: 0.86;
|
||||
-moz-transform: scale(.86);
|
||||
}
|
||||
|
||||
#btnOops {
|
||||
top: 350px;
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(-10px,-25px) scale(.86);
|
||||
}
|
||||
#btnSave {
|
||||
-moz-transform: translate(-5px,-13px);
|
||||
}
|
||||
|
||||
#btnPrevious, #btnNext {
|
||||
/*top: 200px;*/
|
||||
-moz-transform: translate(-5px,-10px);
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
top: 110px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
329
css_old/_backup20131011/fixedPosInterface.css.BACKUP.99789.css
Normal file
329
css_old/_backup20131011/fixedPosInterface.css.BACKUP.99789.css
Normal file
@ -0,0 +1,329 @@
|
||||
body {
|
||||
/* This chops off any overhanging divs */
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: table;
|
||||
}
|
||||
|
||||
/*#landscape {*/
|
||||
/*position:relative;*/
|
||||
/*width: 1024px;*/
|
||||
/*max-height: 768px;*/
|
||||
/*background-color: #808;*/
|
||||
/*border: 10px solid #ff0;*/
|
||||
/*margin: 0px auto;*/
|
||||
/*}*/
|
||||
|
||||
|
||||
#verticalShapes {
|
||||
position:absolute;
|
||||
right: -56px;
|
||||
bottom: 15px;
|
||||
/*background-color: #fff;*/
|
||||
}
|
||||
|
||||
.verticalshape {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 2px solid #333;
|
||||
border-radius: 0px 5px 5px 0px;
|
||||
margin-top: 4px;
|
||||
/*background-color: #f0f;*/
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.straight {
|
||||
background: url('../img/vertical_shape_icons/straight.png') no-repeat;
|
||||
}
|
||||
.diverging {
|
||||
background: url('../img/vertical_shape_icons/diverging.png') no-repeat;
|
||||
}
|
||||
.converging {
|
||||
background: url('../img/vertical_shape_icons/converging.png') no-repeat;
|
||||
}
|
||||
.sinus {
|
||||
background: url('../img/vertical_shape_icons/sinus.png') no-repeat;
|
||||
}
|
||||
|
||||
|
||||
/* Portrait */
|
||||
@media screen and (orientation:portrait) {
|
||||
body {
|
||||
/* background-color: #08F;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: none;
|
||||
}
|
||||
#portrait {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
/* Landscape */
|
||||
@media screen and (orientation:landscape) {
|
||||
body {
|
||||
/* background-color: #8F0;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: block;
|
||||
}
|
||||
#portrait {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.uiButtonsContainer {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 1024px;
|
||||
min-height: 500px;
|
||||
max-height: 768px;
|
||||
height: 100%;
|
||||
/* height: 768px;*/
|
||||
}
|
||||
.uiButtonsContainer:before {
|
||||
content:' ';
|
||||
display:block;
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:0;
|
||||
right:0;
|
||||
bottom:0;
|
||||
border: 2px solid #333;
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 31%;
|
||||
width: 399px;
|
||||
height: 139px;
|
||||
background-image: url('../img/logo_full.png');
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
position: absolute;
|
||||
top: 193px;
|
||||
left: 193px;
|
||||
width: 650px;
|
||||
height: 450px;
|
||||
background-color: #fff;
|
||||
border: 4px solid #000;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
#preview_tmp {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 500;
|
||||
border: 1px solid #f80;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mycanvas, #preview {
|
||||
/*border: 1px solid #08c;*/
|
||||
float: left;
|
||||
}
|
||||
|
||||
#mycanvas {
|
||||
width: 500px;
|
||||
height: 450px;
|
||||
border: 0px solid #333;
|
||||
border-right: 2px solid #333;
|
||||
}
|
||||
|
||||
#preview {
|
||||
/*border: 1px solid #f8c;*/
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 150px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.vertImage {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
/*border: 2px solid #f0f;*/
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto; /* for ie9 */
|
||||
}
|
||||
|
||||
|
||||
.bgTop {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgMiddle {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgBottom {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
|
||||
/* PRINT PROGRESS DISPLAY */
|
||||
#printProgressContainer {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: 370px;
|
||||
width: 110px;
|
||||
margin: 5px 0px;
|
||||
font-weight: bold;
|
||||
display:none;
|
||||
}
|
||||
#progressbarContainer {
|
||||
margin: 3px 0px;
|
||||
width: inherit;
|
||||
height: 20px;
|
||||
background-color: #fff;
|
||||
border: 2px solid #333;
|
||||
border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
}
|
||||
.progressAmount {
|
||||
margin: 0px 5px;
|
||||
}
|
||||
#progressbar {
|
||||
position: relative;
|
||||
/*margin-bottom: -20px;*/
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #4c4;
|
||||
border: 0px solid #f0f;
|
||||
border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
}
|
||||
|
||||
/* THERMOMETER */
|
||||
#thermometerContainer {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 360px;
|
||||
}
|
||||
#thermometerCanvas {
|
||||
/*background: #59b2b8;*/
|
||||
/*zoom: 2;*/
|
||||
}
|
||||
|
||||
|
||||
/* The code below is for resizing UI elements as the viewport becomes less high (suitable for tablets & smartphones) */
|
||||
|
||||
@media screen and (max-height: 675px) {
|
||||
.bgMiddle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 74px;
|
||||
background-image: url('../img/logo_small.png');
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(0px,-5px) scale(.94);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-5px) scale(.94);
|
||||
/*-moz-transform: translate(-3px,-3px);*/
|
||||
}
|
||||
#btnOops {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-10px) scale(0.94);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
-moz-transform: translate(5px,-5px);
|
||||
}
|
||||
|
||||
|
||||
.btn {
|
||||
zoom: 0.94;
|
||||
-moz-transform: scale(.94);
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
top: 128px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 560px) {
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 57px;
|
||||
background-image: url('../img/logo_smaller_wide.png');
|
||||
margin-top: 14px;
|
||||
/*zoom: 0.8;*/
|
||||
/*-moz-transform: translate(-20px,-15px) scale(.8);*/
|
||||
/*-moz-transform: ;*/
|
||||
/*left: 34%;*/
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(0px,-7px) scale(0.86);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 6px;
|
||||
-moz-transform: translate(10px,-10px);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(-10px,-10px) scale(.86);
|
||||
}
|
||||
|
||||
.btn {
|
||||
zoom: 0.86;
|
||||
-moz-transform: scale(.86);
|
||||
}
|
||||
|
||||
#btnOops {
|
||||
top: 350px;
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(-10px,-25px) scale(.86);
|
||||
}
|
||||
#btnSave {
|
||||
-moz-transform: translate(-5px,-13px);
|
||||
}
|
||||
|
||||
#btnPrevious, #btnNext {
|
||||
/*top: 200px;*/
|
||||
-moz-transform: translate(-5px,-10px);
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
top: 110px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
323
css_old/_backup20131011/fixedPosInterface.css.BASE.99789.css
Normal file
323
css_old/_backup20131011/fixedPosInterface.css.BASE.99789.css
Normal file
@ -0,0 +1,323 @@
|
||||
body {
|
||||
/* This chops off any overhanging divs */
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
|
||||
.button {
|
||||
display: table;
|
||||
}
|
||||
|
||||
/*.big {*/
|
||||
/*background: #a6e19c;*/
|
||||
/*border: 1px solid #222;*/
|
||||
/*height: 64px;*/
|
||||
/*width: 64px;*/
|
||||
/*display: table-cell;*/
|
||||
/*vertical-align: middle;*/
|
||||
/*text-align: center;*/
|
||||
/*border-radius: 32px;*/
|
||||
/*-moz-border-radius: 32px;*/
|
||||
/*-webkit-border-radius: 32px;*/
|
||||
/*}*/
|
||||
/*.small {*/
|
||||
/*background: #a3d5f7;*/
|
||||
/*border: 1px solid #222;*/
|
||||
/*height: 40px;*/
|
||||
/*width: 40px;*/
|
||||
/*display: table-cell;*/
|
||||
/*vertical-align: middle;*/
|
||||
/*text-align: center;*/
|
||||
/*border-radius: 20px;*/
|
||||
/*-moz-border-radius: 20px;*/
|
||||
/*-webkit-border-radius: 20px;*/
|
||||
/*}*/
|
||||
|
||||
#logo {
|
||||
position: absolute;
|
||||
/*left: 50%;*/
|
||||
/*margin-left: -220px;*/
|
||||
top: 20px;
|
||||
left: 315px;
|
||||
width: 400px;
|
||||
height: 140px;
|
||||
}
|
||||
|
||||
/*ha {*/
|
||||
/*background: #f5f5f5 url('../images/bg.jpg') no-repeat;*/
|
||||
/*}*/
|
||||
|
||||
/* Portrait */
|
||||
@media screen and (orientation:portrait) {
|
||||
body {
|
||||
/* background-color: #08F;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: none;
|
||||
}
|
||||
#portrait {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
/* Landscape */
|
||||
@media screen and (orientation:landscape) {
|
||||
body {
|
||||
/* background-color: #8F0;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: block;
|
||||
}
|
||||
#portrait {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
border: 2px solid #333;
|
||||
width: 1024px;
|
||||
min-height: 500px;
|
||||
max-height: 768px;
|
||||
height: 100%;
|
||||
/* height: 768px;*/
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 31%;
|
||||
width: 399px;
|
||||
height: 139px;
|
||||
background-image: url('../img/logo_full.png');
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#svg {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
position: absolute;
|
||||
top: 193px;
|
||||
left: 193px;
|
||||
width: 650px;
|
||||
height: 450px;
|
||||
background-color: #fff;
|
||||
border: 4px solid #000;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
#preview_tmp {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 500;
|
||||
border: 1px solid #f80;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mycanvas, #preview {
|
||||
/*border: 1px solid #08c;*/
|
||||
float: left;
|
||||
}
|
||||
|
||||
#mycanvas {
|
||||
width: 500px;
|
||||
height: 450px;
|
||||
border: 0px solid #333;
|
||||
border-right: 2px solid #333;
|
||||
}
|
||||
|
||||
#preview {
|
||||
/*border: 1px solid #f8c;*/
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 150px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.vertImage {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
/*border: 2px solid #f0f;*/
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto; /* for ie9 */
|
||||
}
|
||||
|
||||
|
||||
.bgTop {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgMiddle {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgBottom {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
|
||||
/* PRINT PROGRESS DISPLAY */
|
||||
#printProgressContainer {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: 370px;
|
||||
width: 110px;
|
||||
margin: 5px 0px;
|
||||
font-weight: bold;
|
||||
display:none;
|
||||
}
|
||||
#progressbarContainer {
|
||||
margin: 3px 0px;
|
||||
width: inherit;
|
||||
height: 20px;
|
||||
background-color: #fff;
|
||||
border: 2px solid #333;
|
||||
border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
}
|
||||
.progressAmount {
|
||||
margin: 0px 5px;
|
||||
}
|
||||
#progressbar {
|
||||
position: relative;
|
||||
/*margin-bottom: -20px;*/
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #4c4;
|
||||
border: 0px solid #f0f;
|
||||
border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
}
|
||||
|
||||
/* THERMOMETER */
|
||||
#thermometerContainer {
|
||||
position: absolute;
|
||||
right: 25px;
|
||||
top: 370px;
|
||||
}
|
||||
#thermometerCanvas {
|
||||
/*background: #59b2b8;*/
|
||||
/*zoom: 2;*/
|
||||
}
|
||||
|
||||
|
||||
/* The code below is for resizing UI elements as the viewport becomes less high (suitable for tablets & smartphones) */
|
||||
|
||||
@media screen and (max-height: 675px) {
|
||||
.bgMiddle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 74px;
|
||||
background-image: url('../img/logo_small.png');
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(0px,-5px) scale(.94);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-5px) scale(.94);
|
||||
/*-moz-transform: translate(-3px,-3px);*/
|
||||
}
|
||||
#btnOops {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-10px) scale(0.94);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
-moz-transform: translate(5px,-5px);
|
||||
}
|
||||
|
||||
|
||||
.btn {
|
||||
zoom: 0.94;
|
||||
-moz-transform: scale(.94);
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
top: 128px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 560px) {
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 57px;
|
||||
background-image: url('../img/logo_smaller_wide.png');
|
||||
margin-top: 14px;
|
||||
/*zoom: 0.8;*/
|
||||
/*-moz-transform: translate(-20px,-15px) scale(.8);*/
|
||||
/*-moz-transform: ;*/
|
||||
/*left: 34%;*/
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(0px,-7px) scale(0.86);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 6px;
|
||||
-moz-transform: translate(10px,-10px);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(-10px,-10px) scale(.86);
|
||||
}
|
||||
|
||||
.btn {
|
||||
zoom: 0.86;
|
||||
-moz-transform: scale(.86);
|
||||
}
|
||||
|
||||
#btnOops {
|
||||
top: 350px;
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(-10px,-25px) scale(.86);
|
||||
}
|
||||
#btnSave {
|
||||
-moz-transform: translate(-5px,-13px);
|
||||
}
|
||||
|
||||
#btnPrevious, #btnNext {
|
||||
/*top: 200px;*/
|
||||
-moz-transform: translate(-5px,-10px);
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
top: 110px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
329
css_old/_backup20131011/fixedPosInterface.css.LOCAL.99789.css
Normal file
329
css_old/_backup20131011/fixedPosInterface.css.LOCAL.99789.css
Normal file
@ -0,0 +1,329 @@
|
||||
body {
|
||||
/* This chops off any overhanging divs */
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: table;
|
||||
}
|
||||
|
||||
/*#landscape {*/
|
||||
/*position:relative;*/
|
||||
/*width: 1024px;*/
|
||||
/*max-height: 768px;*/
|
||||
/*background-color: #808;*/
|
||||
/*border: 10px solid #ff0;*/
|
||||
/*margin: 0px auto;*/
|
||||
/*}*/
|
||||
|
||||
|
||||
#verticalShapes {
|
||||
position:absolute;
|
||||
right: -56px;
|
||||
bottom: 15px;
|
||||
/*background-color: #fff;*/
|
||||
}
|
||||
|
||||
.verticalshape {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 2px solid #333;
|
||||
border-radius: 0px 5px 5px 0px;
|
||||
margin-top: 4px;
|
||||
/*background-color: #f0f;*/
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.straight {
|
||||
background: url('../img/vertical_shape_icons/straight.png') no-repeat;
|
||||
}
|
||||
.diverging {
|
||||
background: url('../img/vertical_shape_icons/diverging.png') no-repeat;
|
||||
}
|
||||
.converging {
|
||||
background: url('../img/vertical_shape_icons/converging.png') no-repeat;
|
||||
}
|
||||
.sinus {
|
||||
background: url('../img/vertical_shape_icons/sinus.png') no-repeat;
|
||||
}
|
||||
|
||||
|
||||
/* Portrait */
|
||||
@media screen and (orientation:portrait) {
|
||||
body {
|
||||
/* background-color: #08F;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: none;
|
||||
}
|
||||
#portrait {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
/* Landscape */
|
||||
@media screen and (orientation:landscape) {
|
||||
body {
|
||||
/* background-color: #8F0;*/
|
||||
}
|
||||
|
||||
#landscape {
|
||||
display: block;
|
||||
}
|
||||
#portrait {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.uiButtonsContainer {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 1024px;
|
||||
min-height: 500px;
|
||||
max-height: 768px;
|
||||
height: 100%;
|
||||
/* height: 768px;*/
|
||||
}
|
||||
.uiButtonsContainer:before {
|
||||
content:' ';
|
||||
display:block;
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:0;
|
||||
right:0;
|
||||
bottom:0;
|
||||
border: 2px solid #333;
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
left: 31%;
|
||||
width: 399px;
|
||||
height: 139px;
|
||||
background-image: url('../img/logo_full.png');
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
position: absolute;
|
||||
top: 193px;
|
||||
left: 193px;
|
||||
width: 650px;
|
||||
height: 450px;
|
||||
background-color: #fff;
|
||||
border: 4px solid #000;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
#preview_tmp {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 500;
|
||||
border: 1px solid #f80;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mycanvas, #preview {
|
||||
/*border: 1px solid #08c;*/
|
||||
float: left;
|
||||
}
|
||||
|
||||
#mycanvas {
|
||||
width: 500px;
|
||||
height: 450px;
|
||||
border: 0px solid #333;
|
||||
border-right: 2px solid #333;
|
||||
}
|
||||
|
||||
#preview {
|
||||
/*border: 1px solid #f8c;*/
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
width: 150px;
|
||||
height: 450px;
|
||||
}
|
||||
|
||||
.vertImage {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
/*border: 2px solid #f0f;*/
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
width: auto; /* for ie9 */
|
||||
}
|
||||
|
||||
|
||||
.bgTop {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgMiddle {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
.bgBottom {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
z-index: -5;
|
||||
}
|
||||
|
||||
/* PRINT PROGRESS DISPLAY */
|
||||
#printProgressContainer {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: 370px;
|
||||
width: 110px;
|
||||
margin: 5px 0px;
|
||||
font-weight: bold;
|
||||
display:none;
|
||||
}
|
||||
#progressbarContainer {
|
||||
margin: 3px 0px;
|
||||
width: inherit;
|
||||
height: 20px;
|
||||
background-color: #fff;
|
||||
border: 2px solid #333;
|
||||
border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
}
|
||||
.progressAmount {
|
||||
margin: 0px 5px;
|
||||
}
|
||||
#progressbar {
|
||||
position: relative;
|
||||
/*margin-bottom: -20px;*/
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #4c4;
|
||||
border: 0px solid #f0f;
|
||||
border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
}
|
||||
|
||||
/* THERMOMETER */
|
||||
#thermometerContainer {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 360px;
|
||||
}
|
||||
#thermometerCanvas {
|
||||
/*background: #59b2b8;*/
|
||||
/*zoom: 2;*/
|
||||
}
|
||||
|
||||
|
||||
/* The code below is for resizing UI elements as the viewport becomes less high (suitable for tablets & smartphones) */
|
||||
|
||||
@media screen and (max-height: 675px) {
|
||||
.bgMiddle {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 74px;
|
||||
background-image: url('../img/logo_small.png');
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(0px,-5px) scale(.94);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-5px) scale(.94);
|
||||
/*-moz-transform: translate(-3px,-3px);*/
|
||||
}
|
||||
#btnOops {
|
||||
zoom: 0.94;
|
||||
-moz-transform: translate(-5px,-10px) scale(0.94);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
-moz-transform: translate(5px,-5px);
|
||||
}
|
||||
|
||||
|
||||
.btn {
|
||||
zoom: 0.94;
|
||||
-moz-transform: scale(.94);
|
||||
}
|
||||
|
||||
#drawAreaContainer {
|
||||
top: 128px;
|
||||
height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-height: 560px) {
|
||||
#d3dlogo {
|
||||
width: 399px;
|
||||
height: 57px;
|
||||
background-image: url('../img/logo_smaller_wide.png');
|
||||
margin-top: 14px;
|
||||
/*zoom: 0.8;*/
|
||||
/*-moz-transform: translate(-20px,-15px) scale(.8);*/
|
||||
/*-moz-transform: ;*/
|
||||
/*left: 34%;*/
|
||||
}
|
||||
|
||||
#btnsUpDown, #btnsTurnLeftRight {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(0px,-7px) scale(0.86);
|
||||
}
|
||||
|
||||
#btnPrint {
|
||||
right: 6px;
|
||||
-moz-transform: translate(10px,-10px);
|
||||
}
|
||||
|
||||
#btnNew {
|
||||
zoom: 0.86;
|
||||
-moz-transform: translate(-10px,-10px) scale(.86);
|
||||
}
|
||||
|
||||
.btn {
|
||||
zoom: 0.86;
|
||||
-moz-transform: scale(.86);
|
||||
}
|
||||
|
||||
#btnOops {
|
||||
top: 350px;
|
||||
zoom: 0.86;
|
||||