After successfully publishing my website using quarto with R, everything appears fine on desktop and mobile except for a minor issue with drop down menus on iPhone, showing blue lines when clicked.
https://i.sstatic.net/xJRmU.jpg
At the bottom of my .yml file, I have the following setting:
format:
html:
css: styles.css
toc: true
I have attempted adding the following code snippets to my css file, but the issue still persists:
.header-menu-sidebar .nav-ul a {
outline: none !important;
}
.et_mobile_menu {
border-top: 2px solid
##ff5733!important;
}
If you have any insights or tips to resolve this issue, I would greatly appreciate it! Thank you!
Update
Here is a snippet from my .yml file:
project: type: website website: title: "helloworld" navbar: left: - text: Home menu: - href: index.qmd right: - text: ABOUT menu: - text: Education format: html: css: styles.css toc: true
And this is the content of my styles.css file:
/* css styles */
.navbar-dark {
background-color: #222222;
}