minesweeper/src/main/webapp/pages/mines.css
author Jaroslav Tulach <jaroslav.tulach@apidesign.org>
Thu, 14 Aug 2014 07:50:10 +0200
branchAppStore
changeset 197 197472ca59d4
parent 178 87d475e1cf75
child 199 b3c1d99205d6
permissions -rw-r--r--
Adressing comments from the first AppStore review: 1. don't mention android, 2. don't use word 'demo', replace it with 'showcase'.
jtulach@63
     1
/**
jtulach@63
     2
 * The MIT License (MIT)
jtulach@63
     3
 *
jtulach@63
     4
 * Copyright (C) 2013 Jaroslav Tulach <jaroslav.tulach@apidesign.org>
jtulach@63
     5
 *
jtulach@63
     6
 * Permission is hereby granted, free of charge, to any person obtaining a copy
jtulach@63
     7
 * of this software and associated documentation files (the "Software"), to deal
jtulach@63
     8
 * in the Software without restriction, including without limitation the rights
jtulach@63
     9
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
jtulach@63
    10
 * copies of the Software, and to permit persons to whom the Software is
jtulach@63
    11
 * furnished to do so, subject to the following conditions:
jtulach@63
    12
 *
jtulach@63
    13
 * The above copyright notice and this permission notice shall be included in
jtulach@63
    14
 * all copies or substantial portions of the Software.
jtulach@63
    15
 *
jtulach@63
    16
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
jtulach@63
    17
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
jtulach@63
    18
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
jtulach@63
    19
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
jtulach@63
    20
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
jtulach@63
    21
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
jtulach@63
    22
 * THE SOFTWARE.
jtulach@63
    23
 */
jtulach@63
    24
/** main chess style **/
jtulach@63
    25
#apptitle {
jtulach@63
    26
    font-size: 20px;
jtulach@63
    27
}
jtulach@63
    28
.log {
jtulach@63
    29
    margin-bottom: 10px;
jtulach@63
    30
}
jtulach@77
    31
jtulach@77
    32
.jumbotron {
jtulach@77
    33
    background-color: #fafafa;
jtulach@77
    34
}
jtulach@77
    35
jtulach@63
    36
table.field {
jtulach@63
    37
}
jtulach@63
    38
table.field td {
jtulach@63
    39
    border: 1px solid black;
jtulach@63
    40
    padding:10px;
jtulach@71
    41
    width: 56px;
jtulach@71
    42
    height: 56px;
jtulach@63
    43
    vertical-align: middle;
jtulach@63
    44
    text-align: center;
jtulach@71
    45
    font-size:4em;
jtulach@63
    46
}
jtulach@63
    47
jtulach@104
    48
table.field td div {
jtulach@104
    49
    position: relative;
jtulach@104
    50
    left: 0;
jtulach@104
    51
    top: 0;
jtulach@104
    52
}
jtulach@104
    53
jaroslav@166
    54
@-moz-keyframes blinker {  
jaroslav@166
    55
    0% { opacity: 0.9; }
jaroslav@166
    56
    50% { opacity: 0.1; }
jaroslav@166
    57
    100% { opacity: 0.9; }
jaroslav@166
    58
}
jaroslav@166
    59
jaroslav@166
    60
@-webkit-keyframes blinker {  
jaroslav@166
    61
    0% { opacity: 0.9; }
jaroslav@166
    62
    50% { opacity: 0.1; }
jaroslav@166
    63
    100% { opacity: 0.9; }
jaroslav@166
    64
}
jaroslav@166
    65
jaroslav@166
    66
@keyframes blinker {  
jaroslav@166
    67
    0% { opacity: 0.9; }
jaroslav@166
    68
    50% { opacity: 0.1; }
jaroslav@166
    69
    100% { opacity: 0.9; }
jaroslav@166
    70
} 
jaroslav@166
    71
table.MARKING td.UNKNOWN div:before {
jaroslav@166
    72
    content: "\0026a0";
jaroslav@166
    73
    color: #802420;
jaroslav@166
    74
    
jaroslav@166
    75
    -webkit-animation-name: blinker;
jaroslav@166
    76
    -webkit-animation-duration: 3s;
jaroslav@166
    77
    -webkit-animation-timing-function: linear;
jaroslav@166
    78
    -webkit-animation-iteration-count: infinite;
jaroslav@166
    79
jaroslav@166
    80
    -moz-animation-name: blinker;
jaroslav@166
    81
    -moz-animation-duration: 3s;
jaroslav@166
    82
    -moz-animation-timing-function: linear;
jaroslav@166
    83
    -moz-animation-iteration-count: infinite;
jaroslav@166
    84
jaroslav@166
    85
    animation-name: blinker;
jaroslav@166
    86
    animation-duration: 3s;
jaroslav@166
    87
    animation-timing-function: linear;
jaroslav@166
    88
    animation-iteration-count: infinite;
jaroslav@166
    89
}
jaroslav@166
    90
jtulach@65
    91
table.field td.UNKNOWN {
jtulach@75
    92
    background-color: #D6E4E1;
jtulach@178
    93
    color: #D6E4E1;
jtulach@63
    94
    cursor: pointer;
jtulach@63
    95
}
jaroslav@164
    96
table.field td.MARKED {
jaroslav@164
    97
    background-color: #D6E4E1;
jaroslav@164
    98
    cursor: pointer;
jaroslav@164
    99
}
jtulach@68
   100
table.field td.EXPLOSION {
jtulach@75
   101
    background-color: #A31E39;
jtulach@63
   102
}
jtulach@68
   103
table.field td.DISCOVERED {
jtulach@75
   104
    background-color: #9DB2B1;
jtulach@68
   105
}
jaroslav@163
   106
jtulach@178
   107
table.PLAYING td.UNKNOWN div::after {
jtulach@179
   108
    content: "\0026a0";
jaroslav@163
   109
}
jaroslav@163
   110
table.field td.EXPLOSION div::after {
jaroslav@163
   111
    content: "\002717";
jaroslav@163
   112
}
jaroslav@163
   113
table.field td.DISCOVERED div::after {
jaroslav@163
   114
    content: "\002714";
jaroslav@163
   115
}
jaroslav@164
   116
table.field td.MARKED div::after {
jaroslav@164
   117
    content: "\0026a0";
jaroslav@164
   118
}
jaroslav@163
   119
table.field td.N_0 div::after {
jtulach@179
   120
    content: "\0026a0";
jtulach@178
   121
    background-color: white;
jtulach@178
   122
    color: white;
jaroslav@163
   123
}
jaroslav@163
   124
table.field td.N_1 div::after {
jaroslav@163
   125
    content: "\002780";
jaroslav@163
   126
}
jaroslav@163
   127
table.field td.N_2 div::after {
jaroslav@163
   128
    content: "\002781";
jaroslav@163
   129
}
jaroslav@163
   130
table.field td.N_3 div::after {
jaroslav@163
   131
    content: "\002782";
jaroslav@163
   132
}
jaroslav@163
   133
table.field td.N_4 div::after {
jaroslav@163
   134
    content: "\002783";
jaroslav@163
   135
}
jaroslav@163
   136
table.field td.N_5 div::after {
jaroslav@163
   137
    content: "\002784";
jaroslav@163
   138
}
jaroslav@163
   139
table.field td.N_6 div::after {
jaroslav@163
   140
    content: "\002785";
jaroslav@163
   141
}
jaroslav@163
   142
table.field td.N_7 div::after {
jaroslav@163
   143
    content: "\002786";
jaroslav@163
   144
}
jaroslav@163
   145
table.field td.N_8 div::after {
jaroslav@163
   146
    content: "\002787";
jaroslav@163
   147
}
jtulach@63
   148
.but-orientation {
jtulach@63
   149
    margin-top:20px;
jtulach@63
   150
}
jtulach@63
   151
h3.log-h {
jtulach@63
   152
    border-top:1px solid silver;
jtulach@63
   153
}
jtulach@63
   154
.badge-status {
jtulach@63
   155
    display:inline-block;
jtulach@63
   156
    margin-left:20px;
jtulach@63
   157
    padding:5px;
jtulach@63
   158
    font-size:1em;
jtulach@63
   159
    text-shadow: none;
jtulach@63
   160
}
jtulach@63
   161
.btn {text-shadow: none;}
jtulach@63
   162
.select {line-height: inherit;}
jtulach@63
   163
.uneditable-input {
jtulach@63
   164
    margin-left: 0;
jtulach@63
   165
    color: black;
jtulach@63
   166
}
jtulach@63
   167
span.myturn {
jtulach@63
   168
    display: inline-block;
jtulach@63
   169
    position:relative;
jtulach@63
   170
    left:23px;
jtulach@63
   171
    padding:3px;
jtulach@63
   172
}
jtulach@63
   173
.whitePiece {
jtulach@63
   174
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
jtulach@63
   175
    color: white;
jtulach@63
   176
}