Template:Clippy says: Difference between revisions

(5 intermediate revisions by the same user not shown)

Line 1:

'''NOTICE''': this template is in ~~draft state!~~

'''NOTICE''': this template is mostly "finished", but its presentation/style might change dramatically in the near future. Be careful!

~~It's supposed to have an image of Clippit on~~ the ~~left with a speech bubble containing the value of <code>quote</code>~~.

~~Idea from [https://zulip.consumerrights.wiki/#narrow/channel/12-Feedback-.26-Suggestions/topic//near/18408 here]:~~

Feel free to improve this template! We need it to look good in dark-mode.

~~<blockquote>It should~~ look ~~like the actual/original Clippit is saying it inside a notice/info~~-~~box. I got the idea while writing [https://consumerrights.wiki/index~~.~~php?title=User_talk%3ATempo123&oldid=54876#PERMA-COMPUTE this]</blockquote>~~

~~This is kinda similar to <code>[[wikipedia:Cowsay|cowsay]]~~</~~code~~>.

BTW, if you use a screen-reader, please try it on the template and let us know of any problems!

</noinclude>

~~This template can be used to make Clippy say anything you want, ideally something pro~~-~~consumer. I see great potential in documentation pages~~, ~~such as Help pages~~, ~~where Clippy could be seen giving advice/tips about the wiki.~~

~~{{#template_params~~:~~quote (label~~=~~Quote)}}~~

[[File:Clippy-new.jpg|86px|alt=Clippit the paper-clip, saying:|link=]]

</div>

</~~noinclude~~><~~includeonly~~>

{{~~#template_display:_format=infobox~~}}</~~includeonly~~>

{{{1|It looks like you forgot to type a message!}}}

</div>

</noinclude>

@@ Line 1: / Line 1: @@
 <noinclude>
-'''NOTICE''': this template is in draft state!
+'''NOTICE''': this template is mostly "finished", but its presentation/style might change dramatically in the near future. Be careful!
-It's supposed to have an image of Clippit on the left with a speech bubble containing the value of <code>quote</code>.
-Idea from [https://zulip.consumerrights.wiki/#narrow/channel/12-Feedback-.26-Suggestions/topic//near/18408 here]:
+Feel free to improve this template! We need it to look good in dark-mode.
-<blockquote>It should look like the actual/original Clippit is saying it inside a notice/info-box. I got the idea while writing [https://consumerrights.wiki/index.php?title=User_talk%3ATempo123&oldid=54876#PERMA-COMPUTE this]</blockquote>
-This is kinda similar to <code>[[wikipedia:Cowsay|cowsay]]</code>.
+BTW, if you use a screen-reader, please try it on the template and let us know of any problems!
+</noinclude>
-This template can be used to make Clippy say anything you want, ideally something pro-consumer. I see great potential in documentation pages, such as Help pages, where Clippy could be seen giving advice/tips about the wiki.
+<div style="padding: 8px; margin: 8px auto; max-width: 600px; display: flex; align-items: center; font-family: 'Segoe UI', Tahoma, sans-serif; color: #000000">
-{{#template_params:quote (label=Quote)}}
+<div style="flex: 0 0 86px; text-align: center; margin-right: 8px;">
+[[File:Clippy-new.jpg|86px|alt=Clippit the paper-clip, saying:|link=]]
+</div>
-</noinclude><includeonly>
+<div style="flex: 1; position: relative; background: #eeb; border: 1px solid #333; border-radius: 6px; padding: 10px; font-size: 0.95em; line-height: 1.4;">
-{{#template_display:_format=infobox}}</includeonly>
+<!-- arrow -->
+<div style="position: absolute; top: 50%; left: -6px; transform: translateY(-50%) rotate(45deg); width: 10px; height: 10px; background: #eeb; border-left: 1px solid #333; border-bottom: 1px solid #333;"></div>
+{{{1|It looks like you forgot to type a message!}}}
+</div>
+</div>
+<noinclude>
+{{Documentation}}
+</noinclude>