IWMBrowser/iwmlib
IWMBrowser
/
iwmlib
4
0
Fork 0
Code Issues 6 Pull Requests Releases Wiki Activity

Fixed some linter problems.

This commit is contained in:
Sebastian Kupke 2019-07-05 08:43:23 +02:00
parent 22b0ceaff7
commit fc6b30f03c
4 changed files with 79 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
css/doctest.css
View File

@ -1,12 +1,11 @@
html html {
{ padding: 0;
padding: 0px; font-size: 16px;
font-size: 16px; background: white;
background: white; font-family: Arial, sans-serif;
font-family: Arial,sans-serif; color: #000;
color: #000; max-width: 932px;
max-width: 932px; margin: 0 auto;
margin:0 auto;
} }
.grayBorder { .grayBorder {
@ -24,10 +23,10 @@ html
} }
.unselectable { .unselectable {
-moz-user-select: none; -moz-user-select: none;
-webkit-user-select: none; -webkit-user-select: none;
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
} }
body { body {
@ -44,28 +43,27 @@ canvas {
margin-left: 8px; margin-left: 8px;
} }
.intrinsic-container { .intrinsic-container {
position: relative; position: relative;
height: 0; height: 0;
overflow: hidden; overflow: hidden;
} }
/* 16x9 Aspect Ratio */ /* 16x9 Aspect Ratio */
.intrinsic-container-16x9 { .intrinsic-container-16x9 {
padding-bottom: 56.25%; padding-bottom: 56.25%;
} }
/* 4x3 Aspect Ratio */ /* 4x3 Aspect Ratio */
.intrinsic-container-4x3 { .intrinsic-container-4x3 {
padding-bottom: 75%; padding-bottom: 75%;
} }
.intrinsic-container iframe { .intrinsic-container iframe {
position: absolute; position: absolute;
border: 0; border: 0;
top:0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }

32
css/flipeffect.css
View File

@ -1,6 +1,5 @@
.flipWrapper .flipWrapper {
{
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@ -16,7 +15,8 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
/*** See: https://stackoverflow.com/questions/7439042/css-js-to-prevent-dragging-of-ghost-image ***/ /*** See: https://stackoverflow.com/questions/7439042/css-js-to-prevent-dragging-of-ghost-image ***/
/* -webkit-user-drag: none; /* -webkit-user-drag: none;
-khtml-user-drag: none; -khtml-user-drag: none;
-moz-user-drag: none; -moz-user-drag: none;
@ -24,21 +24,21 @@
user-drag: none; */ user-drag: none; */
} }
.flipFace{ .flipFace {
box-shadow: 2px 2px 10px #000; box-shadow: 2px 2px 10px #000;
visibility: hidden; visibility: hidden;
} }
.front{ .front {
width: 100%; width: 100%;
height: 100%; height: 100%;
position:absolute; position: absolute;
background-color:#333; background-color: #333;
} }
.back{ .back {
background-color:#333; background-color: #333;
position:absolute; position: absolute;
border: 8px solid white; border: 8px solid white;
} }
@ -48,8 +48,8 @@
width: 44px; width: 44px;
height: 44px; height: 44px;
padding: 4px; padding: 4px;
right: 0px; right: 0;
top: 0px; top: 0;
} }
.infoBtn { .infoBtn {
@ -58,8 +58,8 @@
width: 44px; width: 44px;
height: 44px; height: 44px;
padding: 4px; padding: 4px;
right: 0px; right: 0;
bottom: 0px; bottom: 0;
} }
.backBtn { .backBtn {
@ -68,6 +68,6 @@
width: 44px; width: 44px;
height: 44px; height: 44px;
padding: 4px; padding: 4px;
right: 0px; right: 0;
bottom: 0px; bottom: 0;
} }

86
css/index.css
View File

@ -1,19 +1,18 @@
html { html {
height: 100%; height: 100%;
width: 100%; width: 100%;
margin: 0px; margin: 0;
} }
body body {
{ margin: 0;
margin: 0px; padding: 0;
padding: 0px;
width: 100%; width: 100%;
height: 100%; height: 100%;
font-family: sans-serif; font-family: sans-serif;
font-size: 22pt; font-size: 22pt;
-webkit-tap-highlight-color: #ccc; -webkit-tap-highlight-color: #ccc;
background-color: #DDD; background-color: #ddd;
-webkit-user-select: none; -webkit-user-select: none;
-khtml-user-select: none; -khtml-user-select: none;
-moz-user-select: none; -moz-user-select: none;
@ -22,24 +21,22 @@ body
user-select: none; user-select: none;
-webkit-hyphens: auto; -webkit-hyphens: auto;
hyphens: auto; hyphens: auto;
/* https://davidwalsh.name/font-smoothing */ /* https://davidwalsh.name/font-smoothing */
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
h3 h3 {
{
color: white; color: white;
padding: 4px; padding: 4px;
margin: 2px; margin: 2px;
background-color: rgba(0, 0, 15, .5); background-color: rgba(0, 0, 15, 0.5);
} }
a { text-decoration: none; } a { text-decoration: none; }
div.wrapper div.wrapper {
{
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -49,29 +46,32 @@ div.wrapper
/* Color animation from https://www.tjvantoll.com/2012/02/20/css3-color-animations/ */ /* Color animation from https://www.tjvantoll.com/2012/02/20/css3-color-animations/ */
@-webkit-keyframes color_change { @-webkit-keyframes color_change {
from { background-color: rgba(0, 0, 0, 0); } from { background-color: rgba(0, 0, 0, 0); }
to { background-color: red; } to { background-color: red; }
} }
@-moz-keyframes color_change { @-moz-keyframes color_change {
from { background-color: rgba(0, 0, 0, 0); } from { background-color: rgba(0, 0, 0, 0); }
to { background-color: red; } to { background-color: red; }
} }
@-ms-keyframes color_change { @-ms-keyframes color_change {
from { background-color: rgba(0, 0, 0, 0); } from { background-color: rgba(0, 0, 0, 0); }
to { background-color: red; } to { background-color: red; }
} }
@-o-keyframes color_change { @-o-keyframes color_change {
from { background-color: rgba(0, 0, 0, 0); } from { background-color: rgba(0, 0, 0, 0); }
to { background-color: red; } to { background-color: red; }
} }
@keyframes color_change { @keyframes color_change {
from { background-color:rgba(0, 0, 0, 0); } from { background-color: rgba(0, 0, 0, 0); }
to { background-color: red; } to { background-color: red; }
} }
/*** CSS taken from https://medium.com/@jamesfuthey/simulating-the-creation-of-website-thumbnail-screenshots-using-iframes-7145269891db#.7v7fshos5 ***/ /*** CSS taken from https://medium.com/@jamesfuthey/simulating-the-creation-of-website-thumbnail-screenshots-using-iframes-7145269891db#.7v7fshos5 ***/
.thumbnail .thumbnail {
{
position: relative; position: relative;
-ms-zoom: 0.25; -ms-zoom: 0.25;
-moz-transform: scale(0.25); -moz-transform: scale(0.25);
@ -82,9 +82,7 @@ div.wrapper
-webkit-transform-origin: 0 0; -webkit-transform-origin: 0 0;
} }
.thumbnail::after {
.thumbnail:after
{
content: ""; content: "";
display: block; display: block;
position: absolute; position: absolute;
@ -95,11 +93,14 @@ div.wrapper
jamesfuthey blog. Otherwise touches would go through on iPad. ***/ jamesfuthey blog. Otherwise touches would go through on iPad. ***/
} }
.thumbnail iframe iframe {
{ pointer-events: none;
}
.thumbnail iframe {
width: 1024px; width: 1024px;
height: 624px; height: 624px;
-webkit-animation-delay: 3s; /* Safari 4.0 - 8.0 */ -webkit-animation-delay: 3s; /* Safari 4.0 - 8.0 */
animation-delay: 3s; animation-delay: 3s;
-webkit-animation: color_change 1s infinite alternate; -webkit-animation: color_change 1s infinite alternate;
-moz-animation: color_change 1s infinite alternate; -moz-animation: color_change 1s infinite alternate;
@ -108,22 +109,20 @@ div.wrapper
animation: color_change 1s infinite alternate; animation: color_change 1s infinite alternate;
} }
.thumbnail-container .thumbnail-container {
{
width: calc(1024px * 0.25); width: calc(1024px * 0.25);
height: calc(624px * 0.25); height: calc(624px * 0.25);
display: inline-block; display: inline-block;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
box-shadow: 2px 2px 10px #000; box-shadow: 2px 2px 10px #000;
color: #DDD; color: #ddd;
} }
div.preview div.preview {
{
display: inline-block; display: inline-block;
margin: 22px; margin: 22px;
padding: 0px; padding: 0;
color: #333; color: #333;
font-size: 12pt; font-size: 12pt;
text-align: center; text-align: center;
@ -131,8 +130,7 @@ div.preview
height: 196px; height: 196px;
} }
div.title div.title {
{
padding-top: 8px; padding-top: 8px;
width: 256px; width: 256px;
height: 20px; height: 20px;
@ -140,10 +138,9 @@ div.title
overflow: hidden; overflow: hidden;
} }
.container .container {
{ margin: 0;
margin: 0px; padding: 0;
padding: 0px;
border: 2pt #000; border: 2pt #000;
min-height: 100%; min-height: 100%;
min-width: 100%; min-width: 100%;
@ -156,12 +153,7 @@ div.title
align-content: flex-end; align-content: flex-end;
} }
iframe {
pointer-events: none;
}
/** See https://github.com/electron/electron/issues/4420 */ /** See https://github.com/electron/electron/issues/4420 */
::selection { ::selection {
background: transparent; background: transparent;
} }

2
rollup.config.js
View File

@ -19,4 +19,4 @@ export default [{
watch: { watch: {
clearScreen: false clearScreen: false
} }
}]; }]