diff --git a/css/style-dark.css b/css/style-dark.css new file mode 100644 index 0000000..813c291 --- /dev/null +++ b/css/style-dark.css @@ -0,0 +1,90 @@ +/*** GENERAL ***/ +body { + color: #fff; + background-color: #0d0d0d; +} + +a, a:hover, a:visited { + color: #fff; +} + +#main ul#links li a.current { + background-color: #000; + color: #fff; +} + +#links a:hover, .backhome a:hover{ + background-color: #fff; + color: #000; +} + +input[type=submit].delete { + background : url('../img/dark/remove.png') no-repeat center center; + color : transparent; +} + +#main .entrie { + color: #fff; + background-color: #000; + border: 1px solid #fff; +} + +#main .entrie h2 a:hover { + color: #29B1E3; +} + +a.fav span { + background: url('../img/dark/star-on.png') no-repeat; +} + +a.fav span:hover { + background: url('../img/dark/star-off.png') no-repeat; +} + +a.fav-off span { + background: url('../img/dark/star-off.png') no-repeat; +} + +a.fav-off span:hover { + background: url('../img/dark/star-on.png') no-repeat; +} + +a.archive span { + background: url('../img/dark/checkmark-on.png') no-repeat; +} + +a.archive span:hover { + background: url('../img/dark/checkmark-off.png') no-repeat; +} + +a.archive-off span { + background: url('../img/dark/checkmark-off.png') no-repeat; +} + +a.archive-off span:hover { + background: url('../img/dark/checkmark-on.png') no-repeat; +} + +/*** ***/ +/*** ARTICLE PAGE ***/ + +body.article { + color: #fff; + background-color: #0d0d0d; +} + +#article header { + border-bottom: 1px solid #222222; +} + +#article article { + border-bottom: 1px solid #222222; +} + +.vieworiginal a { + color: #888888; +} + +.entrie { + background-color: #fff; +} diff --git a/css/style-light.css b/css/style-light.css new file mode 100644 index 0000000..5b9c6c1 --- /dev/null +++ b/css/style-light.css @@ -0,0 +1,90 @@ +/*** GENERAL ***/ +body { + color: #222222; + background-color: #F1F1F1; +} + +a, a:hover, a:visited { + color: #000; +} + +#main ul#links li a.current { + background-color: #000; + color: #fff; +} + +#links a:hover, .backhome a:hover{ + background-color: #040707; + color: #F1F1F1; +} + +input[type=submit].delete { + background : url('../img/light/remove.png') no-repeat center center; + color : transparent; +} + +#main .entrie { + color: #2e2e2e; + background-color: #ffffff; + border: 1px solid #000; +} + +#main .entrie h2 a:hover { + color: #F5BE00; +} + +a.fav span { + background: url('../img/light/star-on.png') no-repeat; +} + +a.fav span:hover { + background: url('../img/light/star-off.png') no-repeat; +} + +a.fav-off span { + background: url('../img/light/star-off.png') no-repeat; +} + +a.fav-off span:hover { + background: url('../img/light/star-on.png') no-repeat; +} + +a.archive span { + background: url('../img/light/checkmark-on.png') no-repeat; +} + +a.archive span:hover { + background: url('../img/light/checkmark-off.png') no-repeat; +} + +a.archive-off span { + background: url('../img/light/checkmark-off.png') no-repeat; +} + +a.archive-off span:hover { + background: url('../img/light/checkmark-on.png') no-repeat; +} + +/*** ***/ +/*** ARTICLE PAGE ***/ + +body.article { + color: #222222; + background-color: #F1F1F1; +} + +#article header { + border-bottom: 1px solid #222222; +} + +#article article { + border-bottom: 1px solid #222222; +} + +.vieworiginal a { + color: #888888; +} + +.entrie { + background-color: #fff; +} diff --git a/css/style.css b/css/style.css index 29dca28..7fc8f05 100644 --- a/css/style.css +++ b/css/style.css @@ -1,16 +1,10 @@ /*** GENERAL ***/ body { - color: #222222; font: 20px/1.3em Palatino,Georgia,serif; - background-color: #F1F1F1; margin: 10px; } -a, a:hover, a:visited { - color: #000; -} - header { text-align: center; } @@ -28,8 +22,6 @@ header { #main ul#links li a.current { -webkit-border-radius: 2px; border-radius: 2px; - background-color: #040707; - color: #F1F1F1; } #main ul#sort { @@ -58,8 +50,6 @@ header { #links a:hover, .backhome a:hover{ -webkit-border-radius: 2px; border-radius: 2px; - background-color: #040707; - color: #F1F1F1; } footer { @@ -80,11 +70,9 @@ ul#login li { } input[type=submit].delete { - background : url('../img/remove.png') no-repeat center center; width : 16px; height :16px; border : none; - color : transparent; cursor: pointer; font-size : 0; } @@ -94,8 +82,6 @@ input[type=submit].delete { } #main .entrie { - color: rgb(46, 46, 46); - background-color: #ffffff; padding: 15px; min-height: 8em; border: 1px solid; @@ -105,10 +91,6 @@ input[type=submit].delete { text-decoration: none; } -#main .entrie h2 a:hover { - color: #F5BE00; -} - .tools { text-align: right; } @@ -145,62 +127,23 @@ input[type=submit].delete { height: 16px; } -a.fav span { - background: url('../img/star-on.png') no-repeat; -} - -a.fav span:hover { - background: url('../img/star-off.png') no-repeat; -} - -a.fav-off span { - background: url('../img/star-off.png') no-repeat; -} - -a.fav-off span:hover { - background: url('../img/star-on.png') no-repeat; -} - -a.archive span { - background: url('../img/checkmark-on.png') no-repeat; -} - -a.archive span:hover { - background: url('../img/checkmark-off.png') no-repeat; -} - -a.archive-off span { - background: url('../img/checkmark-off.png') no-repeat; -} - -a.archive-off span:hover { - background: url('../img/checkmark-on.png') no-repeat; -} /*** ***/ /*** ARTICLE PAGE ***/ body.article { - color: #222222; font: 20px/1.3em Palatino,Georgia,serif; - background-color: #F1F1F1; } #article header { text-align: left; - border-bottom: 1px solid #222222; } #article header a { text-decoration: none; } -#article article { - border-bottom: 1px solid #222222; -} - .vieworiginal a { - color: #888888; text-decoration: none; } diff --git a/img/dark/checkmark-off.png b/img/dark/checkmark-off.png new file mode 100644 index 0000000..efc3439 Binary files /dev/null and b/img/dark/checkmark-off.png differ diff --git a/img/dark/checkmark-on.png b/img/dark/checkmark-on.png new file mode 100644 index 0000000..24391c2 Binary files /dev/null and b/img/dark/checkmark-on.png differ diff --git a/img/dark/down.png b/img/dark/down.png new file mode 100644 index 0000000..41ea960 Binary files /dev/null and b/img/dark/down.png differ diff --git a/img/dark/logo.png b/img/dark/logo.png new file mode 100644 index 0000000..9fba064 Binary files /dev/null and b/img/dark/logo.png differ diff --git a/img/dark/remove.png b/img/dark/remove.png new file mode 100644 index 0000000..41786fd Binary files /dev/null and b/img/dark/remove.png differ diff --git a/img/dark/star-off.png b/img/dark/star-off.png new file mode 100644 index 0000000..90651b5 Binary files /dev/null and b/img/dark/star-off.png differ diff --git a/img/dark/star-on.png b/img/dark/star-on.png new file mode 100644 index 0000000..7fc1447 Binary files /dev/null and b/img/dark/star-on.png differ diff --git a/img/dark/up.png b/img/dark/up.png new file mode 100644 index 0000000..1679e18 Binary files /dev/null and b/img/dark/up.png differ diff --git a/img/checkmark-off.png b/img/light/checkmark-off.png similarity index 100% rename from img/checkmark-off.png rename to img/light/checkmark-off.png diff --git a/img/checkmark-on.png b/img/light/checkmark-on.png similarity index 100% rename from img/checkmark-on.png rename to img/light/checkmark-on.png diff --git a/img/remove.png b/img/light/remove.png similarity index 100% rename from img/remove.png rename to img/light/remove.png diff --git a/img/star-off.png b/img/light/star-off.png similarity index 100% rename from img/star-off.png rename to img/light/star-off.png diff --git a/img/star-on.png b/img/light/star-on.png similarity index 100% rename from img/star-on.png rename to img/light/star-on.png diff --git a/js/poche.js b/js/poche.js index 6bc3c18..d27ecbb 100644 --- a/js/poche.js +++ b/js/poche.js @@ -27,4 +27,32 @@ function sort_links(view, sort) { $.get('index.php', { view: view, sort: sort, full_head: 'no' }, function(data) { $('#content').html(data); }); -} \ No newline at end of file +} + + +// ---------- Swith light or dark view +function setActiveStyleSheet(title) { + var i, a, main; + for(i=0; (a = document.getElementsByTagName("link")[i]); i++) { + if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) { + a.disabled = true; + if(a.getAttribute("title") == title) a.disabled = false; + } + } +} +$('#themeswitch').click(function() { + // we want the dark + if ($('body').hasClass('light-style')) { + setActiveStyleSheet('dark-style'); + $('body').addClass('dark-style'); + $('body').removeClass('light-style'); + $('#themeswitch').text('light'); + // we want the light + } else if ($('body').hasClass('dark-style')) { + setActiveStyleSheet('light-style'); + $('body').addClass('light-style'); + $('body').removeClass('dark-style'); + $('#themeswitch').text('dark'); + } + return false; +}); diff --git a/tpl/head.html b/tpl/head.html index 6fcf974..66b6895 100644 --- a/tpl/head.html +++ b/tpl/head.html @@ -15,8 +15,12 @@ + + + + - +

logo pochepoche

diff --git a/tpl/home.html b/tpl/home.html index 6fb9444..62c77bd 100644 --- a/tpl/home.html +++ b/tpl/home.html @@ -2,6 +2,7 @@
  • home
  • favorites
  • archive
    • +
  • dark
  • poche it !
  • logout
    • diff --git a/tpl/view.html b/tpl/view.html index 4b8ce60..9ba5e20 100644 --- a/tpl/view.html +++ b/tpl/view.html @@ -15,8 +15,12 @@ + + + + - +
    ← @@ -24,6 +28,7 @@