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 83} /* /@media */ 84 85 86@media only screen and (min-width: 960px) { 87 88.page-tools { 89 position: fixed; 90 top: 40px; 91 left: 320px; 92 93 a span { 94 width: 60px; 95 display: block; 96 text-align: center; 97 } 98 a span.icon { 99 width: 60px; 100 height: 60px; 101 background: @ini_text_neu; 102 color: @ini_background; 103 font-size: 30px; 104 line-height: 2; 105 106 -webkit-border-radius: 50%; 107 -moz-border-radius: 50%; 108 border-radius: 50%; 109 -webkit-transition: all 0.25s ease-in-out; 110 -moz-transition: all 0.25s ease-in-out; 111 -ms-transition: all 0.25s ease-in-out; 112 -o-transition: all 0.25s ease-in-out; 113 transition: all 0.25s ease-in-out; 114 } 115 116 a:hover span.icon { 117 background: @ini_background; 118 color: @ini_text_alt; 119 } 120 121 a:focus { 122 outline: none; 123 124 span.icon { 125 background-color: @ini_theme_color; 126 color: #fff; 127 } 128 } 129} 130 131.mode_revisions .page-tools a.revs span.icon, 132.mode_backlink .page-tools a.backlink span.icon, 133.mode_revert .page-tools a.revert span.icon, 134.mode_subscribe .page-tools a.subscribe span.icon { 135 background: @ini_background; 136 color: @ini_text_alt; 137 position: relative; 138 139 &:after { 140 content: ''; 141 z-index: 2; 142 display: block; 143 position: absolute; 144 top: 25px; 145 right: -25px; 146 border-left: 5px solid @ini_text_alt; 147 border-top: 5px solid transparent; 148 border-bottom: 5px solid transparent; 149 } 150} 151 152} /* /@media */ 153 154@media only screen and (max-width: 959px) { 155 .page-tools .a11y { 156 position: static !important; 157 left: 0 !important; 158 right: 0 !important; 159 width: auto !important; 160 height: auto !important; 161 } 162} 163