From 78f3c0e9893d36e0ce039c2b79ede8a92ebe468a Mon Sep 17 00:00:00 2001 From: Unknown Date: Sun, 1 Oct 2017 00:24:20 -0400 Subject: Adding the code --- apps/calendar/style.css | 498 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 498 insertions(+) create mode 100644 apps/calendar/style.css (limited to 'apps/calendar/style.css') diff --git a/apps/calendar/style.css b/apps/calendar/style.css new file mode 100644 index 0000000..4e1112a --- /dev/null +++ b/apps/calendar/style.css @@ -0,0 +1,498 @@ +html { + height: 100%; +} +body { + background: #eee; + font-family: Segoe UI; + font-size: 1em; + color: #000; + height: 100%; + margin: 0; + padding: 0; + transition:all 1s ease 0s; + -moz-transition:all 1s ease 0s; + -webkit-transition:all 1s ease 0s; +} +a { +outline:none; +} + +.box { + background: #fff; + box-shadow: 0 0 30px #ddd; +} + +#calendar-wrap { + padding-right: 35px; + float: left; + z-index: 1; + overflow: hidden; + transition:all 1s ease 0s; + -moz-transition:all 1s ease 0s; + -webkit-transition:all 1s ease 0s; +} + #calendar { + position: relative; + margin: 15px; + } + #stats { + color: #aaa; + line-height: 40px; + font-size:14pt; + } + #calendar-title { + + margin-bottom: 10px; + float: left; + width: 40%; + font-family:Segoe UI Light; + color: rgb(0, 114, 198); + transition:all 1s ease 0s; + -moz-transition:all 1s ease 0s; + -webkit-transition:all 1s ease 0s; + } + #time { + color: #999; + } + +table { + width: 100%; + height: 80%; + margin-top: -20px; + border-spacing: 0; +} +thead td { + font-size: 11px; + text-transform:uppercase; + color: rgb(102, 102, 102); + + height: 40px; +} +tbody td { + border-width: 0 1px 1px 0; + border-style: solid; + border-color: #ddd; + padding: 10px; + overflow: hidden; +} +thead td { + border-bottom: 1px solid #ddd; +} +tbody tr td:nth-child(1) { + border-left: 1px solid #ddd; +} + +.day { + background: #fff url('w.png') repeat-x bottom left; + overflow: hidden; + cursor: pointer; +} +.day div { + position: relative; +} +.day:hover { + background: #fff; +} +.day .d { + position: absolute; + top: 0; + right: 0; +} +.selected .d { + text-decoration: underline; +} +.today { + background: #DFEDFA; + border-top:3px solid #0072C6; +} + .marked .d { + font-weight: bold; + } +#btn-previous { + width:32px; + height:32px; + padding:0px !important; + background-image:url(img/left-light.png) !important; + background-color:transparent !important; + vertical-align:middle; + opacity:0.8; + +} +#btn-next { + width:32px; + height:32px; + padding:0px !important; + background-image:url(img/right-light.png) !important; + background-color:transparent !important; + vertical-align:middle; + opacity:0.8; +} +#btn-previous:hover , #btn-next:hover { + opacity:1; +} +#btn-today { + padding:0px !important; + background-color:transparent !important; + font-size:14pt !important; + vertical-align:middle; + margin-left:50px; + margin-right:50px; + color:#000; + transition:all 2s ease 0s; + -moz-transition:all 2s ease 0s; + -webkit-transition:all 2s ease 0s; + +} +.day .add { + position: absolute; + top: 0px; + left: 0px; + line-height: 16px; + width: 16px; + height: 16px; + opacity: 0; + background-image:url(img/plus-light.png); + background-size:16px 16px; +} + .day ul { + position: absolute; + font-size: 11px; + top: 25px; + width: 100%; + } + .day li { + padding: 2px; + width: 100%; + margin-bottom: 1px; + overflow: hidden; + height: 14px; + } + .day ul .time { + margin-right: 5px; + } + + +#diary-wrap { + border-left: 1px solid #ddd; + float: left; + width: 30%; + display: none; + transition:all 1s ease 0s; + -moz-transition:all 1s ease 0s; + -webkit-transition:all 1s ease 0s; +} + #diary-title { + float: left; + color: rgb(0, 114, 198); + font-family:Segoe UI Light; + } + #diary-close { + float: left; + margin: 1px 15px 10px 0; + background-image:url(img/close-light.png); + width:32px; + height:32px; + } + + #diary-wrap .content { + margin: 15px; + } + .compact #diary-wrap { + position: absolute; + top: 0; + right: 0; + z-index: 5; + margin-left: 40px; + } + .compact #calendar-title { + float: none; + } + .compact #controls { + float: none; + } +#diary { + font-size: 12px; + margin: 15px; + transition:all 1s ease 0s; + -moz-transition:all 1s ease 0s; + -webkit-transition:all 1s ease 0s; +} + #diary li { + margin-bottom: 3px; + } + #diary .time { + background: #bbb; + color: #fff; + padding: 2px; + display: block; + width: 100px; + float: left; + margin-right: 15px; + } + #diary .time:hover { + background: #000; + } + #diary .desc { + display: inline-block; + padding: 0 0 3px 0; + overflow: hidden; + border-bottom: 1px solid #ddd; + } + +#dialog { + background: #fff url('w.png') repeat-x bottom left; + display: none; + padding: 15px 25px; + position: absolute; + z-index: 10; + + box-shadow: 0 0 30px #aaa; +} + #dialog-close { + float: right; + margin: -5px -15px 10px 10px; + background-image:url(img/close-light.png); + width:32px; + height:32px; + } + #dialog .target { + display: none; + } + + + #add #event-description { + width: 90%; + } + #add label { + display: block; + font-weight: bold; + margin-bottom: 5px; + } + #add p.time { + margin-bottom: 10px; + } + #add .label { + font-size: 11px; + font-weight: normal; + display: inline-block; + margin-right: 10px; + } + #add #event-label input { + padding: 0; + } + #add .buttons { + margin-top: 30px; + } + #event-tweet, + #event-delete { + float: right; + display: none; + margin-left: 5px; + } + #event-tweet { + background-image: url('t.png'); + background-repeat: no-repeat; + background-position: 3px 9px; + padding-left: 22px; + } + + #ical-data { + margin-top: 15px; + width: 100%; + font-size: 11px; + height: 250px; + border:1px solid #EBEBEB; + transition:all 1s ease 0s; + -moz-transition:all 1s ease 0s; + -webkit-transition:all 1s ease 0s; + } + +#controls { + float: right; + margin-top: 8px; +} + #controls li { + display: inline-block; + margin-left: 5px; + } + #controls a { + display: inline-block; + padding: 5px 12px; + } + #controls .sep { + margin-right: 35px; + } + .button { + border: 0; + margin: 0; + font-weight: bold; + font-size: 15px; + cursor: pointer; + } + + +#credit { + background: #eee; + border-radius: 3px; + padding: 3px 5px; + margin-top: 15px; + display: inline-block; +} + +/* ____________ */ +.label { + padding: 3px; + color: #fff !important; +} +.important { + background: #ff0000 !important; +} +.todo { + background: #3366cc !important; +} +.personal { + background: #35A200 !important; +} +.work { + background: #D89700 !important; +} +.misc { + background: #48BFF2 !important; +} + +.clear { + clear: both; +} + +.info { + font-size: 12px; + color: #666; +} + +.round { + display: block; + width: 20px; + height: 20px; + + border: 3px solid #000; + border-radius: 20px; + font-weight: bold; + text-align: center; + overflow: hidden; +} + .round:hover { + border-color: #3366cc; + color: #3366cc; + } + +h1, h2, h3, h4 { + margin: 0 0 25px 0; + font-weight: normal; +} +a { + color: #000; + text-decoration: none; +} +input, select { + padding: 10px; + font-family:Segoe UI Light; + font-size:14pt; +} +ul { + list-style-type: none; + margin: 0; + padding: 0; +} + + + +/* ___________ colour schemes */ +.dark { + background: #414141; + color: #FFF; + transition:all 2s ease 0s; +} +.dark #time { + color: #FFF; +} +.dark #stats { + color: #666; +} +.dark .box { + background: #212121; + box-shadow: 0 0 30px #111; +} +.dark #calendar-title , .dark #diary-title { + color: #FFF; +} +.dark #dialog { + background: #212121; + border: 1px solid #444; + box-shadow: 0 0 30px #000; +} +.dark #diary-wrap { + border: 0; + border-right: 1px solid #1e1e1e; +} + + +.dark .round { + border-color: #ff4800; + color: #ff4800; +} + .dark .round:hover { + border-color: #aaa; + color: #aaa; + } +.dark .day { + background: #191919; +} +.dark .day .add { + background-image:url(img/plus.png); + background-size:16px 16px; +} +.dark tbody td, +.dark thead td, +.dark tbody tr td:nth-child(1) { + border-color: #2e2e2e; +} +.dark #diary .time { + background: #444; + color: #ccc; +} +.dark #diary .desc { + border-color: #444; +} + +.dark #credit { + background: #111; +} +.dark #credit a { + color: #ddd; +} +.dark .today { + background: #333; +} +.dark .info { + color: #999; +} +.dark #ical-data { + background: #222; + color: #aaa; + border: 1px solid #333; +} +.dark .button { + background: #666; +} +.dark #dialog-close , .dark #diary-close { + background-image:url(img/close.png); +} +.dark #btn-today { + color:#FFF; +} +.dark #btn-previous { + background-image:url(img/left.png) !important; +} +.dark #btn-next { + background-image:url(img/right.png) !important; +} \ No newline at end of file -- cgit v1.2.3