ফায়ারফক্স ৯১ এবং পরবর্তী ভার্সনে প্রোটন ইউআই রিভার্ট করা

ফায়ারফক্স ৯১ রিলিজ হয়েছে। আপনি জানেন এর মানে কি? এর মানে আপনি আর about:config-এর মাধ্যমে প্রোটন ইন্টারফেস ডিজেবল করতে পারবেন না। এটি কেন গুরুত্বপূর্ণ, আপনি জিজ্ঞাসা করলেন? কারণ প্রোটন চুঁচে। যারা আমার মেসেজের এই তীব্রতা শুরুতেই দেখে বিভ্রান্ত, তাদের জন্য রিক্যাপ করি। কিছু সময় আগে, মোজিলা ঘোষণা করেছিল যে এটি আবার ফায়ারফক্স ইউআই পরিবর্তন করবে। এবার এটিকে প্রোটন বলা হয়েছে।

আমি আপনাকে দেখিয়েছিলাম এটা কেমন দেখায় - এবং এটা ভালো দেখায় না। কিন্তু তবুও, ফায়ারফক্স ৮৯-এ, প্রোটন অফিশিয়াল হয়ে গেলে, আপনি সিম্পলি এটাকে টগল অফ করে আপনার প্রিয় জীবনে এগিয়ে যেতে পারতেন, প্রোডাক্টিভিটি এবং ইফিশিয়েন্সি উপভোগ করতেন। এখন, যাইহোক, এটি আর একটি অপশন নেই। তাই আপনি যদি নিরর্থক, লো-কনট্রাস্ট হিপস্টারোলজি সহন করতে না চান, আমি আপনাকে সেই পরিবর্তনগুলোর সেট দেখাবো যা ব্যবহার করে আপনি প্রোটনের নিরর্থক দিকগুলোকে মিনিমাইজ বা রিমুভ করতে পারেন, এবং সেন ব্রাউজিং-এ ফিরে যেতে পারেন। আমার पीछे আসুন।

সমস্যা যেটি আছে

আমরা এটিমধ্যে কথা বলেছি, কিন্তু আরও কথা বলতে হবে। সেই নিরর্থক, গ্রে-অন-গ্রে ননসেন্সটি দেখুন। ট্যাব কোথায় শুরু? কোথায় শেষ? এটি কি কোনো ট্যাব? ৮০ এবং ৯০ के দশকে বড় ফোল্ডারগুলিতে লোকেরা পেজ مار্ক করার জন্য যেন রঙিন ট্যাব ব্যবহার করত! এখন অদৃশ্য ট্যাব কল্পনা করুন! দুহ! এরগোনোমিক্স!

উপাদানগুলো

আপনি কিছু জিনিস করতে পারেন। কিন্তু ধীরে শুরু করা যাক। প্রথমে, আপনাকে আজকের কাজের প্রকৃতি বুঝতে হবে। যেহেতু বিল্ট-ইন কনফিগারেশন টвиকগুলো আর সম্ভব নয়, আমাদের গভীরে যেতে হবে। আপনি কাস্টম সিএসএস রুলসেট ব্যবহার করে ফায়ারফক্সের লুক পরিবর্তন করতে পারেন, ঠিক যেমন কেউ একটি ওয়েব পেজ এডিট করে - আজকাল অধিকাংশ মডার্ন ব্রাউজার নিজেদেরকে ওয়েব পেজের মতো স্টাইল করে। আমি ইতিমধ্যে আপনাকে দেখিয়েছি কিভাবে এটি করতে হয় আমার প্লাজমা ও এইচডি টিউটোরিয়ালে, পিন্ড ট্যাবস গাইডে এবং ইউআরএল বারকে সেন করার টিউটোরিয়ালে - সেটিই আজকের কাজের বেসলাইন।

প্রথমে, কাস্টম ইউজার-মেড সিএসএস ওভাররাইড ব্যবহার করার অপশনগুলো সক্ষম করুন। একটি নতুন ট্যাব খুলুন, about:config টাইপ করুন, এবং নিচের প্রিফারেন্সটি খুঁজুন:

toolkit.legacyUserProfileCustomizations.stylesheets

এই সেটিংটি true-এ টগল করুন। তারপর, আপনার ফায়ারফক্স প্রোফাইল ফোল্ডারে যান। উইন্ডোজে, সাধারণত:

C:\Users\"username"\AppData\Roaming\Mozilla\Firefox\"profile"

এবং লিনাক্সে, সাধারণত:

/home/"user"/.mozilla/firefox/"profile"

এই ফোল্ডারে, chrome নামের একটি ফোল্ডার তৈরি করুন (যদি ইতিমধ্যে না থাকে) (লোয়ারকেস)। chrome ফোল্ডারের ভিতরে, userChrome.css নামে একটি খালি টেক্সট ফাইল তৈরি করুন (যদি না থাকে) (লোয়ার/আপারকেস মেনে চলুন)। আমরা এই ফাইলে টেক্সটের একটি गुच্ছা যোগ করব।

প্রোটন রুলস

এখন, আমাদের কিছু রুল যোগ করতে হবে যা ফায়ারফক্সের আচরণ পরিবর্তন করবে। সবচেয়ে আক্রমক এলিমেন্ট হলো নতুন ট্যাব আচরণ, ওভার-লার্জ ট্যাবস, ফींক কনট্রাস্ট, এবং এক্টিভ এবং ইনएक্টিভ ট্যাবস এবং ব্যাকগ্রাউন্ড ট্যাব বার স্ট্রিপের মাঝে почти কোনো সেপারেশন নেই। এখানেই জিনিসগুলো ট্রিকি হয়ে যায়, কারণ একক ডেফিনিটিভ সেট অফ সিএসএস রুল নেই যা আপনি শুধু ব্যবহার করতে পারেন। কিছু অপশন:

• AskVG গাইড ক্লাসিক লুকস ও ইউআই রিস্টোর করার জন্য - সবচেয়ে সহজ গাইড, এবং এখানে আমার কাজের বেসলাইন।
• GitHub প্রজেক্ট প্রোটনকে ফটন কম্প্যাক্টে রিভার্ট করার জন্য।
• GitHub প্রজেক্ট প্রোটনের কিছু দিক মডিফাই করার জন্য।
• GitHub প্রজেক্ট ক্লাসিক লুকস ব্যবহার করার জন্য (প্রোটন চেয়ে অনেক বেশি কিছু আছে)।
• ফায়ারফক্স ৮৯ প্রোটন ইউআই ইন্টারেক্টিভ স্টাইলার - আপনাকে সব কিছুর পরিবর্তন করতে দেয় + লাইভ প্রিভিউ।

AskVG গাইড দিয়ে শুরু করা যাক। userChrome.css-এ নিচের কোডটি যোগ করুন:

.titlebar-color {
  color: -moz-accent-color-foreground;
  background-color: -moz-accent-color;
}

.tab-background {
  border-radius: 0px 0px !important;
  margin-bottom: 0px !important;
}

.tabbrowser-tab:not([selected="true"]):not([multiselected="true"]) .tab-background {
  background-color: color-mix(in srgb, currentColor 5%, transparent);
}

menupopup > menu, menupopup > menuitem {
  padding-block: 2px !important;
}

:root {
  --arrowpanel-menuitem-padding: 2px !important;
}

এটি আপনাকে прилиচcentaje ডিসেন্ট লুকস দেবে - এক্টিভ ট্যাবের বর্ডার থাকবে, ব্যাকগ্রাউন্ডগুলোতে থাকবে না। যাইহোক, আপনি স্ট্যান্ডার্ড প্রোটন চেয়ে ভালো কনট্রাস্ট পাবেন। আমি এটিকে যথেষ্ট পেয়েছিলাম, কিন্তু তারপর কিছু আরো মডিফিকেশন করতে সিদ্ধান্ত নিয়েছিলাম।

ব্যাকগ্রাউন্ড ট্যাব বর্ডার

আপনি যদি ব্যাকগ্রাউন্ড ট্যাবগুলোর ও বর্ডার চান, তবে নিচেরটি যোগ করতে পারেন:

.tabbrowser-tab:not([selected="true"]) > .tab-stack > .tab-background {
  border: 1px solid rgba(130, 130, 130, 0.5) !important;
}

এটি ব্যাকগ্রাউন্ড ট্যাবগুলোর সাথে লাইট গ্রে ১পিক্সেল স olid বর্ডার সেট করবে ৫০% ট্রান্সপারেন্সিতে। আপনি যেকোনো কালার বা ট্রান্সপারেন্সি ভ্যালু ব্যবহার করতে পারেন। এছাড়া, লক্ষ্য করুন যে এই ক্লজটি AskVG কোড স্নিপেটে ডিফাইন করা একটার সাথে খুব মিলিত, এবং আপনি আসলে রুলগুলো কম্বাইন করে সিএসএস ফাইলে ছোট, আরও কম্প্যাক্ট সেকশন बनाেতে পারেন। তবে, আপনি যদি নিশ্চিত নন কী করতে হবে, শুধু এক্সট্রা লাইনগুলো আলাদা যোগ করুন। কোনো конф্লিক্ট নেই, কারণ রুলগুলো লেয়ারড।

ফোরগ্রাউন্ড ট্যাব বর্ডার

সদৃশভাবে, আপনি এক্টিভ ট্যাবটিও টвиক করতে পারেন, OCD-এর জন্য:

.tabbrowser-tab[selected="true"] .tab-background {
  border-left: 1px solid rgba(130, 130, 130, 0.5) !important;
  border-right: 1px solid rgba(130, 130, 130, 0.5) !important;
}

ট্যাব এক্সেন্ট কালার

আপনি নিশ্চিত করতে পারেন এক্টিভ ট্যাব হাইলাইটেড এবং দৃশ্যমান, যাতে এটি অন্যান্য ট্যাব থেকে আলাদা হয়:

.tabbrowser-tab[selected="true"] .tab-background {
  border-top: 3px solid #3daee9 !important;

আপনি চাইলে উপরের ডেফিনিশনে এক্সট্রা লাইনটি যোগ করতে পারেন। আমার উদাহরণে, আমি এক্সেন্ট কালারকে ডেস্কটপ কালার স্কিমের সাথে মিলিয়েছিলাম। কালার কোড #3daee9 এই নির্দিষ্ট উদাহরণে প্লাজমা ডেস্কটপ tarafından ব্যবহৃত এক্সেন্ট কালার। আপনি সিস্টেম এক্সেন্ট কালার ব্যবহার করতে পারেন - যেমন টাইটলবার সিএসএস রুলে ডিফাইন করা:

border-top: 3px solid -moz-accent-color-foreground !important;

ট্যাববার হাইট

আপনি যদি ট্যাবগুলো ছোট করতে চান - পুরানো কম্প্যাক্ট মোডের মতো, তবে নিচের রুলগুলো যোগ করতে পারেন:

.toolbar-items, .tabbrowser-tab {
  max-height: 38px;
}

:root[uidensity=touch] .toolbar-items, .tabbrowser-tab {
  max-height: 45px;
}

আপনি ভ্যালুগুলো যেকোনো কিছুর সাথে মডিফাই করতে পারেন, উদাহরণস্বরূপ max-height: 28px; বা অনুরূপ। টাচ ক্লজ অপশনাল। আপনার জন্য যেকোনো ডেনসিটি (হাইট) যেটা কাজ করে সেটা ব্যবহার করুন।

কন্টেইনার ট্যাব কালার

ফায়ারফক্স ৯১ কন্টেইনার ট্যাবকে ব্ল্যান্ড এবং সাধারণ ট্যাব থেকে আলাদা করা কঠিন করে দেয়। তাই আমি একটু রঙ যোগ করতে সিদ্ধান্ত নিয়েছিলাম [sic]। অনেক অপশন আছে, এবং এখন পর্যন্ত, আপনাকে প্রয়োজনীয় পরিবর্তনগুলো করার সাথে কিছুটা আরামদায়ক মনে হওয়া উচিত। আমি ফুলি কালারড ট্যাবের জন্য গেলাম যা কন্টেইনার কালারের সাথে মিলে, প্লাস সুন্দর বর্ডার, যাতে আমার OCD ডেমনরা জাগতে না পায়:

.tabbrowser-tab[usercontextid] .tab-background {
  background: var(--identity-tab-color) !important;
  border-left: 1px solid rgba(130, 130, 130, 0.5) !important;
  border-right: 1px solid rgba(130, 130, 130, 0.5) !important;
  border-bottom: var(--identity-tab-color) !important;
  opacity: 0.8 !important;
}

প্রতিটি ট্যাব তার নিজস্ব আইডেন্টিটি কালার ব্যবহার করে (ভার ক্লজ দ্বারা ডিফাইনড), বটম বর্ডার আইডেন্টিটি কালারের সাথে মিলে যাতে ট্যাবটি ট্যাব বারের সাথে সুন্দরভাবে ব্লেন্ড হয়, এবং সাইড বর্ডারগুলো সাধারণ ট্যাবের মতো। আমি বিভিন্ন অপশন ট্রাই করেছিলাম। উদাহরণস্বরূপ, আমি ২০% এবং ৮০% অপাসিটি অপশন ট্রাই করেছিলাম। Sicht:

এবং এখন, আপনার ফায়ারফক্স অনেক বেটার দেখায়! আরেকটা ক্রেজি ছোট উদাহরণ:

এক্সট্রা কসমেটিক্স

আপনি আরও অনেক কিছু করতে পারেন। আমি এড্রেস বারের জুম বাটনটিও টвиক করেছিলাম, কারণ প্যাডিং একটু অফ ছিল, এবং আমরা কানো rogue পিক্সেল রাখতে পারি না। কিন্তু আমাদের এখানেই শেষ করা উচিত, একটি হাই নোটে।

#urlbar-zoom-button {
padding-top: 0px !important;
}

উপসংহার

এবার হলো। আজ, আমি আপনাকে দেখিয়ে দিলাম কিভাবে ফায়ারফক্স ৯১-এ wprowadিত কিছু নিরর্থক "মডার্ন" ইউআই পরিবর্তন অনডু করতে হয়। যতক্ষণ ফায়ারফক্সে সিএসএস ওভাররাইডস থাকবে, আশা থাকবে। আপনার সফ্টওয়্যারের সাথে লড়াই করা মজার নয়, কিন্তু কমপক্ষে আপনার কাছে লো-আইকিউ জিনিসগুলো সরিয়ে প্রোডাক্টিভিটি এবং ইফিশিয়েন্সি বজায় রাখার অপশন আছে। উপরের সিএসএস রুলগুলো দিয়ে, ফায়ারফক্স ৯১, এবং আরও গুরুত্বপূর্ণ, ফায়ারফক্স ৯১ ESR, ফরেসিবল ফিউচারের জন্য יחסית ডিসেন্ট এবং ব্যবহারযোগ্য দেখাবে।

এক বা দু বছর পর কী হবে? কে জানে। আমি এখনও মনে করি ফায়ারফক্স আপনার ডিফল্ট ব্রাউজার হওয়া উচিত, মোজিলা টিম দ্বারা এতে ঢুকানো সকল ননসেন্সের বাবजूद, কিন্তু আমি নিশ্চিত নই আমি কতক্ষণ সেই পজিশন ধরে রাখতে পারব। কোনো সময়, ফায়ারফক্স তার প্রতিদ্বন্দ্বীদের মত ভিজ্যুয়ালি কুৎসিত এবং 쓸모없ে হতে পারে। আমি নही জানি সেটার পর আমি কী করব, কারণ আমি ইন্টারনেট ব্যবহার করতে চাই না যখন ক্রোমিয়াম-ভিত্তিক ব্রাউজার আমার একমাত্র অপশন হবে। ওয়েব কি ত্যাগ করব? সেটা হতে পারে একটি সমাধান। ভালো, আমাদের আজ সেই কঠিন চয়েস ফেস করতে হবে না। সিএসএস টвиকস ডান। ইন্টেলিজেন্স ১, হিপস্টারোলজি ০। দ এন্ড।

চিয়ার্স।