প্লেস UI কিট কাস্টমাইজ করার জন্য CSS বৈশিষ্ট্য

প্লেসেস ইউআই কিট ডিসপ্লে এলিমেন্ট কনফিগার করার জন্য বিভিন্ন সেটিংস এবং কাস্টম সিএসএস প্রোপার্টি সমর্থন করে। এই প্রোপার্টিগুলি কীভাবে ইউআই কিটে প্রয়োগ করা যেতে পারে তা দেখতে এই সিএসএস প্রোপার্টি রেফারেন্স টেবিলটি ব্যবহার করুন।

কাস্টমাইজেশন টুল ব্যবহার করে বিভিন্ন সেট প্রপার্টি কীভাবে প্লেসেস ডিটেইলস এলিমেন্টের চেহারাকে প্রভাবিত করবে তা কল্পনা করুন এবং HTML/CSS, Kotlin/XML এবং Swift-এ কোড অ্যাক্সেস করুন।

প্লেসেস ইউআই কিটটি ম্যাটেরিয়াল ডিজাইনের উপর ভিত্তি করে ভিজ্যুয়াল কাস্টমাইজেশনের জন্য একটি ডিজাইন সিস্টেম পদ্ধতি প্রদান করে (কিছু গুগল ম্যাপ-নির্দিষ্ট পরিবর্তন সহ)। রঙ এবং টাইপোগ্রাফির জন্য ম্যাটেরিয়াল ডিজাইনের রেফারেন্স দেখুন। ডিফল্টরূপে, স্টাইলটি গুগল ম্যাপস ভিজ্যুয়াল ডিজাইন ভাষার সাথে সঙ্গতিপূর্ণ।

সিএসএস বৈশিষ্ট্য

ডিফল্ট রঙের স্কিম

ডিফল্টরূপে, Places UI Kit উপাদানগুলি স্বয়ংক্রিয়ভাবে ব্যবহারকারীর পছন্দের রঙের স্কিমের সাথে খাপ খাইয়ে নেয়, ব্যবহারকারীর ব্রাউজার বা সিস্টেমটি হালকা বা অন্ধকার মোডে সেট করা আছে কিনা তা সনাক্ত করে। উপাদানটির চেহারা স্বয়ংক্রিয়ভাবে ব্যবহারকারীর পছন্দের সাথে মেলে সামঞ্জস্য হবে।

আপনার নিজস্ব কাস্টম স্টাইল প্রয়োগ করার সময়, দৃশ্যমান অসঙ্গতি রোধ করতে হালকা এবং অন্ধকার উভয় মোডে আপনার পরিবর্তনগুলি পরীক্ষা করুন। যদি আপনার অ্যাপ্লিকেশনটি একটি একক, স্থির থিম ব্যবহার করে, তাহলে স্বয়ংক্রিয় থিম স্যুইচিং ব্যবহারকারীর অভিজ্ঞতা খারাপ করতে পারে। উদাহরণস্বরূপ, আপনার হালকা-থিমযুক্ত অ্যাপে একটি অন্ধকার-থিমযুক্ত উপাদান উপস্থিত হতে পারে। এটি প্রতিরোধ করার জন্য, আপনি CSS-এ color-scheme সেট করে উপাদানটিকে সর্বদা একটি নির্দিষ্ট থিমে রেন্ডার করতে বাধ্য করতে পারেন।

গুগল ম্যাপস ব্র্যান্ড অ্যাট্রিবিউশন

গুগল ম্যাপের পরিষেবার শর্তাবলী অনুসারে গুগল ম্যাপ অ্যাট্রিবিউশনের জন্য আপনাকে তিনটি ব্র্যান্ড রঙের মধ্যে একটি ব্যবহার করতে হবে। কাস্টমাইজেশন পরিবর্তন করার সময় এই অ্যাট্রিবিউশনটি দৃশ্যমান এবং অ্যাক্সেসযোগ্য হতে হবে। আরও তথ্যের জন্য অ্যাট্রিবিউশনের প্রয়োজনীয়তাগুলি দেখুন।

আমরা তিনটি ব্র্যান্ড রঙের একটি পছন্দ অফার করি যা হালকা এবং অন্ধকার থিমের জন্য স্বাধীনভাবে সেট করা যেতে পারে:

• হালকা থিম: সাদা, ধূসর এবং কালো রঙের জন্য বৈশিষ্ট্য সহ PlaceAttributionElement.lightSchemeColor ।
• গাঢ় থিম: সাদা, ধূসর এবং কালো রঙের জন্য বৈশিষ্ট্য সহ PlaceAttributionElement.darkSchemeColor ।

<gmp-place-content-config>
  <gmp-place-attribution
      light-scheme-color="black"
      dark-scheme-color="white"
  ></gmp-place-attribution>
</gmp-place-content-config>