summaryrefslogtreecommitdiff
path: root/www/wiki/skins/Vector/components/watchstar.less
diff options
context:
space:
mode:
Diffstat (limited to 'www/wiki/skins/Vector/components/watchstar.less')
-rw-r--r--www/wiki/skins/Vector/components/watchstar.less52
1 files changed, 52 insertions, 0 deletions
diff --git a/www/wiki/skins/Vector/components/watchstar.less b/www/wiki/skins/Vector/components/watchstar.less
new file mode 100644
index 00000000..da51133a
--- /dev/null
+++ b/www/wiki/skins/Vector/components/watchstar.less
@@ -0,0 +1,52 @@
+@import 'mediawiki.mixins.rotation';
+
+/* Watch/Unwatch Icon Styling */
+/* Only use icon if the menu item is not collapsed into the "More" dropdown
+ * (in which case it is inside .vectorMenu instead of .vectorTabs). */
+.vectorTabs {
+ #ca-unwatch.icon a,
+ #ca-watch.icon a {
+ margin: 0;
+ padding: 0;
+ display: block;
+ width: 28px;
+ /* This hides the text but shows the background image */
+ padding-top: 3.1em;
+ /* Only applied in IE6 */
+ _margin-top: -0.8em;
+ height: 0;
+ overflow: hidden;
+ background-position: 5px 60%;
+ background-repeat: no-repeat;
+ }
+ #ca-unwatch.icon a {
+ .background-image-svg( 'images/unwatch-icon.svg', 'images/unwatch-icon.png' );
+ }
+ #ca-watch.icon a {
+ .background-image-svg( 'images/watch-icon.svg', 'images/watch-icon.png' );
+ }
+ #ca-unwatch.icon a:hover,
+ #ca-unwatch.icon a:focus {
+ .background-image-svg( 'images/unwatch-icon-hl.svg', 'images/unwatch-icon-hl.png' );
+ }
+ #ca-watch.icon a:hover,
+ #ca-watch.icon a:focus {
+ .background-image-svg( 'images/watch-icon-hl.svg', 'images/watch-icon-hl.png' );
+ }
+ #ca-unwatch.icon a.loading,
+ #ca-watch.icon a.loading {
+ .background-image-svg( 'images/watch-icon-loading.svg', 'images/watch-icon-loading.png' );
+ .rotation( 700ms );
+ /* Suppress the hilarious rotating focus outline on Firefox */
+ outline: 0;
+ cursor: default;
+ pointer-events: none;
+ background-position: 50% 60%;
+ -webkit-transform-origin: 50% 57%;
+ transform-origin: 50% 57%;
+ }
+ #ca-unwatch.icon a span,
+ #ca-watch.icon a span {
+ display: none;
+ }
+}