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