Благоустраиваем Firefox: встроенный VPN

Продолжаем серию заметок по улучшению UI нашего любимого браузера.

Как вы знаете, в версии 149 появился встроенный VPN. А в текущей версии (151.0.2) кнопку его включения сделали такой:

Сия иконка прямо-таки вопиет к небесам: «Я VPN! Я ВииииПииииЭэээээээн!!! (Да, кстати, я VPN)». Конечно, наличие VPN всегда радует душу, но не настолько, чтобы терять кучу места на тулбаре. Кроме того, нарисовано немного ногами. Сделаем эту иконку скромнее и симпатишнее:

Код очень прост:

/* VPN Stuff */#ipprotection-button{list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA/g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIPQLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzNKM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWTNz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhbL+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FYmKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6217nU1R3SPVRSj9Yr60cOxx++/p3vdy0NNg1VjZzG4iNwRHnk6fcJ3/ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w+0dbq3nr8R9sfD5w0PFl5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb++6EHTh0kX/i+c7vDvOXPK4dPKy2+UTV7hXmq86X23qdOo8/pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb/1tWeOT3dvfN6b/fF9/XfFt1+cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw9DBY+Zj8uGDYbrnjg+OTniP3L96fynQ89kzyaeF/6i/suuFxYvfvjV69fO0ZjRoZfyl5O/bXyl/erA6xmv28bCxh6+yXgzMV70VvvtwXfcdx3vo98PT+R8IH8o/2j5sfVT0Kf7kxmTk/8EA5jz/GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAABfNJREFUeNqEln1slWcZxn/P836cz56etpSPAi1jYY4tEJWPuDnAj4TpmDq2ROa2bGr5YzEuc3MhiMZNHZoFgY2oceiM2Rd/QJwJWVxIDBQmUEbG2tWuIG0H9JRygNLTw/l83+e5/eMcGoxM7+TO+8/zXNfzXNed53oVT3SDC0Si4DRCKQdBAeIpsBZEwFN3U5UfUgg/hQgk3AEc2Y4x76BBqQBIgEqCyaPtJFQMxtag/7tEQABNGlG7uFD5ClHN/JsTKITBoXw7RbOaVn8fyIPAFdQNkXCnwK5foJSHo54iF25mInCXfi7N79e2sWROHIDj5wp8760M7x2+uJqUd5G02oSwHaWCGo6aOqTiyeNzcLkLz2/AetMJg6VMlldTlLhui/Di2lk8cef0OrOpfx0AfvOP8/xgzwhmpABJt0gqvg/NcUdVsgRh3ljeVWz88Bc46idMBFCsQqNP+6wYjyxK8vTKVloSPmINYWhAKUQEEcFzHbTjcnGyxPauLLt6xvk4k4fJEBX30Y0uGPu8ixGPXMC9y9NsWNnCtLjDwhkxUBoQwjDACigFIlJXUBGEFhWWaW3w+eXXOth8zyz6RotcLhq2HRhj79GLkHQ9FyuGcsiKeQlWzE9dJ0VNDscBW7VYFJ6n0FrVPAPCELAGVIhyNIvmpgDNsXMl9u4fhbg2GqmNYtXY+qYAcChWLCfPFwkC8CM+UJMGa8FYJLSIAFqBVVA1BOUKAJVKFRAQwa1bjpIaget67D5xmQd3ZbACEUfxTudcvrAgzY/2jvDSkSs4wOIZEV5cM51Nf79E71iF7HjAM6ua2XJ/O7qmLmCVC1YhMjWlvZk839wxxDP3zuD5r8+g840MX9w6hP3t7bx/usBnmnxe+85sxguGSxMB7/bm+d0jbdzcGkHbukciXFNGo2UCY8lVajd46cBlZsyOseWBuUQ8n9e/PY/WJo8/dI0zuy1K2YW+kTJz0j43TY8SxDXZq4ZcyXBbWxSAXNmAsWhFTuOEw2jho/MlAKplQzLp1V0sA0Iq4ZIvG1oTDu8PFvnG6xn+2jfJ3AaNQfGz/Zd5/K0xzk/UPBgYK4IWlGFYU3WPEXc/OnR6ErA8sKSJwYE8p7MFcGMcH55k8HSBVQvi9I1W6LyrCfn1Yh7/fDPd50pEgX8+1UHmp7dw+5w4F8YnOTSQgybV7yTL3VpVw4/x2TNxNs/LB8e479PNrLkjzYLn/sXyHadY9qshOldPY+mCNGdGS1SuGsDWXDRCNR9SKl8ba58338tyJTOBm0/t4WTLGaU39QDSYS9cPTWz2fWHNi8h5rn86cgYb58qcf9tCR5e1gjG8rf+AumY5o6OCKGBC1cN3efK3NkeZWZLlFyhyq0/7mZsslhRZxfdIpmWs4oNh8EKKqg8KyPBc4/d086fv3trfc4EsFQrVUrlkMaUT2iEQjFEofA9RTTmYqoGx4/w2M4eXt07gjc9/azx9c/xBIfPPgrGoJxoF4nofT0nsjNbW32W39RItVymXDGIgNaKSsUQhhatFUpBaAQbGvxYgh37BnnhjWGY5XwgYfYhKV+C6gQuLStrEeCAKg6vk+Slnu/vHIg2Jx2+tawNKZeohgatFEqpelwI1gqeq4glkrx55CxPvtwPicaSkzqzzqR7IYzXI+X6nLFyyk24dxPRPLStj1cOnyMSjZGIuBhrp15SYyzxqEM8keCVg8M8vPUDiDhEk95XxcoplOJa6ymp6y1WDrqN3peIaNZv62XjXwbQnkeqIYJYizWWdDqKF/HZuLuf9Vt7IKrxG70vi5UuUGD1VN84Mo3s91Lu4tCTgy+8ejJ9dCjH7s6FtDY1AEJ2PM+6P/Zz4NAoqjk+4cWcVWKkV90wMm9UCsTYD/WlpnZp9t/uOppZMX8wx2vrFwLCozv7yY9UcGYnD2lRa8SQ/0+x/x/BNU8gz1jTSjcee7qQz25du+UEiEJFq3itDRtsNr1F2i6igk+G0f+LAFX/Ibgc2+bFox26we3WKfeYU5o2T4LyFkQxlT6fUP8eAE621D8G50gtAAAAAElFTkSuQmCC) !important;}#ipprotection-button.ipprotection-on{list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA/g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIPQLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzNKM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWTNz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhbL+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FYmKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6217nU1R3SPVRSj9Yr60cOxx++/p3vdy0NNg1VjZzG4iNwRHnk6fcJ3/ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w+0dbq3nr8R9sfD5w0PFl5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb++6EHTh0kX/i+c7vDvOXPK4dPKy2+UTV7hXmq86X23qdOo8/pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb/1tWeOT3dvfN6b/fF9/XfFt1+cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw9DBY+Zj8uGDYbrnjg+OTniP3L96fynQ89kzyaeF/6i/suuFxYvfvjV69fO0ZjRoZfyl5O/bXyl/erA6xmv28bCxh6+yXgzMV70VvvtwXfcdx3vo98PT+R8IH8o/2j5sfVT0Kf7kxmTk/8EA5jz/GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAABJ5JREFUeNqclVtsVFUUhr+19znTdigWgQLhUqpBEEOECEK4o8SCERJIICAJPhkiii+ikIgXIvKABH0x+uib+IYxhiAXDRIDGkCRm1Roy63TdqZ02mmnnTnn7OXDtAOFQpCV7Jezc779r7X/tbbM/2k3kQ9520HbMKWiazDxtNARz+IBLjIYo0uMJ5td5CalryWIgvAfY+0XqvaAE4dnQvK5GN3ZGKVleeKlAVlR1Dg87gkBBVTA6BBjda8IS0V6vwMiUgXUIO6gwFpV2gp7cg/NGDUYJ33/9gLwMdEWEUmKsBRAdSApWmPQpIhsQfCLwopnKV7gBdXOY64aiZdlzQinPTNyZVLji4kzAHSAsKjZ5fvRx1KeOwh60qm0GCWrmN+8ntKeNxC2CpZ4NzjjCC2ICg8bvdnFY7FghaqsiJzgq6CYXZ5wu7aRLeQmyv8LARScM30lLlQLxQARjxhWDA6lvq2RdK4T397jmcg8ElnBiKHL5Uikk2ycsITqkuE0dt3CM7a/iwb0Vl/a97kGY3rhiQY+nLaar5ZuYv/yjxhtH6M1l+lHuecAQTDG0NCVoqk7fVfaWlAe5WhKNLBzzgY+mLeuKMiIuct4gmc9L43cPsNay7V0E2sqppHMZzicuczTw8ahTsF6ZE1Ec1MDO+Zu4P15awFoaG9m4b5ttGgXVeWVhK73WtW1e5rtrg+NKXbYvx3NbKpezCdTVhFFES8d3smxunM8P24ybZk0jZfO8+miN9k2v6C8oTXB7G/foUkzTBw6lqArWxTrNKr3Lh878YeoXAQmI9CWukli+kiYsgprLT++sJU5e9Zz/MCXEFi2L3mXbQsK8Pqb15j53kpSnSnGjqimIzpbNIHEzAWM+d36syrTBMFIF7qFURBSWlLO8XNHuJhMsHp6Db71WDO1hm9OHOLVWSvZs34rAHWJ68x6exmpZILRlVWEPT0QRhBGiCramPk6uNH+vXjbl2PR8WVRtlZUY4ghxJGpv8Daha+x9/XPAEhnM8SsR7ykjPrEdWZuWkYq3czYqqcIw6Cf+VyJl0vVJSZGLe3XrDd7AhKG7b52W2NYpFisCP7jwzl95hCXUi2sml5DqV+C7/kF5W+9Qqq9mTFVE4nugKsoxnl43bLDjBr8Q8mTI7EyYxJR3ievg4/6MV1hJBylKlgx+EMqOX3mCJduJVn13EskOlqZvnEpqbYmxo7vDwcQtYRe/q8SP7VuSNBJea4TL6yY2bs7iHzw55q41p6JTHmpquKJYfATz/DdyX10hN3UJ66S6mplzLj+ZSlaPF/analsXJMcdxVyfZ0sSnGp1gJL+lpPVfEwVIwcz/7zh7jSfp3Ro6pxQXC/IfKyKrV3TgKDOoqr0Ie/KrzY+3KhqohzVAwdQ3zQEFwUDjxCVBeDHhUAd3sNOOxE+UVVn3VoWqzhzk7v8zkiiBEU0gpTBX4e8Mm8X67OyNnczXSVduaOScwiVnrZWoBHBo3cMYiqQP++H+fB41okE9xoWxDUtW7uK5kgiA89QXpLvqVzgYl5mQchHuo9CBPtn+ev3KrGyClVTvUk09WB6dr9MP/+NwDBaiM1fjGW+QAAAABJRU5ErkJggg==) !important;}#ipprotection-button .toolbarbutton-icon{height: unset !important;padding: 4px !important;}

Пихать файлы иконок в ресурсы Firefox неудобно, поэтому заинлайним их прямо в CSS.

Эту секцию CSS добавим к файлу %FF-Profile%\chrome\userChrome.css, который мы уже редактировали в прошлых сериях. %FF-Profile% здесь это не системная переменная ОС, а просто путь к вашему профилю. Не забудьте в about:config поменять у переменной toolkit.legacyUserProfileCustomizations.stylesheets значение false → true. (Инструкция с картинками).

Сами иконки — флюентный Шиндошс. Семантика protection выбрана потому, что так в Мозилле позиционируют этот сервис. Чтобы не раздражать смотрящего, вкл и выкл обозначаются не привычными зелёным и красным, а зелёным и сине-белым.

Иконки, как видите, неконсистентные по размеру с остальными, а сделаны в полтора раза больше. Всё-таки VPN же!

По уму, конечно, стоило бы добавить немного интерактива. Во-первых, выводить лимит колечком вокруг иконки. Во-вторых, автоматически отключать DoH при нажатии. (Если у вас не работает VPN, не ругайтесь, что опять РЛО, а сначала проверьте, что DoH в настройках имеет значение Default Protection — если вы не очень параноик, можно просто отключить Max Protection в браузере, поставить кастомный DNS на уровне операционной системы и пусть она сливает в Microsoft историю браузинга). И то, и другое сделать можно, но понадобится тёмная магия крови, называемая «загрузчик модулей user Javascript». Сначала посмотрим, сколько проживёт эта фича, а уже потом будем программировать.