aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorJay Sitter <jsitter@gmail.com>2014-11-21 15:30:59 -0500
committerJay Sitter <jsitter@gmail.com>2014-11-21 15:30:59 -0500
commitfc01f94387c3c41ca0d7c6d4ad8ed1d6678abfdd (patch)
treeca9e9d46404df5d2c74846ec78bd711d95cb4a6b
parente9d4d17693e2d85f1a17a29f3e82e5d0235a10ad (diff)
downloadwallabag-fc01f94387c3c41ca0d7c6d4ad8ed1d6678abfdd.tar.gz
wallabag-fc01f94387c3c41ca0d7c6d4ad8ed1d6678abfdd.tar.zst
wallabag-fc01f94387c3c41ca0d7c6d4ad8ed1d6678abfdd.zip
Globalizing and creating two variants of Carrot.org icon; tidying up some CSS
-rw-r--r--themes/_global/img/icons/carrot-icon--black.pngbin0 -> 1538 bytes
-rw-r--r--themes/_global/img/icons/carrot-icon--white.pngbin0 -> 1605 bytes
-rwxr-xr-xthemes/baggy/css/main.css76
-rwxr-xr-xthemes/baggy/view.twig4
-rwxr-xr-xthemes/default/css/style-default.css5
-rw-r--r--themes/default/img/default/carrot.pngbin718 -> 0 bytes
6 files changed, 52 insertions, 33 deletions
diff --git a/themes/_global/img/icons/carrot-icon--black.png b/themes/_global/img/icons/carrot-icon--black.png
new file mode 100644
index 00000000..6da7925b
--- /dev/null
+++ b/themes/_global/img/icons/carrot-icon--black.png
Binary files differ
diff --git a/themes/_global/img/icons/carrot-icon--white.png b/themes/_global/img/icons/carrot-icon--white.png
new file mode 100644
index 00000000..a70044b6
--- /dev/null
+++ b/themes/_global/img/icons/carrot-icon--white.png
Binary files differ
diff --git a/themes/baggy/css/main.css b/themes/baggy/css/main.css
index 76d92003..568eb116 100755
--- a/themes/baggy/css/main.css
+++ b/themes/baggy/css/main.css
@@ -15,11 +15,11 @@ html {
15} 15}
16 16
17body { 17body {
18 background: #EEE; 18 background-color: #EEE;
19} 19}
20 20
21.login { 21.login {
22 background: #333; 22 background-color: #333;
23} 23}
24 24
25.login #main { 25.login #main {
@@ -28,7 +28,7 @@ body {
28} 28}
29 29
30.login form { 30.login form {
31 background: #FFF; 31 background-color: #FFF;
32 padding: 1.5em; 32 padding: 1.5em;
33 box-shadow: 0 1px 8px rgba(0,0,0,0.9); 33 box-shadow: 0 1px 8px rgba(0,0,0,0.9);
34 width: 20em; 34 width: 20em;
@@ -51,7 +51,7 @@ body {
51 51
52::selection { 52::selection {
53 color: #FFF; 53 color: #FFF;
54 background: #000; 54 background-color: #000;
55} 55}
56 56
57.desktopHide { 57.desktopHide {
@@ -129,7 +129,7 @@ form .row {
129 129
130form button, input[type="submit"] { 130form button, input[type="submit"] {
131 cursor:pointer; 131 cursor:pointer;
132 background: #000; 132 background-color: #000;
133 color: #FFF; 133 color: #FFF;
134 border:0; 134 border:0;
135 padding: 0.5em 1em; 135 padding: 0.5em 1em;
@@ -138,7 +138,7 @@ form button, input[type="submit"] {
138} 138}
139 139
140 form button:hover, form button:focus, input[type="submit"]:hover, input[type="submit"]:focus { 140 form button:hover, form button:focus, input[type="submit"]:hover, input[type="submit"]:focus {
141 background: #FFF; 141 background-color: #FFF;
142 color: #000; 142 color: #000;
143 -webkit-transition: all 0.5s ease; 143 -webkit-transition: all 0.5s ease;
144 -moz-transition: all 0.5s ease; 144 -moz-transition: all 0.5s ease;
@@ -155,7 +155,7 @@ h2:after {
155 content: ""; 155 content: "";
156 height: 4px; 156 height: 4px;
157 width: 70px; 157 width: 70px;
158 background: #000; 158 background-color: #000;
159 display: block; 159 display: block;
160} 160}
161 161
@@ -176,7 +176,7 @@ h2:after {
176 width: 10em; 176 width: 10em;
177 left: 0; 177 left: 0;
178 text-align: right; 178 text-align: right;
179 background: #333; 179 background-color: #333;
180 padding-top: 9.5em; 180 padding-top: 9.5em;
181 height: 100%; 181 height: 100%;
182 box-shadow:inset -4px 0 20px rgba(0,0,0,0.6); 182 box-shadow:inset -4px 0 20px rgba(0,0,0,0.6);
@@ -208,7 +208,7 @@ h2:after {
208 } 208 }
209 209
210 #links > li > a:hover, #links > li > a:focus { 210 #links > li > a:hover, #links > li > a:focus {
211 background: #999; 211 background-color: #999;
212 color: #000; 212 color: #000;
213 } 213 }
214 214
@@ -344,7 +344,7 @@ footer a {
344} 344}
345 345
346.entrie { 346.entrie {
347 background: #FFF; 347 background-color: #FFF;
348 letter-spacing:normal; 348 letter-spacing:normal;
349 box-shadow: 0 3px 7px rgba(0,0,0,0.3); 349 box-shadow: 0 3px 7px rgba(0,0,0,0.3);
350 display: inline-block; 350 display: inline-block;
@@ -391,7 +391,7 @@ footer a {
391 width: 100%; 391 width: 100%;
392 bottom: 0; 392 bottom: 0;
393 left: 0; 393 left: 0;
394 background: #000; 394 background-color: #000;
395 -webkit-transition: all 0.5s ease; 395 -webkit-transition: all 0.5s ease;
396 -moz-transition: all 0.5s ease; 396 -moz-transition: all 0.5s ease;
397 -ms-transition: all 0.5s ease; 397 -ms-transition: all 0.5s ease;
@@ -557,7 +557,7 @@ footer a {
557} 557}
558 558
559 .popup-form form { 559 .popup-form form {
560 background: #FFF; 560 background-color: #FFF;
561 position: absolute; 561 position: absolute;
562 top: 0; 562 top: 0;
563 left: 0; 563 left: 0;
@@ -574,7 +574,7 @@ footer a {
574 574
575.closeMessage, 575.closeMessage,
576.close-button { 576.close-button {
577 background: #000; 577 background-color: #000;
578 color: #FFF; 578 color: #FFF;
579 font-size: 1.2em; 579 font-size: 1.2em;
580 line-height: 1.6; 580 line-height: 1.6;
@@ -587,7 +587,7 @@ footer a {
587 .closeMessage:focus, 587 .closeMessage:focus,
588 .close-button:hover, 588 .close-button:hover,
589 .close-button:focus { 589 .close-button:focus {
590 background: #999; 590 background-color: #999;
591 color: #000; 591 color: #000;
592 } 592 }
593 593
@@ -657,17 +657,18 @@ a.add-to-wallabag-link-after:after {
657@font-face { 657@font-face {
658 font-family: 'icomoon'; 658 font-family: 'icomoon';
659 src:url('../fonts/icomoon.eot?-s0mcsx'); 659 src:url('../fonts/icomoon.eot?-s0mcsx');
660 src:url('../fonts/icomoon.eot?#iefix-s0mcsx') format('embedded-opentype'), 660 src:url('../fonts/icomoon.eot?#iefix-s0mcsx') format('embedded-opentype'),
661 url('../fonts/icomoon.woff?-s0mcsx') format('woff'), 661 url('../fonts/icomoon.woff?-s0mcsx') format('woff'),
662 url('../fonts/icomoon.ttf?-s0mcsx') format('truetype'), 662 url('../fonts/icomoon.ttf?-s0mcsx') format('truetype'),
663 url('../fonts/icomoon.svg?-s0mcsx#icomoon') format('svg'); 663 url('../fonts/icomoon.svg?-s0mcsx#icomoon') format('svg');
664 font-weight: normal; 664 font-weight: normal;
665 font-style: normal; 665 font-style: normal;
666} 666}
667 667
668.icon span { 668.icon span,
669 position: absolute; 669.icon-image span {
670 top: -9999px; 670 display: inline-block;
671 text-indent: -9999px;
671} 672}
672 673
673[class^="icon-"]:before, [class*=" icon-"]:before { 674[class^="icon-"]:before, [class*=" icon-"]:before {
@@ -736,6 +737,23 @@ a.add-to-wallabag-link-after:after {
736 content: "\e80d"; 737 content: "\e80d";
737} 738}
738 739
740
741/* .icon-image class, for image-based icons
742 ========================================================================== */
743
744.icon-image {
745 background-size: 16px 16px;
746 background-repeat: no-repeat;
747 background-position: center;
748 padding-right: 1em !important;
749 padding-left: 1em !important;
750}
751
752/* Carrot (http://carrot.org) */
753.icon-image--carrot {
754 background-image: url('../../_global/img/icons/carrot-icon--white.png');
755}
756
739/* ========================================================================== 757/* ==========================================================================
740 Icon selected 758 Icon selected
741 ========================================================================== */ 759 ========================================================================== */
@@ -805,7 +823,7 @@ a.add-to-wallabag-link-after:after {
805 823
806blockquote { 824blockquote {
807 border:1px solid #999; 825 border:1px solid #999;
808 background: #FFF; 826 background-color: #FFF;
809 padding: 1em; 827 padding: 1em;
810 margin: 0; 828 margin: 0;
811} 829}
@@ -838,14 +856,14 @@ blockquote {
838} 856}
839 857
840#article_toolbar a { 858#article_toolbar a {
841 background: #000; 859 background-color: #000;
842 padding: 0.3em 0.5em 0.2em; 860 padding: 0.3em 0.5em 0.2em;
843 color: #FFF; 861 color: #FFF;
844 text-decoration: none; 862 text-decoration: none;
845} 863}
846 864
847 #article_toolbar a:hover, #article_toolbar a:focus { 865 #article_toolbar a:hover, #article_toolbar a:focus {
848 background: #999; 866 background-color: #999;
849 } 867 }
850 868
851.shaarli:before { 869.shaarli:before {
@@ -868,7 +886,7 @@ blockquote {
868} 886}
869 887
870.icon-rss { 888.icon-rss {
871 background: #000; 889 background-color: #000;
872 color: #FFF; 890 color: #FFF;
873 padding: 0.2em 0.5em; 891 padding: 0.2em 0.5em;
874} 892}
@@ -883,7 +901,7 @@ blockquote {
883} 901}
884 902
885.list-tags .icon-rss:hover, .list-tags .icon-rss:focus { 903.list-tags .icon-rss:hover, .list-tags .icon-rss:focus {
886 background: #FFF; 904 background-color: #FFF;
887 color: #000; 905 color: #000;
888 text-decoration: none; 906 text-decoration: none;
889} 907}
@@ -944,7 +962,7 @@ pre code {
944 margin-left: 0; 962 margin-left: 0;
945 } 963 }
946 body > header { 964 body > header {
947 background: #333; 965 background-color: #333;
948 position: fixed; 966 position: fixed;
949 top: 0; 967 top: 0;
950 width: 100%; 968 width: 100%;
@@ -990,11 +1008,11 @@ pre code {
990 width: 2.5em; 1008 width: 2.5em;
991 height: 2.5em; 1009 height: 2.5em;
992 cursor: pointer; 1010 cursor: pointer;
993 background: #999; 1011 background-color: #999;
994 font-size: 1.2em; 1012 font-size: 1.2em;
995 } 1013 }
996 .desktopHide:hover, .desktopHide:focus { 1014 .desktopHide:hover, .desktopHide:focus {
997 background: #FFF; 1015 background-color: #FFF;
998 } 1016 }
999 #links { 1017 #links {
1000 display: none; 1018 display: none;
diff --git a/themes/baggy/view.twig b/themes/baggy/view.twig
index 9182ee75..ee964031 100755
--- a/themes/baggy/view.twig
+++ b/themes/baggy/view.twig
@@ -16,7 +16,7 @@
16 {% if constant('SHARE_MAIL') == 1 %}<li><a href="mailto:?subject={{ entry.title|url_encode }}&amp;body={{ entry.url|url_encode }}%20via%20@wallabagapp" class="tool email icon icon-mail" title="{% trans "Email" %}"><span>{% trans "Email" %}</span></a></li>{% endif %} 16 {% if constant('SHARE_MAIL') == 1 %}<li><a href="mailto:?subject={{ entry.title|url_encode }}&amp;body={{ entry.url|url_encode }}%20via%20@wallabagapp" class="tool email icon icon-mail" title="{% trans "Email" %}"><span>{% trans "Email" %}</span></a></li>{% endif %}
17 {% if constant('SHARE_SHAARLI') == 1 %}<li><a href="{{ constant('SHAARLI_URL') }}/index.php?post={{ entry.url|url_encode }}&amp;title={{ entry.title|url_encode }}" target="_blank" class="tool shaarli" title="{% trans "shaarli" %}"><span>{% trans "shaarli" %}</span></a></li>{% endif %} 17 {% if constant('SHARE_SHAARLI') == 1 %}<li><a href="{{ constant('SHAARLI_URL') }}/index.php?post={{ entry.url|url_encode }}&amp;title={{ entry.title|url_encode }}" target="_blank" class="tool shaarli" title="{% trans "shaarli" %}"><span>{% trans "shaarli" %}</span></a></li>{% endif %}
18 {% if constant('FLATTR') == 1 %}{% if flattr.status == constant('FLATTRABLE') %}<li><a href="http://flattr.com/submit/auto?url={{ entry.url }}" class="tool flattr icon icon-flattr" target="_blank" title="{% trans "flattr" %}"><span>{% trans "flattr" %}</span></a></li>{% elseif flattr.status == constant('FLATTRED') %}<li><a href="{{ flattr.flattrItemURL }}" class="tool flattr icon icon-flattr" target="_blank" title="{% trans "flattr" %}"><span>{% trans "flattr" %}</span> ({{ flattr.numFlattrs }})</a></li>{% endif %}{% endif %} 18 {% if constant('FLATTR') == 1 %}{% if flattr.status == constant('FLATTRABLE') %}<li><a href="http://flattr.com/submit/auto?url={{ entry.url }}" class="tool flattr icon icon-flattr" target="_blank" title="{% trans "flattr" %}"><span>{% trans "flattr" %}</span></a></li>{% elseif flattr.status == constant('FLATTRED') %}<li><a href="{{ flattr.flattrItemURL }}" class="tool flattr icon icon-flattr" target="_blank" title="{% trans "flattr" %}"><span>{% trans "flattr" %}</span> ({{ flattr.numFlattrs }})</a></li>{% endif %}{% endif %}
19 {% if constant('CARROT') == 1 %}<li><a href="https://secure.carrot.org/GiveAndGetBack.do?url={{ entry.url|url_encode }}&title={{ entry.title|url_encode }}" target="_blank" title="{% trans "carrot" %}"><span>Carrot</span></a></li>{% endif %} 19 {% if constant('CARROT') == 1 %}<li><a href="https://secure.carrot.org/GiveAndGetBack.do?url={{ entry.url|url_encode }}&title={{ entry.title|url_encode }}" class="tool carrot icon-image icon-image--carrot" target="_blank" title="{% trans "carrot" %}"><span>Carrot</span></a></li>{% endif %}
20 {% if constant('SHOW_PRINTLINK') == 1 %}<li><a title="{% trans "Print" %}" class="tool icon icon-print" href="javascript: window.print();"><span>{% trans "Print" %}</span></a></li>{% endif %} 20 {% if constant('SHOW_PRINTLINK') == 1 %}<li><a title="{% trans "Print" %}" class="tool icon icon-print" href="javascript: window.print();"><span>{% trans "Print" %}</span></a></li>{% endif %}
21 <li><a href="./?epub&amp;method=id&amp;value={{ entry.id|e }}" title="Generate epub file">EPUB</a></li> 21 <li><a href="./?epub&amp;method=id&amp;value={{ entry.id|e }}" title="Generate epub file">EPUB</a></li>
22 <li><a href="mailto:hello@wallabag.org?subject=Wrong%20display%20in%20wallabag&amp;body={{ entry.url|url_encode }}" title="{% trans "Does this article appear wrong?" %}" class="tool bad-display icon icon-delete"><span>{% trans "Does this article appear wrong?" %}</span></a></li> 22 <li><a href="mailto:hello@wallabag.org?subject=Wrong%20display%20in%20wallabag&amp;body={{ entry.url|url_encode }}" title="{% trans "Does this article appear wrong?" %}" class="tool bad-display icon icon-delete"><span>{% trans "Does this article appear wrong?" %}</span></a></li>
@@ -96,4 +96,4 @@
96 }); 96 });
97 }); 97 });
98 </script> 98 </script>
99{% endblock %} \ No newline at end of file 99{% endblock %}
diff --git a/themes/default/css/style-default.css b/themes/default/css/style-default.css
index d00647ab..6ff2aca6 100755
--- a/themes/default/css/style-default.css
+++ b/themes/default/css/style-default.css
@@ -39,7 +39,8 @@ a.flattr span {
39} 39}
40 40
41a.carrot span { 41a.carrot span {
42 background-image: url('../img/default/carrot.png') 42 background-image: url('../../_global/img/icons/carrot-icon--black.png');
43 background-size: 16px 16px;
43} 44}
44 45
45a.email span { 46a.email span {
@@ -60,4 +61,4 @@ a.bad-display span {
60 61
61a.print span { 62a.print span {
62 background-image: url('../img/default/print.png'); 63 background-image: url('../img/default/print.png');
63} \ No newline at end of file 64}
diff --git a/themes/default/img/default/carrot.png b/themes/default/img/default/carrot.png
deleted file mode 100644
index 5fc17273..00000000
--- a/themes/default/img/default/carrot.png
+++ /dev/null
Binary files differ