diff options
Diffstat (limited to 'apps/system/style/modal_dialog')
-rw-r--r-- | apps/system/style/modal_dialog/images/error_bk.png | bin | 0 -> 67183 bytes | |||
-rw-r--r-- | apps/system/style/modal_dialog/modal_dialog.css | 112 | ||||
-rw-r--r-- | apps/system/style/modal_dialog/prompt.css | 50 |
3 files changed, 162 insertions, 0 deletions
diff --git a/apps/system/style/modal_dialog/images/error_bk.png b/apps/system/style/modal_dialog/images/error_bk.png Binary files differnew file mode 100644 index 0000000..9f71ff8 --- /dev/null +++ b/apps/system/style/modal_dialog/images/error_bk.png diff --git a/apps/system/style/modal_dialog/modal_dialog.css b/apps/system/style/modal_dialog/modal_dialog.css new file mode 100644 index 0000000..d6e97f8 --- /dev/null +++ b/apps/system/style/modal_dialog/modal_dialog.css @@ -0,0 +1,112 @@ +#modal-dialog-alert, +#modal-dialog-confirm, +#modal-dialog-prompt, +#authentication-dialog, +#authentication-dialog-http, +#modal-dialog-error, +#modal-dialog-select-one { + display: none; +} + +#authentication-dialog input, +#modal-dialog input { + border-radius: 2px 2px 2px 2px; + height: 40px; + font-size: 20px; + width: 100%; + color: white; + background: none; + -moz-box-sizing: border-box; +} + +/* 480x800 phones */ +@media (orientation: portrait) and (width: 480px), + (orientation: landscape) and (width: 800px) { + #authentication-dialog input, + #modal-dialog input { + border-radius: 3px 3px 3px 3px; + height: 60px; + font-size: 30px; + width: 100%; + color: white; + -moz-box-sizing: border-box; + } +} + +#screen.modal-dialog #modal-dialog, +#screen.authentication-dialog #authentication-dialog, +#authentication-dialog-http.visible, +#modal-dialog-alert.visible, +#modal-dialog-confirm.visible, +#modal-dialog-prompt.visible, +#modal-dialog-error.visible, +#modal-dialog-select-one.visible { + display: block; +} + +#modal-dialog-error { + background-color: black; + background-image: url(images/error_bk.png); +} + +#modal-dialog-sad-face { + float: left; + font-size: 72px; + margin-right: 2px; +} + +/* Confirm dialog */ +.modal-dialog-message-container p { + display:inline !important; + word-wrap: break-word; +} + +/* Select one dialog */ + +#modal-dialog-select-one .modal-dialog-message-container { + display: block; + padding: 0 1.5rem 0 1.5rem; + position: absolute; + left: 0; + bottom: -moz-calc(3.8rem + 3rem); +} + +#modal-dialog-select-one h3 { + font-size: 1.8rem; +} + +#modal-dialog-select-one ul { + width: 100%; + height: auto; + list-style: none; + padding: 0; + margin: 0.5rem 0 2rem 0; + display: block; + overflow: hidden; +} + +#modal-dialog-select-one ul > li { + width: 100%; + padding-top: 1rem; + margin: 0; + display: block; + overflow: hidden; + border: none; + height: auto; + line-height: normal; +} + +#modal-dialog-select-one ul > li > button { + color: #fff; + text-shadow: none; + text-align: left; + margin: 0; + background: #4E4E4E padding-box; + border: solid 1px rgba(0, 0, 0, 0.25); +} + +#modal-dialog-select-one ul > li > button:active { + background-color: #006f86; + color: #333; + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25); +} diff --git a/apps/system/style/modal_dialog/prompt.css b/apps/system/style/modal_dialog/prompt.css new file mode 100644 index 0000000..69d726d --- /dev/null +++ b/apps/system/style/modal_dialog/prompt.css @@ -0,0 +1,50 @@ +/* ---------------------------------- + * STYLES FOR PROMPT + * Requires: + menu-dialoges/core.css + other/buttons/style.css + * ---------------------------------- */ + +[role="dialog"] p { + font-family: 'MozTT', Sans-serif; + font-weight: lighter; + font-size: 2.2rem; + color: #FAFAFA; + margin: 0; +} + +[role="dialog"] p:last-child { + overflow-x: hidden; + overflow-y: auto; + word-wrap: break-word; + /*screen height - menu data-items - dialog padding - title height*/ + /*almost 60% screen height*/ + max-height: 28rem; +} + +[role="dialog"] .content { + font-family: 'MozTT', Sans-serif; + font-weight: lighter; + font-size: 2.2rem; + color: #fff; + border-bottom: 0.1rem solid #777; + margin: 0; + padding: 2.5rem 0 2rem 0; +} + +[role="dialog"] .content img { + float: left; + margin-right: 2rem; +} + +[role="dialog"] .content strong { + font-weight: lighter; +} + +[role="dialog"] .content small { + font-size: 1.4rem; + font-family: 'MozTT', Sans-serif; + font-weight: normal; + color: #cbcbcb; + display: block; +} |