Firefox 75 đã mang đến một sự thay đổi vô nghĩa - thanh địa chỉ (urlbar) hiện được "phóng to" khi được nhấp vào, che khuất một phần giao diện người dùng xung quanh, bao gồm mọi lối tắt mà bạn có thể đã ghim vào đó. Điều này cảm thấy hoàn toàn di động và hoàn toàn sai trên máy tính để bàn. Hiện tại, như tôi đã chỉ cho bạn trong bài viết trên, điều vô nghĩa này có thể được hoàn nguyên thông qua một số cài đặt about:config.
Nhưng trong Firefox 77 (hàng đêm), các tùy chọn này không còn nữa, vì vậy chúng tôi cần một thứ khác. Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách bạn có thể có được giao diện thanh địa chỉ cũ, vì vậy bạn sẽ không bị ảnh hưởng bởi những thay đổi IQ thấp xảy ra vào thời điểm nghiêm trọng. Đúng như tôi nghĩ Firefox đang vượt lên trên trò chơi tung nhiễm sắc thể trên thiết bị di động, thì điều này lại xuất hiện. Đi theo tôi.
Chúng tôi muốn loại bỏ thanh địa chỉ phóng to khó chịu này.
Chúng ta sẽ làm gì?
Chúng tôi sẽ tạo một kiểu CSS tùy chỉnh để làm cho giao diện người dùng Firefox trông giống như trước đây. Về bản chất, giao diện người dùng Firefox có thể được tạo kiểu, giống như bất kỳ trang web nào. Điều này được thực hiện bằng cách thêm các khai báo CSS vào tệp userChrome.css trong thư mục hồ sơ Firefox.
Bây giờ, tôi không phải là người tiên phong. Nhu cầu quan trọng này đã được trả lời trên trang web hỗ trợ của Mozilla. Nhưng đoạn mã ở đó cần một số điều chỉnh, ngoài ra, tôi muốn làm cho đoạn mã trở nên cực kỳ đơn giản và rõ ràng những gì người dùng cần làm để lấy lại giao diện cũ.
Kích hoạt userChrome.css
Trước tiên, chúng ta cần "bảo" Firefox tôn trọng các thay đổi CSS do người dùng thực hiện:
- Trong Firefox 68 trở xuống, bạn không cần phải làm gì cả.
- Trong Firefox 69 trở lên, hãy truy cập about:config, tìm cài đặt sau và thay đổi từ false thành true:
toolkit.legacyUserProfileCustomizations.stylesheets
Sau đó, vào thư mục hồ sơ Firefox của bạn. Trong Windows, thông thường:
C:\Users\"tên người dùng"\AppData\Roaming\Mozilla\Firefox\"hồ sơ"
Và trong Linux, điển hình là:
/home/"user"/.mozilla/firefox/"profile"
Nếu bạn cần bất kỳ ví dụ nào, hãy xem bài viết chia tỷ lệ Plasma &HD của tôi hoặc hướng dẫn về tab được ghim trên Firefox.
- Trong thư mục này, tạo một thư mục có tên là chrome (chữ thường).
- Bên trong thư mục chrome, tạo một tệp văn bản trống có tên userChrome.css (lưu ý chữ thường/chữ hoa).
Thêm kiểu thanh địa chỉ
Bước tiếp theo là thêm nội dung vào tệp userChrome.css. Sao chép văn bản sau - văn bản này xuất phát trực tiếp từ chuỗi hỗ trợ ở trên. Xin lưu ý rằng điều này có thể là chưa đủ nhưng tôi muốn chỉ cho bạn mọi thứ từng bước một để bạn tự tin hơn khi thay đổi tệp nếu cần.
@namespace url("https://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* chỉ cần một lần */
#urlbar[breakout],
#urlbar[breakout][breakout-extend] {
--urlbar-height:28px !important;
--urlbar-toolbar-height:30px !quan trọng;
chiều rộng:100% !quan trọng;
top:calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !quan trọng;
còn lại:0 !quan trọng;
}
#urlbar[breakout][breakout-extend]> #urlbar-input-container,
#urlbar-input-container {
height:var( --urlbar-height) !quan trọng;
chiều rộng:100% !quan trọng;
padding-block:unset !important;
padding-inline:unset !important;
quá trình chuyển tiếp:không !quan trọng;
}
#urlbar[breakout][breakout-extend]> #urlbar-background {
box-shadow:0 1px 4px rgba(0,0,0,.05 ) !quan trọng;
hoạt ảnh:không !quan trọng;
}
Lưu tệp, khởi động lại Firefox.
Kết quả, hơi sai
Thử nghiệm của tôi cho thấy rằng đoạn mã trên mang lại ít hơn một chút so với bố cục lý tưởng. Như bạn có thể thấy, thanh địa chỉ nằm ở vị trí "quá cao" - nó không được căn giữa theo chiều dọc. Lề trên và dưới sai.
CSS, thay đổi thứ hai
Những gì chúng ta cần làm là điều chỉnh một chút các giá trị mặc định được sử dụng trong CSS mà chúng ta đã thêm. Cụ thể, chúng ta cần điều chỉnh chiều cao thanh url và chiều cao thanh công cụ. Khi đó, lề trên được tính bằng một nửa chênh lệch (delta) giữa hai giá trị này. Bạn cũng có thể thay đổi giá trị trên cùng theo cách thủ công.
#urlbar[breakout],
#urlbar[breakout][breakout-extend] {
--urlbar-height:28px !quan trọng;
--urlbar-toolbar-height:30px !quan trọng;
Tôi đã thực hiện một số thử nghiệm và kiểm tra lỗi, và đối với tôi, chiều cao của thanh công cụ là 38px thực hiện công việc:
#urlbar[breakout],
#urlbar[breakout][breakout-extend] {
--urlbar-height:28px !quan trọng;
--urlbar-toolbar-height:38px !quan trọng;
Và một lần nữa, lề trên cùng, bạn có thể thay đổi từ phép tính mặc định thành bất cứ thứ gì bạn muốn:
trên cùng:calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !quan trọng;
Ví dụ:đây có thể là một cái gì đó như:
trên cùng:5px !quan trọng;
Việc sử dụng ghi đè !quan trọng là quan trọng - để Firefox sử dụng nó chứ không phải cài đặt mặc định của nó.
Hình ảnh cuối cùng, đúng như dự kiến
Và chúng ta đã lấy lại được sự tỉnh táo, logic và trí thông minh:
Kết luận
Và có chúng tôi đi. Công việc hoàn thành. Trong những năm qua, tôi đã buộc phải sử dụng CSS tùy chỉnh ngày càng nhiều để có được hành vi bình thường của trình duyệt. Đây là một xu hướng đáng báo động. Nhưng tôi đoán đó là một điều không thể tránh khỏi, vì ngày càng có nhiều công ty tung ra những sản phẩm vô dụng cho đám đông dưới 100IQ ngày càng tăng. Và không có lý do chức năng tốt nào. Chỉ thay đổi vì lợi ích của nó. Và thường là thứ gì đó giả tạo làm hỏng các giải pháp hoàn toàn có thể chấp nhận được, đã được khoa học chứng minh và thử nghiệm.
Tôi hy vọng bạn tìm thấy bài viết nhỏ này có giá trị. Bạn có thể sử dụng nó ngay lập tức trong Firefox 75 hoặc đợi cho đến khi Firefox 77 lên sóng rồi thực hiện thay đổi - đồng thời sử dụng phần ghi đè cấu hình. Tuy nhiên, bất chấp tất cả những điều vô nghĩa này, ít nhất vẫn có cách để các kỹ thuật viên lấy lại bố cục hiệu quả, bình thường mà họ cần. Nhưng ai biết được tương lai sẽ ra sao. Firefox, xin đừng giống như phần còn lại. Vâng, bạn đi. Nhiệm vụ hoàn thành. Nếu bạn muốn cảm ơn tôi, hãy mua cho tôi những món quà đắt tiền và khen ngợi tôi. Màn.
Chúc mừng.