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: 'bootstrap-icons'; 35 text-decoration: inherit; 36 font-weight: normal; 37 font-style: normal; 38 vertical-align: top; 39 } 40 41 a span.icon:before { content: '\F28A'; } 42 43 a.edit span.icon:before { content: '\F4CA'; } 44 a.create span.icon:before { content: '\F64D'; } 45 a.show span.icon:before { content: '\F341'; } 46 a.source span.icon:before { content: '\F2C6'; } 47 a.draft span.icon:before { content: '\F38B'; } 48 a.revs span.icon:before { content: '\F292'; } 49 a.backlink span.icon:before { content: '\F470'; } 50 a.top span.icon:before { content: '\F278'; } 51 a.revert span.icon:before { content: '\F117'; } 52 a.subscribe span.icon:before { content: '\F18A'; } 53} 54 55.site-tools { 56 a span { 57 display: inline-block; 58 width: 20px; 59 height: 20px; 60 -webkit-font-smoothing: antialiased; 61 font-size: 20px; 62 line-height: 1; 63 font-family: 'bootstrap-icons'; 64 text-decoration: inherit; 65 font-weight: normal; 66 font-style: normal; 67 vertical-align: top; 68 } 69 70 a span:before { content: '\F28A'; } 71 a.recent span:before { content: '\F293'; } 72 a.index span:before { content: '\F2EE'; } 73 a.media span:before { content: '\F2CB'; } 74} 75 76.user-tools { 77 a i { 78 display: inline-block; 79 width: 20px; 80 height: 20px; 81 -webkit-font-smoothing: antialiased; 82 font-size: 20px; 83 line-height: 20px; 84 vertical-align: middle; 85 font-family: 'bootstrap-icons'; 86 text-decoration: inherit; 87 font-weight: normal; 88 font-style: normal; 89 } 90 91 a i:before { content: '\F28A'; } 92 a.admin i:before { content: '\F3E5'; } 93 a.login i:before { content: '\F1BE'; } 94 a.logout i:before { content: '\F1C3'; } 95 a.register i:before { content: '\F89A'; } 96 a.profile i:before { content: '\F4CB'; } 97 98 p.user:before { 99 font-family: 'bootstrap-icons'; 100 content: "\F4E1"; 101 font-size: 20px; 102 padding-right: 4px; 103 line-height: 20px; 104 vertical-align: middle; 105 } 106} 107 108} /* /@media */ 109 110 111@media only screen and (min-width: 960px) { 112 113.page-tools { 114 position: fixed; 115 top: 40px; 116 left: 320px; 117 118 a { 119 width: 60px; 120 height: 60px; 121 display: block; 122 } 123 a span { 124 width: 60px; 125 display: block; 126 text-align: center; 127 } 128 a span.icon { 129 width: 60px; 130 height: 60px; 131 background: @ini_text_neu; 132 color: @ini_background; 133 font-size: 30px; 134 line-height: 2; 135 136 -webkit-border-radius: 50%; 137 -moz-border-radius: 50%; 138 border-radius: 50%; 139 transition: all 0.25s ease-in-out; 140 } 141 142 a:hover span.icon { 143 background: @ini_background; 144 color: @ini_text_alt; 145 } 146 147 a:focus { 148 outline: none; 149 150 span.icon { 151 background-color: @ini_theme_color; 152 color: #fff; 153 } 154 } 155} 156 157.mode_revisions .page-tools a.revs span.icon, 158.mode_backlink .page-tools a.backlink span.icon, 159.mode_revert .page-tools a.revert span.icon, 160.mode_subscribe .page-tools a.subscribe span.icon { 161 background: @ini_background; 162 color: @ini_text_alt; 163 position: relative; 164 165 &:after { 166 content: ''; 167 z-index: 2; 168 display: block; 169 position: absolute; 170 top: 25px; 171 right: -25px; 172 border-left: 5px solid @ini_text_alt; 173 border-top: 5px solid transparent; 174 border-bottom: 5px solid transparent; 175 } 176} 177 178} /* /@media */ 179 180@media only screen and (max-width: 959px) { 181 .page-tools .a11y { 182 position: static !important; 183 left: 0 !important; 184 right: 0 !important; 185 width: auto !important; 186 height: auto !important; 187 } 188} 189