1/* =Tools 2----------------------------------------------- */ 3 4@media screen { 5 6/* highlight selected tool */ 7.mode_admin a.action.admin, 8.mode_login a.action.login, 9.mode_register a.action.register, 10.mode_profile a.action.profile, 11.mode_recent a.action.recent, 12.mode_index a.action.index, 13.mode_media a.action.media, 14.mode_revisions a.action.revs, 15.mode_backlink a.action.backlink, 16.mode_subscribe a.action.subscribe { 17 background-color: transparent; 18} 19 20.loggedIn{ 21 .site-tools ul li:has(> a.action.media), .user-tools ul li:has(> a.action.admin), .page-tools ul li:has(> a.action.revs) { 22 display: block; 23 } 24} 25 26.page-tools { 27 a span.icon { 28 display: inline-block; 29 width: 20px; 30 height: 20px; 31 -webkit-font-smoothing: antialiased; 32 font-size: 20px; 33 line-height: 1; 34 font-family: 'Genericons'; 35 text-decoration: inherit; 36 font-weight: normal; 37 font-style: normal; 38 vertical-align: top; 39 } 40 41 a span.icon:before { content: '\f101'; } 42 43 a.edit span.icon:before { content: '\f411'; } 44 a.create span.icon:before { content: '\f510'; } 45 a.show span.icon:before { content: '\f403'; } 46 a.source span.icon:before { content: '\f462'; } 47 a.draft span.icon:before { content: '\f416'; } 48 a.revs span.icon:before { content: '\f303'; } 49 a.backlink span.icon:before { content: '\f107'; } 50 a.top span.icon:before { content: '\f435'; } 51 a.revert span.icon:before { content: '\f467'; } 52 a.subscribe span.icon:before { content: '\f410'; } 53} 54 55.site-tools, 56.user-tools { 57 a span { 58 display: inline-block; 59 width: 20px; 60 height: 20px; 61 -webkit-font-smoothing: antialiased; 62 font-size: 20px; 63 line-height: 1; 64 font-family: 'Genericons'; 65 text-decoration: inherit; 66 font-weight: normal; 67 font-style: normal; 68 vertical-align: top; 69 } 70 71 a span:before { content: '\f101'; } 72 73 a.admin span:before { content: '\f445'; } 74 a.login span:before { content: '\f427'; } 75 a.logout span:before { content: '\f470'; } 76 a.register span:before { content: '\f425'; } 77 a.profile span:before { content: '\f304'; } 78 a.recent span:before { content: '\f307'; } 79 a.index span:before { content: '\f507'; } 80 a.media span:before { content: '\f473'; } 81 82 h3, ul li:has(> a.action.media) { display: none; } 83} 84 85} /* /@media */ 86 87 88@media only screen and (min-width: 960px) { 89 90.page-tools { 91 position: fixed; 92 top: 40px; 93 left: 320px; 94 95 a span { 96 width: 60px; 97 display: block; 98 text-align: center; 99 } 100 a span.icon { 101 width: 60px; 102 height: 60px; 103 background: @ini_text_neu; 104 color: @ini_background; 105 font-size: 30px; 106 line-height: 2; 107 108 -webkit-border-radius: 50%; 109 -moz-border-radius: 50%; 110 border-radius: 50%; 111 -webkit-transition: all 0.25s ease-in-out; 112 -moz-transition: all 0.25s ease-in-out; 113 -ms-transition: all 0.25s ease-in-out; 114 -o-transition: all 0.25s ease-in-out; 115 transition: all 0.25s ease-in-out; 116 } 117 118 a:hover span.icon { 119 background: @ini_background; 120 color: @ini_text_alt; 121 } 122 123 h3, ul li:has(> a.action.media) { display: none; } 124} 125 126.mode_revisions .page-tools a.revs span.icon, 127.mode_backlink .page-tools a.backlink span.icon, 128.mode_revert .page-tools a.revert span.icon, 129.mode_subscribe .page-tools a.subscribe span.icon { 130 background: @ini_background; 131 color: @ini_text_alt; 132 position: relative; 133 134 &:after { 135 content: ''; 136 z-index: 2; 137 display: block; 138 position: absolute; 139 top: 25px; 140 right: -25px; 141 border-left: 5px solid @ini_text_alt; 142 border-top: 5px solid transparent; 143 border-bottom: 5px solid transparent; 144 } 145} 146 147} /* /@media */ 148 149@media only screen and (max-width: 959px) { 150 .page-tools .a11y { 151 position: static !important; 152 left: 0 !important; 153 right: 0 !important; 154 width: auto !important; 155 height: auto !important; 156 } 157} 158