diff --git a/view/theme/vier/calendar.png b/view/theme/vier/calendar.png new file mode 100755 index 0000000000..705a75b8a8 Binary files /dev/null and b/view/theme/vier/calendar.png differ diff --git a/view/theme/vier/style.css b/view/theme/vier/style.css index 258a69cb52..89dd981469 100644 --- a/view/theme/vier/style.css +++ b/view/theme/vier/style.css @@ -1526,3 +1526,398 @@ blockquote { #group-separator, #prof-separator { display: none;} */ + +#prvmail-wrapper, .mail-conv-detail, .mail-list-detail { + position: relative; + width: 500px; + padding: 50px; + margin: 20px auto; + background-color: #fff; + -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); + -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); + box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); +} + +#prvmail-wrapper:before, #prvmail-wrapper:after, .mail-conv-detail:before, .mail-conv-detail:after, .mail-list-detail:before, .mail-list-detail:after { + position: absolute; + width: 40%; + height: 10px; + content: ' '; + left: 12px; + bottom: 12px; + background: transparent; + -webkit-transform: skew(-5deg) rotate(-5deg); + -moz-transform: skew(-5deg) rotate(-5deg); + -ms-transform: skew(-5deg) rotate(-5deg); + -o-transform: skew(-5deg) rotate(-5deg); + transform: skew(-5deg) rotate(-5deg); + -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); + -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); + z-index: -1; +} + +#prvmail-wrapper:after, .mail-conv-detail:after, .mail-list-detail:after { + left: auto; + right: 12px; + -webkit-transform: skew(5deg) rotate(5deg); + -moz-transform: skew(5deg) rotate(5deg); + -ms-transform: skew(5deg) rotate(5deg); + -o-transform: skew(5deg) rotate(5deg); + transform: skew(5deg) rotate(5deg); +} + +.prvmail-text { + width: 100%; +} + +.mail-list-outside-wrapper { + margin-top: 20px; +} + +.mail-list-sender { + float: left; + padding: 5px; + background-color: #efefef; + border: 2px dotted #eeeeee; + -moz-box-shadow: 3px 3px 4px #959494; + -webkit-box-shadow: 3px 3px 4px #959494; + box-shadow: 3px 3px 4px #959494; +} + +.mail-list-detail { + margin-left: 100px; + width: 300px; + min-height: 70px; + padding: 20px; + padding-top:10px; + border: 1px solid #dddddd; + } + +.mail-list-sender-name { + font-size: 1.1em; + display: inline; + font-variant:small-caps; +} + +.mail-list-date { + float: right; + clear: block; + display: inline; + font-size: 0.9em; + padding-left: 10px; + font-stretch:ultra-condensed; + font-variant:small-caps; +} + +.mail-list-subject { + clear: block; + font-size: 1.2em; + padding-top: 20px; + padding-right: 50px; +} + +.mail-list-subject a { + color: #626262; +} + +.mail-list-delete-wrapper { float: right;} +.mail-list-outside-wrapper-end { + clear: both; +} + +.mail-conv-outside-wrapper { + margin-bottom: 10px; +} + +.mail-conv-sender {float: left; margin: 0px 5px 5px 0px; } +.mail-conv-sender-photo { + width: 64px; + height: 64px; +} + +.mail-conv-sender-name { float: left; font-variant:small-caps; font-style: bold; } +.mail-conv-date { float: right; font-variant:small-caps; } +.mail-conv-subject { clear: right; font-weight: bold; font-size: 1.2em } +.mail-conv-body { + clear: both; +} + +.mail-conv-detail { + width: 500px; + padding: 30px; + padding-bottom: 10px; + margin-left: 20px; + margin-bottom: 0px; + vertical-align: middle; + margin: auto; + border: 1px solid #dddddd; +} +.mail-conv-break { display: none; border: none;} +.mail-conv-delete-wrapper { padding-top: 10px; width: 510px; text-align: right; } + +/* ========== */ +/* = Events = */ +/* ========== */ + +.clear { clear: both; } +.eventcal { + float: left; + font-size: 20px; + padding: 20px; +} + +.vevent { + position: relative; + width: 400px; + padding: 20px; + padding-top: 10px; + margin: 0 0px; + margin-bottom: 10px; + background-color: #fff; + -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); + -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); + box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); +} + +.vevent:before, .vevent:after { + position: absolute; + width: 40%; + height: 10px; + content: ' '; + left: 12px; + bottom: 12px; + background: transparent; + -webkit-transform: skew(-5deg) rotate(-5deg); + -moz-transform: skew(-5deg) rotate(-5deg); + -ms-transform: skew(-5deg) rotate(-5deg); + -o-transform: skew(-5deg) rotate(-5deg); + transform: skew(-5deg) rotate(-5deg); + -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); + -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); + z-index: -1; +} + +.vevent:after { + left: auto; + right: 12px; + -webkit-transform: skew(5deg) rotate(5deg); + -moz-transform: skew(5deg) rotate(5deg); + -ms-transform: skew(5deg) rotate(5deg); + -o-transform: skew(5deg) rotate(5deg); + transform: skew(5deg) rotate(5deg); +} + +.vevent .event-description { + margin-left: 10px; + margin-right: 10px; + text-align:center; + font-size: 1.2em; + font-weight:bolder; +} + + .vevent .event-location{ + margin-left: 10px; + margin-right: 10px; + font-size: 1em; + font-style: oblique; + text-align: center; + +} + +.vevent .event-start, .vevent .event-end { + margin-left: 20px; + margin-right: 20px; + margin-bottom: 2px; + margin-top: 2px; + font-size: 0.9em; + font-variant: small-caps; + text-align: left; +} + +#new-event-link{ + width: 130px; + padding: 7px; + margin-bottom: 10px; + margin-left: 170px; ; + -moz-box-shadow:inset 0px 1px 0px 0px #cfcfcf; + -webkit-box-shadow:inset 0px 1px 0px 0px #cfcfcf; + box-shadow:inset 0px 1px 0px 0px #cfcfcf; + background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bdbdbd), color-stop(1, #a2a2a2) ); + background:-moz-linear-gradient( center top, #bdbdbd 5%, #a2a2a2 100% ); + filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdbdbd', endColorstr='#a2a2a2'); + background-color:#bdbdbd; + -moz-border-radius:5px; + -webkit-border-radius:5px; + border-radius:5px; + color: #efefef; +} + +#new-event-link:hover { + color: #efefef; + background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b20202), color-stop(1, #d60808) ); + background:-moz-linear-gradient( center top, #b20202 5%, #d60808 100% ); + filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b20202', endColorstr='#d60808'); + background-color:#b20202; +} + +#new-event-link:active { + background-color: #b20202; + position:relative; + top:1px; +} + +#new-event-link a { + color: #efefef; + text-align: center; +} + +.edit-event-link, .plink-event-link { + float: left; + margin-top: 4px; + margin-right: 4px; + margin-bottom: 15px; +} + +.event-description:before { + content: url('calendar.png'); + margin-right: 15px; + vertical-align: middle; +} + +.event-start, .event-end { + margin-left: 10px; + width: 330px; +} + +.event-start .dtstart, .event-end .dtend { + float: right; +} + +.event-list-date { + color: #626262; + margin-bottom: 10px; + font-variant:small-caps; + font-stretch:condensed; +} + +.prevcal, .nextcal { + float: left; + margin-left: 32px; + margin-right: 32px; + margin-top: 64px; +} + +.event-calendar-end { + clear: both; +} + +.calendar { + width: 300px; + font-family: Helvetica, Arial, sans-serif; + background-color: #f1f1f1; + border: 1px solid #dedede; + margin-bottom: 10px; + -moz-box-shadow: 5px 5px 8px #959494; + -webkit-box-shadow: 5px 5px 8px #959494; + box-shadow: 5px 5px 8px #959494; +} + +.calendar caption{ + background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #d60808), color-stop(1, #b20202) ); + background:-moz-linear-gradient( center top, #d60808 5%, #b20202 100% ); + filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d60808', endColorstr='#b20202'); + background-color: #b20202; + padding: 10px 0px 10px 0px; + width: 300px; + color: #ffffff; + font-weight: bold; + text-align:center; + font-variant:small-caps; + -moz-box-shadow: 5px 2px 8px #959494; + -webkit-box-shadow: 5px 2px 8px #959494; + box-shadow: 5px 2px 8px #959494; +} + +tr { + border: 1px solid #eeeeee; +} + +.calendar td { + font-size: 14px; + text-align: center; + padding: 3px 0px; +} + +.calendar td > a { + background-color: #cdcdcd; + padding: 2px; + color: #000; +} + +.calendar th { + font-size: 16px; +} + +.today { + font-weight: bold; + text-align: center; + background-color: #b20202; + color: #fff; +} + +#event-start-text, +#event-finish-text { + margin-top: 10px; + margin-bottom: 5px; +} + +#event-nofinish-checkbox, +#event-nofinish-text, +#event-adjust-checkbox, +#event-adjust-text, +#event-share-checkbox { + float: left; +} + +#event-datetime-break { + margin-bottom: 10px; +} + +#event-nofinish-break, +#event-adjust-break, +#event-share-break { + clear: both; +} + +#event-desc-text, +#event-location-text { + margin-top: 10px; + margin-bottom: 5px; +} + +#event-submit { + margin-top: 10px; +} + +/* ============= */ +/* = Directory = */ +/* ============= */ + +.directory-item { + float: left; + margin: 50px 50px 0px 0px; +} + +.directory-details { + font-size: 0.9em; + font-variant: small-caps; + width: 160px; +} + +.directory-name { + font-size: 1em; + font-variant: small-caps; + width: 150px; +}