Permalink
Browse files

Initial import of Todos app for SC2.0

  • Loading branch information...
0 parents commit 2b2923e5e35134194e5cf638cdcd721d38740dce Tom Dale committed May 25, 2011
5 README
@@ -0,0 +1,5 @@
+This application shows how you can write SproutCore 2.0 apps with an astonishlingly small amount of code.
+
+For more information about SproutCore, visit http://www.sproutcore.com.
+
+By Yehuda Katz and Tom Dale
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -0,0 +1,141 @@
+
+/* ==== Scroll down to find where to put your styles :) ==== */
+
+/* HTML5 ✰ Boilerplate */
+
+html, body, div, span, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
+small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline;
+}
+
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+ display: block;
+}
+
+blockquote, q { quotes: none; }
+blockquote:before, blockquote:after,
+q:before, q:after { content: ''; content: none; }
+ins { background-color: #ff9; color: #000; text-decoration: none; }
+mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
+del { text-decoration: line-through; }
+abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
+table { border-collapse: collapse; border-spacing: 0; }
+hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
+input, select { vertical-align: middle; }
+
+body { font:13px/1.231 sans-serif; *font-size:small; }
+select, input, textarea, button { font:99% sans-serif; }
+pre, code, kbd, samp { font-family: monospace, sans-serif; }
+
+html { overflow-y: scroll; }
+a:hover, a:active { outline: none; }
+ul, ol { margin-left: 2em; }
+ol { list-style-type: decimal; }
+nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
+small { font-size: 85%; }
+strong, th { font-weight: bold; }
+td { vertical-align: top; }
+
+sub, sup { font-size: 75%; line-height: 0; position: relative; }
+sup { top: -0.5em; }
+sub { bottom: -0.25em; }
+
+pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; }
+textarea { overflow: auto; }
+.ie6 legend, .ie7 legend { margin-left: -7px; }
+input[type="radio"] { vertical-align: text-bottom; }
+input[type="checkbox"] { vertical-align: bottom; }
+.ie7 input[type="checkbox"] { vertical-align: baseline; }
+.ie6 input { vertical-align: text-bottom; }
+label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
+button, input, select, textarea { margin: 0; }
+input:valid, textarea:valid { }
+input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; }
+.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }
+
+::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }
+::selection { background:#FF5E99; color:#fff; text-shadow: none; }
+a:link { -webkit-tap-highlight-color: #FF5E99; }
+
+button { width: auto; overflow: visible; }
+.ie7 img { -ms-interpolation-mode: bicubic; }
+
+body, select, input, textarea { color: #444; }
+h1, h2, h3, h4, h5, h6 { font-weight: bold; }
+a, a:active, a:visited { color: #607890; }
+a:hover { color: #036; }
+
+/*
+ // ========================================== \\
+ || ||
+ || Your styles ! ||
+ || ||
+ \\ ========================================== //
+*/
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
+.hidden { display: none; visibility: hidden; }
+.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
+.visuallyhidden.focusable:active,
+.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
+.invisible { visibility: hidden; }
+.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
+.clearfix:after { clear: both; }
+.clearfix { zoom: 1; }
+
+
+@media all and (orientation:portrait) {
+
+}
+
+@media all and (orientation:landscape) {
+
+}
+
+@media screen and (max-device-width: 480px) {
+
+ /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
+}
+
+
+@media print {
+ * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
+ -ms-filter: none !important; }
+ a, a:visited { color: #444 !important; text-decoration: underline; }
+ a[href]:after { content: " (" attr(href) ")"; }
+ abbr[title]:after { content: " (" attr(title) ")"; }
+ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
+ pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
+ thead { display: table-header-group; }
+ tr, img { page-break-inside: avoid; }
+ @page { margin: 0.5cm; }
+ p, h2, h3 { orphans: 3; widows: 3; }
+ h2, h3{ page-break-after: avoid; }
+}
@@ -0,0 +1,241 @@
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline; }
+
+body {
+ line-height: 1; }
+
+ol, ul {
+ list-style: none; }
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0; }
+
+caption, th, td {
+ text-align: left;
+ font-weight: normal;
+ vertical-align: middle; }
+
+q, blockquote {
+ quotes: none; }
+ q:before, q:after, blockquote:before, blockquote:after {
+ content: "";
+ content: none; }
+
+a img {
+ border: none; }
+
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+ display: block; }
+
+/* CSS Reset */
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline; }
+
+body {
+ line-height: 1; }
+
+ol, ul {
+ list-style: none; }
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0; }
+
+caption, th, td {
+ text-align: left;
+ font-weight: normal;
+ vertical-align: middle; }
+
+q, blockquote {
+ quotes: none; }
+ q:before, q:after, blockquote:before, blockquote:after {
+ content: "";
+ content: none; }
+
+a img {
+ border: none; }
+
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+ display: block; }
+
+body {
+ line-height: 1;
+ font-family: "Lucida Grande", sans-serif;
+ font-size: 13px; }
+
+ol, ul {
+ list-style: none; }
+
+blockquote, q {
+ quotes: none; }
+
+blockquote:before, blockquote:after,
+q:before, q:after {
+ content: '';
+ content: none; }
+
+table {
+ border-collapse: collapse;
+ border-spacing: 0; }
+
+/* App CSS */
+body, html {
+ color: #777;
+ background-color: #F2F4F5; }
+
+.sc-view {
+ position: relative;
+ overflow: visible; }
+
+body {
+ -moz-box-shadow: rgba(0, 0, 0, 0.6) 0 0 1px;
+ -webkit-box-shadow: rgba(0, 0, 0, 0.6) 0 0 1px;
+ -o-box-shadow: rgba(0, 0, 0, 0.6) 0 0 1px;
+ box-shadow: rgba(0, 0, 0, 0.6) 0 0 1px;
+ -moz-border-radius: 8px;
+ -webkit-border-radius: 8px;
+ -o-border-radius: 8px;
+ -ms-border-radius: 8px;
+ -khtml-border-radius: 8px;
+ border-radius: 8px;
+ position: absolute;
+ width: 600px;
+ left: 50%;
+ margin-top: 38px;
+ border: 1px solid #bbbbbb;
+ margin-left: -300px;
+ background-color: #fff;
+ padding: 40px 10px 10px; }
+ body .mark-all-done label {
+ margin-left: 5px;
+ font-weight: bold; }
+ body #stats {
+ overflow: hidden;
+ width: 100%;
+ padding: 5px 10px;
+ margin: 10px -10px;
+ background-color: #eee;
+ border-top: 1px solid #aaa;
+ border-bottom: 1px solid #aaa;
+ line-height: 25px; }
+ body #stats .remaining {
+ float: left; }
+ body #stats .sc-button {
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #f9f9f9), color-stop(34%, #dddddd), color-stop(67%, #f2f2f2), color-stop(100%, #f7f7f7));
+ background-image: -webkit-linear-gradient(#f9f9f9 1%, #dddddd, #f2f2f2, #f7f7f7);
+ background-image: -moz-linear-gradient(#f9f9f9 1%, #dddddd, #f2f2f2, #f7f7f7);
+ background-image: -o-linear-gradient(#f9f9f9 1%, #dddddd, #f2f2f2, #f7f7f7);
+ background-image: linear-gradient(#f9f9f9 1%, #dddddd, #f2f2f2, #f7f7f7);
+ border: 1px solid #828282;
+ color: #000;
+ float: right;
+ padding: 0 5px; }
+ body #stats .sc-button:hover {
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #ffffff), color-stop(34%, #e2e2e2), color-stop(67%, #f7f7f7), color-stop(100%, #fcfcfc));
+ background-image: -webkit-linear-gradient(#ffffff 1%, #e2e2e2, #f7f7f7, #fcfcfc);
+ background-image: -moz-linear-gradient(#ffffff 1%, #e2e2e2, #f7f7f7, #fcfcfc);
+ background-image: -o-linear-gradient(#ffffff 1%, #e2e2e2, #f7f7f7, #fcfcfc);
+ background-image: linear-gradient(#ffffff 1%, #e2e2e2, #f7f7f7, #fcfcfc); }
+ body #stats .sc-button.is-active {
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #efefef), color-stop(34%, #d3d3d3), color-stop(67%, #e8e8e8), color-stop(100%, #ededed));
+ background-image: -webkit-linear-gradient(#efefef 1%, #d3d3d3, #e8e8e8, #ededed);
+ background-image: -moz-linear-gradient(#efefef 1%, #d3d3d3, #e8e8e8, #ededed);
+ background-image: -o-linear-gradient(#efefef 1%, #d3d3d3, #e8e8e8, #ededed);
+ background-image: linear-gradient(#efefef 1%, #d3d3d3, #e8e8e8, #ededed); }
+ body input[type='text'] {
+ -moz-border-radius: 5px;
+ -webkit-border-radius: 5px;
+ -o-border-radius: 5px;
+ -ms-border-radius: 5px;
+ -khtml-border-radius: 5px;
+ border-radius: 5px;
+ -moz-box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.6);
+ -webkit-box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.6);
+ -o-box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.6);
+ box-shadow: 0 0 10px -2px rgba(0, 0, 0, 0.6);
+ color: #999;
+ background-color: #f0f0f0;
+ width: 588px;
+ font-size: 30px;
+ font-family: Helvetica, sans-serif;
+ padding: 5px;
+ border: 1px solid #bbbbbb;
+ font-weight: 500; }
+ body input[type='text']::-webkit-input-placeholder {
+ color: #aaa; }
+ body h1 {
+ -moz-border-radius-topleft: 8px;
+ -webkit-border-top-left-radius: 8px;
+ -o-border-top-left-radius: 8px;
+ -ms-border-top-left-radius: 8px;
+ -khtml-border-top-left-radius: 8px;
+ border-top-left-radius: 8px;
+ -moz-border-radius-topright: 8px;
+ -webkit-border-top-right-radius: 8px;
+ -o-border-top-right-radius: 8px;
+ -ms-border-top-right-radius: 8px;
+ -khtml-border-top-right-radius: 8px;
+ border-top-right-radius: 8px;
+ background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(49%, #f4f4f4), color-stop(51%, #ededed), color-stop(100%, #dedede));
+ background-image: -webkit-linear-gradient(#ffffff, #f4f4f4 49%, #ededed 51%, #dedede);
+ background-image: -moz-linear-gradient(#ffffff, #f4f4f4 49%, #ededed 51%, #dedede);
+ background-image: -o-linear-gradient(#ffffff, #f4f4f4 49%, #ededed 51%, #dedede);
+ background-image: linear-gradient(#ffffff, #f4f4f4 49%, #ededed 51%, #dedede);
+ text-shadow: white 0 1px 1px;
+ font-size: 15px;
+ position: absolute;
+ width: 600px;
+ height: 20px;
+ color: #53565e;
+ top: 0;
+ left: 0;
+ padding: 5px 10px;
+ border-bottom: 1px solid #bbbbbb; }
+ body .sc-checkbox input[type="checkbox"] {
+ margin-right: 7px; }
+ body ul {
+ margin: 10px 0 2px 0; }
+ body ul li {
+ padding: 5px; }
+ body ul li.is-done {
+ color: #B7B7B7;
+ text-decoration: line-through; }
+ body ul li:nth-child(odd) {
+ background-color: #F7F7F7; }
Oops, something went wrong.

0 comments on commit 2b2923e

Please sign in to comment.