From 5290cfb2f7b7065a4fcff3b77c271e092bb17dd8 Mon Sep 17 00:00:00 2001 From: Yan Li Date: Thu, 12 Dec 2013 01:49:02 -0500 Subject: [PATCH 1/4] added themes added xmas, playful, android-light, blueprint themes updated readme w/ theme instructions --- .gitignore | 4 + README.md | 185 ++++++++++++++++++++----------------- config.example.json | 5 - config.json | 5 + css/android-light.css | 46 +++++++++ css/blueprint.css | 56 +++++++++++ css/playful.css | 41 ++++++++ css/xmas.css | 30 ++++++ life.example.md => life.md | 0 sass/android-light.scss | 58 ++++++++++++ sass/blueprint.scss | 72 +++++++++++++++ sass/playful.scss | 56 +++++++++++ sass/xmas.scss | 40 ++++++++ 13 files changed, 507 insertions(+), 91 deletions(-) create mode 100644 .gitignore delete mode 100644 config.example.json create mode 100644 config.json create mode 100644 css/android-light.css create mode 100644 css/blueprint.css create mode 100644 css/playful.css create mode 100644 css/xmas.css rename life.example.md => life.md (100%) create mode 100644 sass/android-light.scss create mode 100644 sass/blueprint.scss create mode 100644 sass/playful.scss create mode 100644 sass/xmas.scss diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..cb05c41 --- /dev/null +++ b/.gitignore @@ -0,0 +1,4 @@ + +life-me.md + +README-new.md diff --git a/README.md b/README.md index 46267cf..3ba6aa0 100644 --- a/README.md +++ b/README.md @@ -1,86 +1,99 @@ -Life -==== - -This is something that I've wanted to build for a long time. It's a **timeline of important events** in my life, visualized in a way my mind always imagine it. There was something called [**Lifepath.me**](http://dcurt.is/facebook-timelines-and-lifepath-me-4) but now it's gone. How about Facebook timeline? Meh. - -So, this is it. Have a look at [cheeaun.github.io/life](http://cheeaun.github.io/life). - -Features --------- - -- Super simple -- No fancy formatting -- No fancy setup -- No fancy effects -- Flexible datetimes because sometimes you don't remember the exact date of an event - -How to contribute ------------------ - -1. Fork this project. -2. Write code. -3. Make pull requests. - -How to setup your own *Life* ----------------------------- - -1. Fork this project. -2. `git checkout -b gh-pages` (or any branch name you like) -3. Make a copy of `life.example.md`, rename it to `life.md`. -4. Add your life events into `life.md`. -5. Preview it on a local server. Use [`python -m SimpleHTTPServer`](http://docs.python.org/2/library/simplehttpserver.html) or [`http-server`](https://github.com/nodeapps/http-server). -6. Commit `life.md` (not in `master` branch). -7. `git push origin gh-pages -f` and publish to [GitHub Pages](http://pages.github.com/). -8. Update the website link in your GitHub repo description. -9. Tell the world about your Life. -10. Add your Life to the [Lives](https://github.com/cheeaun/life/wiki/Lives) page. - -How to upgrade your *Life* --------------------------- - -1. `git checkout master` -2. `git remote add cheeaun https://github.com/cheeaun/life.git` -3. `git fetch cheeaun` and `git merge cheeaun/master` to upgrade to latest Life. -4. `git checkout gh-pages` and `git merge master` to sync changes back to GitHub Pages. - -[Learn more](https://help.github.com/articles/fork-a-repo). - -For those who forked the earlier version of Life, these are the steps that I would recommend (requires some Git-fu): - -1. Backup your `life.md`. -2. Reset (hard) your fork to this repo's `master` branch. -3. Clean up your `gh-pages`. -4. Re-commit your `life.md` there. -5. Make sure your `master` branch is untouched so that future updates work. - -How to configure your *Life* ----------------------------- - -1. Make a copy of `config.example.json`, rename it to `config.json`. -2. Only commit it in `gh-pages` branch. - -The configuration: - -- `customStylesheetURL` - (*string*, default to `null`) Path to a custom stylesheet file, for those who doesn't like the default *theme*. -- `yearLength` - (*number*, default to `120`) The width of the year grids, in pixels. -- `hideAge` - (*boolean*, default to `false`) Option to hide age from year axis. - -Datetime "syntax" ------------------ - -- `2000` - event that happen in that year -- `01/2000` - event that happen in that month/year -- `01/01/2000` - event that happen exactly in that day/month/year -- `2001-2005`, `10/2001-02/03/2005` - event that happen within the two dates -- `~2005` - event that happen around the time in that year -- `2005-~` - event that happen from that year and beyond (now). - -Other people's Lives --------------------- - -Here's [a compilation of Lives from the people who has forked Life](https://github.com/cheeaun/life/wiki/Lives). - -License -------- - -[MIT](http://cheeaun.mit-license.org/) +Life +==== + +This is something that I've wanted to build for a long time. It's a **timeline of important events** in my life, visualized in a way my mind always imagine it. There was something called [**Lifepath.me**](http://dcurt.is/facebook-timelines-and-lifepath-me-4) but now it's gone. How about Facebook timeline? Meh. + +So, this is it. Have a look at [cheeaun.github.io/life](http://cheeaun.github.io/life). + +Features +-------- + +- Super simple +- No fancy formatting +- No fancy setup +- No fancy effects +- Flexible datetimes because sometimes you don't remember the exact date of an event + +- Themes: + - Xmas + - Android Light (uses Android colors) + - Playful (uses Android colors) + - Blueprint + +How to contribute +----------------- + +1. Fork this project. +2. Write code. +3. Make pull requests. + +How to setup your own *Life* +---------------------------- + +1. Fork this project. +2. `git checkout -b gh-pages` (or any branch name you like) +3. Make a copy of `life.example.md`, rename it to `life.md`. +4. Add your life events into `life.md`. +5. Preview it on a local server. Use [`python -m SimpleHTTPServer`](http://docs.python.org/2/library/simplehttpserver.html) or [`http-server`](https://github.com/nodeapps/http-server). +6. Commit `life.md` (not in `master` branch). +7. `git push origin gh-pages -f` and publish to [GitHub Pages](http://pages.github.com/). +8. Update the website link in your GitHub repo description. +9. Tell the world about your Life. +10. Add your Life to the [Lives](https://github.com/cheeaun/life/wiki/Lives) page. + +How to upgrade your *Life* +-------------------------- + +1. `git checkout master` +2. `git remote add cheeaun https://github.com/cheeaun/life.git` +3. `git fetch cheeaun` and `git merge cheeaun/master` to upgrade to latest Life. +4. `git checkout gh-pages` and `git merge master` to sync changes back to GitHub Pages. + +[Learn more](https://help.github.com/articles/fork-a-repo). + +For those who forked the earlier version of Life, these are the steps that I would recommend (requires some Git-fu): + +1. Backup your `life.md`. +2. Reset (hard) your fork to this repo's `master` branch. +3. Clean up your `gh-pages`. +4. Re-commit your `life.md` there. +5. Make sure your `master` branch is untouched so that future updates work. + +How to configure your *Life* +---------------------------- + +1. Make a copy of `config.example.json`, rename it to `config.json`. +2. Only commit it in `gh-pages` branch. + +The configuration: + +- `customStylesheetURL` - (*string*, default to `null`) Path to a custom stylesheet file, for those who doesn't like the default *theme*. +- `yearLength` - (*number*, default to `120`) The width of the year grids, in pixels. +- `hideAge` - (*boolean*, default to `false`) Option to hide age from year axis. + +How To theme your **Life** +-------- +1. Simply download your choice of `**theme**.css` file and place it into the `life` directory. +2. Change the `customStylesheetURL` string in the `config.json` file to the **path** of the downloaded `**theme**.css` file. + +The stylesheets were designed to overwrite the default inline styles. Feel free to replace the inline styles with these styles if you'd like that. + +Datetime "syntax" +----------------- + +- `2000` - event that happen in that year +- `01/2000` - event that happen in that month/year +- `01/01/2000` - event that happen exactly in that day/month/year +- `2001-2005`, `10/2001-02/03/2005` - event that happen within the two dates +- `~2005` - event that happen around the time in that year +- `2005-~` - event that happen from that year and beyond (now). + +Other people's Lives +-------------------- + +Here's [a compilation of Lives from the people who has forked Life](https://github.com/cheeaun/life/wiki/Lives). + +License +------- + +[MIT](http://cheeaun.mit-license.org/) diff --git a/config.example.json b/config.example.json deleted file mode 100644 index 83ce44a..0000000 --- a/config.example.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "customStylesheetURL": null, - "yearLength": 120, - "hideAge": false -} \ No newline at end of file diff --git a/config.json b/config.json new file mode 100644 index 0000000..43ccfd4 --- /dev/null +++ b/config.json @@ -0,0 +1,5 @@ +{ + "customStylesheetURL": "css/blueprint.css", + "yearLength": 120, + "hideAge": false +} \ No newline at end of file diff --git a/css/android-light.css b/css/android-light.css new file mode 100644 index 0000000..9782989 --- /dev/null +++ b/css/android-light.css @@ -0,0 +1,46 @@ +body { + background-color: white; + color: #33B5E5; } + +a { + color: #33B5E5; + opacity: 1; + text-decoration: none; } + a:hover { + text-decoration: underline; } + +header { + color: #33B5E5; } + header a { + color: #33B5E5; + opacity: 0.5; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; } + header a:hover { + opacity: 1; + text-decoration: none; } + +#life section.year { + border-left: 1px dashed rgba(0, 0, 0, 0.1); + color: rgba(0, 0, 0, 0.8); } + +#life .event b { + color: #FFBB33; + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; } +#life .event .time { + border-color: black; + opacity: 0.1; + -webkit-transition: opacity 0.3s linear; + -moz-transition: opacity 0.3s linear; + -o-transition: opacity 0.3s linear; + -ms-transition: opacity 0.3s linear; + transition: opacity 0.3s linear; } + #life .event .time:hover .time { + opacity: .75; } diff --git a/css/blueprint.css b/css/blueprint.css new file mode 100644 index 0000000..ac5a29a --- /dev/null +++ b/css/blueprint.css @@ -0,0 +1,56 @@ +body { + background-color: #215480; + color: rgba(255, 255, 255, 0.8); } + +a { + color: white; + opacity: 0.8; + text-decoration: none; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; } + a:hover { + text-decoration: underline; + opacity: 1; } + +header, header h1, header a { + color: white; } + header h1 { + opacity: 1; } + header a { + opacity: 0.8; } + header a:hover { + opacity: 1; } + +#life section.year { + border-left: 1px dashed rgba(255, 255, 255, 0.25); + color: rgba(255, 255, 255, 0.75); } + +#life .event { + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; } + #life .event:hover { + color: white; } + #life .event b { + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; } + #life .event:hover b { + color: rgba(255, 255, 255, 0.8); } + #life .event .time { + border-color: #0099CC; + opacity: 0.5; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; } + #life .event:hover .time { + opacity: 0.8; } diff --git a/css/playful.css b/css/playful.css new file mode 100644 index 0000000..892cd17 --- /dev/null +++ b/css/playful.css @@ -0,0 +1,41 @@ +body { + background-color: rgba(0, 0, 0, 0.8); + color: rgba(255, 255, 255, 0.8); } + +a { + color: #33B5E5; + opacity: 0.8; + text-decoration: none; } + a:hover { + opacity: 1; } + +header, header h1, header a { + color: #33B5E5; } + header h1 { + opacity: 1; } + header a { + opacity: 0.8; } + header a:hover { + text-decoration: none; } + +#life section.year { + border-left: 1px dashed rgba(255, 255, 255, 0.1); + color: rgba(255, 255, 255, 0.8); } + +#life .event b { + color: #FF4444; + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; } +#life .event .time { + border-color: #0099CC; + opacity: 0.5; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; } +#life .event:hover .time { + opacity: 1; } diff --git a/css/xmas.css b/css/xmas.css new file mode 100644 index 0000000..83c51b8 --- /dev/null +++ b/css/xmas.css @@ -0,0 +1,30 @@ +body { + background-color: #359D6E; + color: rgba(255, 255, 255, 0.8); } + +a { + color: white; + text-decoration: none; } + a:hover { + text-decoration: underline; } + +header a { + color: #B7F8FD; + opacity: 0.5; } + +#life section.year { + border-left: 1px dashed rgba(255, 255, 255, 0.25); + color: rgba(183, 248, 253, 0.5); } + +#life .event b { + color: #e9b443; + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; } +#life .event .time { + border-color: #973C31; + opacity: 1; } +#life .event:hover .time { + opacity: 1; } diff --git a/life.example.md b/life.md similarity index 100% rename from life.example.md rename to life.md diff --git a/sass/android-light.scss b/sass/android-light.scss new file mode 100644 index 0000000..d5eee72 --- /dev/null +++ b/sass/android-light.scss @@ -0,0 +1,58 @@ +body { + background-color:white; + color:#33B5E5; +} + +a { + color:#33B5E5; + opacity:1; + text-decoration: none; + &:hover { + text-decoration: underline; + } +} + +header { + color:#33B5E5; + a { + color: #33B5E5; + opacity: 0.5; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; + &:hover { + opacity:1; + text-decoration: none; + } + } +} + +#life section.year { + border-left: 1px dashed rgba(0,0,0,.1); + color: rgba(0, 0, 0,.8); +} + +#life .event { + b { + color:#FFBB33; + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; + } + .time { + border-color:black; + opacity: 0.1; + -webkit-transition: opacity 0.3s linear; + -moz-transition: opacity 0.3s linear; + -o-transition: opacity 0.3s linear; + -ms-transition: opacity 0.3s linear; + transition: opacity 0.3s linear; + &:hover .time { + opacity:.75; + } + } +} \ No newline at end of file diff --git a/sass/blueprint.scss b/sass/blueprint.scss new file mode 100644 index 0000000..af1f09a --- /dev/null +++ b/sass/blueprint.scss @@ -0,0 +1,72 @@ +body { + background-color: #215480; + color:rgba(255,255,255,0.8); +} + +a { + color:white; + opacity:0.8; + text-decoration: none; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; + &:hover { + text-decoration:underline; + opacity:1; + } +} + +header { + color:white; + h1 { + @extend header; + opacity: 1; + } + a { + @extend header; + opacity:0.8; + &:hover { + opacity:1; + } + } +} + +#life section.year { + border-left: 1px dashed rgba(255,255,255,.25); + color: rgba(255, 255, 255,.75); +} + +#life .event { + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; + &:hover { + color: rgba(255, 255, 255, 1); + } + b { + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; + } + &:hover b { + color:rgba(255,255,255,.8); + } + .time { + border-color: #0099CC; + opacity: 0.5; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; + } + &:hover .time { + opacity:0.8; + } +} \ No newline at end of file diff --git a/sass/playful.scss b/sass/playful.scss new file mode 100644 index 0000000..fccb313 --- /dev/null +++ b/sass/playful.scss @@ -0,0 +1,56 @@ +body { + background-color: rgba(0,0,0,0.8); + color:rgba(255,255,255,0.8); +} + +a { + color:#33B5E5; + opacity:0.8; + text-decoration: none; + &:hover { + opacity:1; + } +} + +header { + color:#33B5E5; + h1 { + @extend header; + opacity: 1; + } + a { + @extend header; + opacity:0.8; + &:hover { + text-decoration: none; + } + } +} + +#life section.year { + border-left: 1px dashed rgba(255,255,255,.1); + color: rgba(255, 255, 255,.8); +} + +#life .event { + b { + color: #FF4444; + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; + } + .time { + border-color: #0099CC; + opacity: 0.5; + -webkit-transition: opacity 0.5s ease; + -moz-transition: opacity 0.5s ease; + -o-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; + } + &:hover .time { + opacity:1; + } +} \ No newline at end of file diff --git a/sass/xmas.scss b/sass/xmas.scss new file mode 100644 index 0000000..be43f28 --- /dev/null +++ b/sass/xmas.scss @@ -0,0 +1,40 @@ +body { + background-color:#359D6E; + color: rgba(255, 255, 255,.8); +} + +a { + color: rgba(255, 255, 255,1); + text-decoration: none; + &:hover { + text-decoration: underline; + } +} + +header a { + color: #B7F8FD; + opacity: 0.5; +} + +#life section.year { + border-left: 1px dashed rgba(255,255,255,.25); + color: rgba(183, 248, 253,.5); +} + +#life .event { + b { + color:rgba(233, 180, 67,1); + -webkit-transition: color 0.5s ease; + -moz-transition: color 0.5s ease; + -o-transition: color 0.5s ease; + -ms-transition: color 0.5s ease; + transition: color 0.5s ease; + } + .time { + border-color:#973C31; + opacity: 1; + } + &:hover .time { + opacity:1; + } +} \ No newline at end of file From 1daf0c70f315bd7ce8becc7890766f55a5cb9481 Mon Sep 17 00:00:00 2001 From: Yan Li Date: Thu, 12 Dec 2013 01:52:29 -0500 Subject: [PATCH 2/4] formatting --- README.md | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 3ba6aa0..0aabbe1 100644 --- a/README.md +++ b/README.md @@ -13,12 +13,7 @@ Features - No fancy setup - No fancy effects - Flexible datetimes because sometimes you don't remember the exact date of an event - -- Themes: - - Xmas - - Android Light (uses Android colors) - - Playful (uses Android colors) - - Blueprint +- Themes: Xmas, Android Light (uses Android colors), Playful (uses Android colors), Blueprint How to contribute ----------------- @@ -71,12 +66,12 @@ The configuration: - `yearLength` - (*number*, default to `120`) The width of the year grids, in pixels. - `hideAge` - (*boolean*, default to `false`) Option to hide age from year axis. -How To theme your **Life** +How to theme your *Life* -------- -1. Simply download your choice of `**theme**.css` file and place it into the `life` directory. -2. Change the `customStylesheetURL` string in the `config.json` file to the **path** of the downloaded `**theme**.css` file. +1. Simply download your choice of `*theme*.css` file and place it into your `life` directory. +2. Change the `customStylesheetURL` string in the `config.json` file to the **path** of the downloaded `*theme*.css` file. -The stylesheets were designed to overwrite the default inline styles. Feel free to replace the inline styles with these styles if you'd like that. +The stylesheets were designed to overwrite the default inline styles. Feel free to replace the inline styles if you prefer that. Datetime "syntax" ----------------- From a01d82a1933d7e90066853f53f6bd610d76c0cfa Mon Sep 17 00:00:00 2001 From: Yan Li Date: Sat, 14 Dec 2013 00:13:57 -0500 Subject: [PATCH 3/4] refined styles, updated readme --- README.md | 5 ++--- css/android-light.css | 2 +- css/playful.css | 2 +- css/xmas.css | 14 ++++++++++++-- sass/android-light.scss | 2 +- sass/playful.scss | 2 +- sass/xmas.scss | 10 ++++++++++ 7 files changed, 28 insertions(+), 9 deletions(-) diff --git a/README.md b/README.md index 0aabbe1..be68fcc 100644 --- a/README.md +++ b/README.md @@ -68,10 +68,9 @@ The configuration: How to theme your *Life* -------- -1. Simply download your choice of `*theme*.css` file and place it into your `life` directory. -2. Change the `customStylesheetURL` string in the `config.json` file to the **path** of the downloaded `*theme*.css` file. +1. In your `config.json` file, change the `customStylesheetURL` string from `null` to `"css/theme.css"`, with quotatation marks. -The stylesheets were designed to overwrite the default inline styles. Feel free to replace the inline styles if you prefer that. +The stylesheets were designed to overwrite the default inline styles. Feel free to replace the inline styles instead if you'd prefer that. Datetime "syntax" ----------------- diff --git a/css/android-light.css b/css/android-light.css index 9782989..580426a 100644 --- a/css/android-light.css +++ b/css/android-light.css @@ -36,7 +36,7 @@ header { transition: color 0.5s ease; } #life .event .time { border-color: black; - opacity: 0.1; + opacity: 0.2; -webkit-transition: opacity 0.3s linear; -moz-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; diff --git a/css/playful.css b/css/playful.css index 892cd17..ad37017 100644 --- a/css/playful.css +++ b/css/playful.css @@ -10,7 +10,7 @@ a { opacity: 1; } header, header h1, header a { - color: #33B5E5; } + color: rgba(51, 181, 229, 0.8); } header h1 { opacity: 1; } header a { diff --git a/css/xmas.css b/css/xmas.css index 83c51b8..d9864ad 100644 --- a/css/xmas.css +++ b/css/xmas.css @@ -25,6 +25,16 @@ header a { transition: color 0.5s ease; } #life .event .time { border-color: #973C31; - opacity: 1; } + opacity: 1; + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + -ms-transition: all 0.5s ease; + transition: all 0.5s ease; } #life .event:hover .time { - opacity: 1; } + opacity: 1; + -webkit-box-shadow: 0px 0px 3px #973C31; + -moz-box-shadow: 0px 0px 3px #973C31; + -o-box-shadow: 0px 0px 3px #973C31; + -ms-box-shadow: 0px 0px 3px #973C31; + box-shadow: 0px 0px 3px #973C31; } diff --git a/sass/android-light.scss b/sass/android-light.scss index d5eee72..aff713b 100644 --- a/sass/android-light.scss +++ b/sass/android-light.scss @@ -45,7 +45,7 @@ header { } .time { border-color:black; - opacity: 0.1; + opacity: 0.2; -webkit-transition: opacity 0.3s linear; -moz-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; diff --git a/sass/playful.scss b/sass/playful.scss index fccb313..5a90380 100644 --- a/sass/playful.scss +++ b/sass/playful.scss @@ -13,7 +13,7 @@ a { } header { - color:#33B5E5; + color:rgba(51, 181, 229, 0.8); h1 { @extend header; opacity: 1; diff --git a/sass/xmas.scss b/sass/xmas.scss index be43f28..116aded 100644 --- a/sass/xmas.scss +++ b/sass/xmas.scss @@ -33,8 +33,18 @@ header a { .time { border-color:#973C31; opacity: 1; + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + -ms-transition: all 0.5s ease; + transition: all 0.5s ease; } &:hover .time { opacity:1; + -webkit-box-shadow: 0px 0px 3px #973C31; + -moz-box-shadow: 0px 0px 3px #973C31; + -o-box-shadow: 0px 0px 3px #973C31; + -ms-box-shadow: 0px 0px 3px #973C31; + box-shadow: 0px 0px 3px #973C31; } } \ No newline at end of file From b2fb74ee8481f303ff371c73d3b9c27aa085ec82 Mon Sep 17 00:00:00 2001 From: Yan Li Date: Sat, 14 Dec 2013 01:05:05 -0500 Subject: [PATCH 4/4] removed sass directory from remote --- .gitignore | 5 +-- sass/android-light.scss | 58 --------------------------------- sass/blueprint.scss | 72 ----------------------------------------- sass/playful.scss | 56 -------------------------------- sass/xmas.scss | 50 ---------------------------- 5 files changed, 1 insertion(+), 240 deletions(-) delete mode 100644 sass/android-light.scss delete mode 100644 sass/blueprint.scss delete mode 100644 sass/playful.scss delete mode 100644 sass/xmas.scss diff --git a/.gitignore b/.gitignore index cb05c41..30f3d9c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1 @@ - -life-me.md - -README-new.md +sass/ \ No newline at end of file diff --git a/sass/android-light.scss b/sass/android-light.scss deleted file mode 100644 index aff713b..0000000 --- a/sass/android-light.scss +++ /dev/null @@ -1,58 +0,0 @@ -body { - background-color:white; - color:#33B5E5; -} - -a { - color:#33B5E5; - opacity:1; - text-decoration: none; - &:hover { - text-decoration: underline; - } -} - -header { - color:#33B5E5; - a { - color: #33B5E5; - opacity: 0.5; - -webkit-transition: opacity 0.5s ease; - -moz-transition: opacity 0.5s ease; - -o-transition: opacity 0.5s ease; - -ms-transition: opacity 0.5s ease; - transition: opacity 0.5s ease; - &:hover { - opacity:1; - text-decoration: none; - } - } -} - -#life section.year { - border-left: 1px dashed rgba(0,0,0,.1); - color: rgba(0, 0, 0,.8); -} - -#life .event { - b { - color:#FFBB33; - -webkit-transition: color 0.5s ease; - -moz-transition: color 0.5s ease; - -o-transition: color 0.5s ease; - -ms-transition: color 0.5s ease; - transition: color 0.5s ease; - } - .time { - border-color:black; - opacity: 0.2; - -webkit-transition: opacity 0.3s linear; - -moz-transition: opacity 0.3s linear; - -o-transition: opacity 0.3s linear; - -ms-transition: opacity 0.3s linear; - transition: opacity 0.3s linear; - &:hover .time { - opacity:.75; - } - } -} \ No newline at end of file diff --git a/sass/blueprint.scss b/sass/blueprint.scss deleted file mode 100644 index af1f09a..0000000 --- a/sass/blueprint.scss +++ /dev/null @@ -1,72 +0,0 @@ -body { - background-color: #215480; - color:rgba(255,255,255,0.8); -} - -a { - color:white; - opacity:0.8; - text-decoration: none; - -webkit-transition: opacity 0.5s ease; - -moz-transition: opacity 0.5s ease; - -o-transition: opacity 0.5s ease; - -ms-transition: opacity 0.5s ease; - transition: opacity 0.5s ease; - &:hover { - text-decoration:underline; - opacity:1; - } -} - -header { - color:white; - h1 { - @extend header; - opacity: 1; - } - a { - @extend header; - opacity:0.8; - &:hover { - opacity:1; - } - } -} - -#life section.year { - border-left: 1px dashed rgba(255,255,255,.25); - color: rgba(255, 255, 255,.75); -} - -#life .event { - -webkit-transition: color 0.5s ease; - -moz-transition: color 0.5s ease; - -o-transition: color 0.5s ease; - -ms-transition: color 0.5s ease; - transition: color 0.5s ease; - &:hover { - color: rgba(255, 255, 255, 1); - } - b { - -webkit-transition: color 0.5s ease; - -moz-transition: color 0.5s ease; - -o-transition: color 0.5s ease; - -ms-transition: color 0.5s ease; - transition: color 0.5s ease; - } - &:hover b { - color:rgba(255,255,255,.8); - } - .time { - border-color: #0099CC; - opacity: 0.5; - -webkit-transition: opacity 0.5s ease; - -moz-transition: opacity 0.5s ease; - -o-transition: opacity 0.5s ease; - -ms-transition: opacity 0.5s ease; - transition: opacity 0.5s ease; - } - &:hover .time { - opacity:0.8; - } -} \ No newline at end of file diff --git a/sass/playful.scss b/sass/playful.scss deleted file mode 100644 index 5a90380..0000000 --- a/sass/playful.scss +++ /dev/null @@ -1,56 +0,0 @@ -body { - background-color: rgba(0,0,0,0.8); - color:rgba(255,255,255,0.8); -} - -a { - color:#33B5E5; - opacity:0.8; - text-decoration: none; - &:hover { - opacity:1; - } -} - -header { - color:rgba(51, 181, 229, 0.8); - h1 { - @extend header; - opacity: 1; - } - a { - @extend header; - opacity:0.8; - &:hover { - text-decoration: none; - } - } -} - -#life section.year { - border-left: 1px dashed rgba(255,255,255,.1); - color: rgba(255, 255, 255,.8); -} - -#life .event { - b { - color: #FF4444; - -webkit-transition: color 0.5s ease; - -moz-transition: color 0.5s ease; - -o-transition: color 0.5s ease; - -ms-transition: color 0.5s ease; - transition: color 0.5s ease; - } - .time { - border-color: #0099CC; - opacity: 0.5; - -webkit-transition: opacity 0.5s ease; - -moz-transition: opacity 0.5s ease; - -o-transition: opacity 0.5s ease; - -ms-transition: opacity 0.5s ease; - transition: opacity 0.5s ease; - } - &:hover .time { - opacity:1; - } -} \ No newline at end of file diff --git a/sass/xmas.scss b/sass/xmas.scss deleted file mode 100644 index 116aded..0000000 --- a/sass/xmas.scss +++ /dev/null @@ -1,50 +0,0 @@ -body { - background-color:#359D6E; - color: rgba(255, 255, 255,.8); -} - -a { - color: rgba(255, 255, 255,1); - text-decoration: none; - &:hover { - text-decoration: underline; - } -} - -header a { - color: #B7F8FD; - opacity: 0.5; -} - -#life section.year { - border-left: 1px dashed rgba(255,255,255,.25); - color: rgba(183, 248, 253,.5); -} - -#life .event { - b { - color:rgba(233, 180, 67,1); - -webkit-transition: color 0.5s ease; - -moz-transition: color 0.5s ease; - -o-transition: color 0.5s ease; - -ms-transition: color 0.5s ease; - transition: color 0.5s ease; - } - .time { - border-color:#973C31; - opacity: 1; - -webkit-transition: all 0.5s ease; - -moz-transition: all 0.5s ease; - -o-transition: all 0.5s ease; - -ms-transition: all 0.5s ease; - transition: all 0.5s ease; - } - &:hover .time { - opacity:1; - -webkit-box-shadow: 0px 0px 3px #973C31; - -moz-box-shadow: 0px 0px 3px #973C31; - -o-box-shadow: 0px 0px 3px #973C31; - -ms-box-shadow: 0px 0px 3px #973C31; - box-shadow: 0px 0px 3px #973C31; - } -} \ No newline at end of file