diff -r 000000000000 -r e8ccd40d0ef6 Touchgui/plugins/org.apache.cordova.dialogs/www/firefoxos/notification.css --- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/Touchgui/plugins/org.apache.cordova.dialogs/www/firefoxos/notification.css Thu Jun 04 14:50:33 2015 +0200 @@ -0,0 +1,248 @@ +/* + * + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + * +*/ + +/* Main dialog setup */ +form[role="dialog"] { + background: + url(../img/pattern.png) repeat left top, + url(../img/gradient.png) no-repeat left top / 100% 100%; + overflow: hidden; + position: absolute; + z-index: 100; + top: 0; + left: 0; + right: 0; + bottom: 0; + padding: 1.5rem 0 7rem; + font-family: "MozTT", Sans-serif; + font-size: 0; + /* Using font-size: 0; we avoid the unwanted visual space (about 3px) + created by white-spaces and break lines in the code betewen inline-block elements */ + color: #fff; + text-align: left; +} + +form[role="dialog"]:before { + content: ""; + display: inline-block; + vertical-align: middle; + width: 0.1rem; + height: 100%; + margin-left: -0.1rem; +} + +form[role="dialog"] > section { + font-weight: lighter; + font-size: 1.8rem; + color: #FAFAFA; + padding: 0 1.5rem; + -moz-box-sizing: padding-box; + width: 100%; + display: inline-block; + overflow-y: scroll; + max-height: 100%; + vertical-align: middle; + white-space: normal; +} + +form[role="dialog"] h1 { + font-weight: normal; + font-size: 1.6rem; + line-height: 1.5em; + color: #fff; + margin: 0; + padding: 0 1.5rem 1rem; + border-bottom: 0.1rem solid #686868; +} + +/* Menu & buttons setup */ +form[role="dialog"] menu { + margin: 0; + padding: 1.5rem; + padding-bottom: 0.5rem; + border-top: solid 0.1rem rgba(255, 255, 255, 0.1); + background: #2d2d2d url(../img/pattern.png) repeat left top; + display: block; + overflow: hidden; + position: absolute; + left: 0; + right: 0; + bottom: 0; + text-align: center; +} + +form[role="dialog"] menu button::-moz-focus-inner { + border: none; + outline: none; +} +form[role="dialog"] menu button { + width: 100%; + height: 2.4rem; + margin: 0 0 1rem; + padding: 0 1.5rem; + -moz-box-sizing: border-box; + display: inline-block; + vertical-align: middle; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + background: #fafafa url(../img/default.png) repeat-x left bottom/ auto 100%; + border: 0.1rem solid #a6a6a6; + border-radius: 0.3rem; + font: 500 1.2rem/2.4rem 'MozTT', Sans-serif; + color: #333; + text-align: center; + text-shadow: 0.1rem 0.1rem 0 rgba(255,255,255,0.3); + text-decoration: none; + outline: none; +} + +/* Press (default & recommend) */ +form[role="dialog"] menu button:active, +form[role="dialog"] menu button.recommend:active, +a.recommend[role="button"]:active { + border-color: #008aaa; + color: #333; +} + +/* Recommend */ +form[role="dialog"] menu button.recommend { + background-image: url(../img/recommend.png); + background-color: #00caf2; + border-color: #008eab; +} + +/* Danger */ +form[role="dialog"] menu button.danger, +a.danger[role="button"] { + background-image: url(../img/danger.png); + background-color: #b70404; + color: #fff; + text-shadow: none; + border-color: #820000; +} + +/* Danger Press */ +form[role="dialog"] menu button.danger:active { + background-image: url(../img/danger-press.png); + background-color: #890707; +} + +/* Disabled */ +form[role="dialog"] > menu > button[disabled] { + background: #5f5f5f; + color: #4d4d4d; + text-shadow: none; + border-color: #4d4d4d; + pointer-events: none; +} + + +form[role="dialog"] menu button:nth-child(even) { + margin-left: 1rem; +} + +form[role="dialog"] menu button, +form[role="dialog"] menu button:nth-child(odd) { + margin: 0 0 1rem 0; +} + +form[role="dialog"] menu button { + width: calc((100% - 1rem) / 2); +} + +form[role="dialog"] menu button.full { + width: 100%; +} + +/* Specific component code */ +form[role="dialog"] p { + word-wrap: break-word; + margin: 1rem 0 0; + padding: 0 1.5rem 1rem; + line-height: 3rem; +} + +form[role="dialog"] p img { + float: left; + margin-right: 2rem; +} + +form[role="dialog"] p strong { + font-weight: lighter; +} + +form[role="dialog"] p small { + font-size: 1.4rem; + font-weight: normal; + color: #cbcbcb; + display: block; +} + +form[role="dialog"] dl { + border-top: 0.1rem solid #686868; + margin: 1rem 0 0; + overflow: hidden; + padding-top: 1rem; + font-size: 1.6rem; + line-height: 2.2rem; +} + +form[role="dialog"] dl > dt { + clear: both; + float: left; + width: 7rem; + padding-left: 1.5rem; + font-weight: 500; + text-align: left; +} + +form[role="dialog"] dl > dd { + padding-right: 1.5rem; + font-weight: 300; + text-overflow: ellipsis; + vertical-align: top; + overflow: hidden; +} + +/* input areas */ +input[type="text"], +input[type="password"], +input[type="email"], +input[type="tel"], +input[type="search"], +input[type="url"], +input[type="number"], +textarea { + -moz-box-sizing: border-box; + display: block; + overflow: hidden; + width: 100%; + height: 3rem; + resize: none; + padding: 0 1rem; + font-size: 1.6rem; + line-height: 3rem; + border: 0.1rem solid #ccc; + border-radius: 0.3rem; + box-shadow: none; /* override the box-shadow from the system (performance issue) */ + background: #fff url(input_areas/images/ui/shadow.png) repeat-x; +}