Milligram: Bilah navigasi sebagai bagian dari miligram?

Idenya bagus tapi niat saya adalah untuk menjaga Milligram seringan mungkin, mendukung fitur minimum yang diperlukan untuk menginisialisasi sebuah proyek. BTW, apa yang Anda usulkan akan menjadi komponen yang sangat spesifik. Saya menutup permintaan Anda dan menghargai upaya mereka untuk meningkatkan proyek ini.

https://github.com/milligram/milligram/pull/46

Hai @alexjj @abouthiroppy

Sebenarnya, niat saya adalah untuk menjaga Milligram seringan mungkin, mendukung fitur minimum yang diperlukan untuk menginisialisasi sebuah proyek.

Anda membantu saya memiliki ide bagus! Saya akan membuat repositori dengan komponen yang diproduksi dengan Milligram. Ini seharusnya membantu banyak orang, tempat di mana mereka dapat lebih mudah menemukan sesuatu yang dapat membantunya dalam kehidupan sehari-hari.

http://codepen.io/milligram/

Tampaknya tidak terkenal atau digunakan, tetapi saya juga ingin berbagai navbar

Sama di sini, navbar dan menu adalah fitur minimum yang diperlukan untuk sebuah proyek, bukan?

Heya, saya sedang mencari kerangka kerja yang dapat menggantikan bootstrap untuk saya dan miligram adalah pesaing yang serius.

Saya benar-benar dapat melakukannya dengan beberapa contoh lagi karena saya belum terbiasa dengan kerangka kerja tetapi tautan codepen yang Anda ajukan tidak berfungsi. Apakah Anda memiliki tautan lain?

Terima kasih!

Anda memberi saya ide-ide bagus. 😍

Adakah hasil pada ide navbar?

Miligram cukup bagus tetapi saya pasti ingin melihat lebih banyak opsi Nav, terutama untuk digunakan dengan build Sage 9 (Wordpress), yang biasanya membutuhkan nav walker kecuali seseorang dapat mengoreksi saya tentang itu?, Terima kasih

Tautan @cjpatoilo sepertinya mati. Tautan baru adalah https://codepen.io/milligramcss/

(Plus, saya pasti akan menambahkan navbar ke Milligram. Saya tidak setuju dengan orang lain yang mengatakan bahwa itu adalah hal yang sempit untuk diinginkan orang, 90% situs web memiliki navbar.)

bilah navigasi akan sangat bagus

Saya ingin menambahkan bahwa fakta bahwa situs github.io memiliki navbar membuat saya percaya bahwa paket itu sendiri memiliki navbar. itu cukup tidak jujur.

saya tidak setuju. Dokumen halaman tidak menyatakan navbar adalah komponen inti di mana pun. Fakta halaman memiliki navbar tidak berarti itu adalah bagian dari kerangka kerja. Itu tidak jujur, Anda hanya membuat asumsi yang salah.

Ya, saya pikir paket itu memiliki navbar sampai saya mulai membaca dan ternyata tidak. Sejujurnya itu mengejutkan saya - harapan saya dalam melihat paket ui adalah bahwa mereka umumnya hanya menggunakan alat yang mereka sediakan. Saya melihat-lihat situs css - cukup menata tag nav dan menambahkan beberapa gaya untuk tautan nav sepertinya tidak akan menambah terlalu banyak overhead?

^^ semua yang mengatakan... adakah yang mengimplementasikan navbar dengan logo dan item menu yang cukup sederhana yang secara responsif memecah ke menu tipe hamburger di ponsel sebagai contoh?
EDIT: menambahkan di sini bahwa JS tidak disukai ... TERUTAMA jquery. tidak. CSS hanya sangat disukai. cheat yang diizinkan adalah sejumlah kecil vanilla JS tetapi tidak memiliki JS sama sekali.

^^ semua yang mengatakan... adakah yang mengimplementasikan navbar dengan logo dan item menu yang cukup sederhana yang secara responsif memecah ke menu tipe hamburger di ponsel sebagai contoh?

Saya mencoba melakukannya sekarang menggunakan contoh yang disertakan dalam miligram, menggunakan https://github.com/shuedna/Milligram-baseSite-withMenu sebagai referensi. Saya juga sangat tidak berpengalaman dengan ini jadi mungkin tidak berhasil.

Tapi saya setuju dengan di atas; navigasi responsif cukup mendasar.

memperbarui permintaan sebelumnya... Hanya CSS, tanpa JS, terutama tanpa jQuery.

Hanya CSS Miligram NavBar

Sumber
Contoh
Lisensi MIT

Tergantung pada perpustakaan dasar.

Kerja bagus @popey456963. Satu-satunya hal adalah bahwa itu tidak dipecah menjadi menu gaya hamburger.
Saya melewatkan persyaratan no JS/jquery, atau vanilla JS. Either way saya belum punya banyak keberhasilan pada akhir saya .. belum.

Saya menghentikan pencarian saya untuk navigasi css-only yang runtuh ke menu hamburger untuk saat ini karena waktu; Saya hanya mengganti teks dengan ikon font-mengagumkan yang lebih kompak dan ditampilkan dengan baik saat diperkecil. Juga, untuk elemen 'navigation-item' saya mengurangi margin-kiri menjadi 1.5rem.

Setelah saya menyelesaikan proyek ini, saya akan mencoba lagi... jika orang lain belum menyelesaikannya.

Juga, sembunyikan navbar saat menggulir ke atas:
Untuk kelas navigasi tambahkan: transisi: 0.3s teratas;
Tambahkan id = "bar navigasi"
JS di bawah:

var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
  var currentScrollPos = window.pageYOffset;
  if (prevScrollpos > currentScrollPos) {
    document.getElementById("navbar").style.top = "0";
  } else {
    document.getElementById("navbar").style.top = "-50px";
  }
  prevScrollpos = currentScrollPos;
}

Tidak diperlukan Jquery atau deps lainnya

Saya pikir biasanya Anda ingin menyembunyikan bilah navigasi pada gulir ke bawah, bukan gulir ke atas?

Kode ini untuk gulir ke bawah. Maaf, saya salah bicara

Menindaklanjuti nav responsif khusus css... yang ini sederhana dan berfungsi dengan baik:
https://codepen.io/chuckreynolds/pen/ROaeXv

Menindaklanjuti nav responsif khusus css... yang ini sederhana dan berfungsi dengan baik:
codepen.io/chuckreynolds/pen/ROaeXv

Terima kasih untuk tautannya. Tapi bagaimana saya menyatukannya? Konten wadah saya menggulir 'di belakang' tajuk. Harus ada semacam bantalan.

Hanya sebuah komentar.

Jika ada hal-hal navbar yang dibuat sebelumnya, membangun UI akan lebih cepat.
Namun, bukankah menurut kalian navbar adalah sesuatu yang tidak berguna? Saya lebih suka menyediakan navbar seperti gaya Semantic-UI (menggunakan menu untuk menyediakan navbar).

Saya pikir tidak too much baik. :)

Teman-teman, terima kasih telah membantu @. Untuk saat ini, saya akan menutup masalah ini.
Jika seseorang membutuhkan bantuan jangan ragu untuk membuka kembali atau membuka yang baru!