Any tips on improving this project would be greatly appreciated
Ajayi Michael
@Michaelajayi150All comments
- @adetoye-devSubmitted about 2 years ago@Michaelajayi150Posted about 2 years ago
@adetoye-dev - Implement the map display and also make the site fetch domains as well... Your CSS as well needs adjustments
For the map read the Leaflet quick guide This should properly help you in setting the map to display and also add your marker.
The background image of the header is not covering the whole page.. You should probably check that out as well
Hope this helped....
1 - @MahdiSohailySubmitted about 2 years ago@Michaelajayi150Posted about 2 years ago
Nice app... Love the work done here You could possibly fix your HTML issues though...
- Try use data attributes for your color-scheme Instead of
<html color-scheme="light" lang="en">
Do this
<html data-color-scheme="light" lang="en">
then change the CSS to:
[data-color-scheme="light"] { /* whatever light mode does */ } [data-color-scheme="dark"] { /* whatever dark mode does */ }
- The properties that you are using such as inset are not valid CSS properties... Check out Tutorial Republic to get the particular property you are looking for
Hope this helped... If it did, kindly mark as useful π
Marked as helpful0 - @Pranshu-SahuSubmitted about 2 years ago
completing bonus part , that is , drag and drop functionality was quite difficult but learnt a lot in the process.
I hope to receive help so that I can remove accessibility issue. All suggestion and feedback are welcome.
@Michaelajayi150Posted about 2 years agoHi there @Pranshu-Sahu.... Concerning your accessibility issues
- There must be an "h1" tag in your project... Headers tags are not just for font customization only, they serve greater purpose to screen readers... I'd advice your text "TODO" place it in an h1 tag
<h1 class="heading-tag">TODO</h1>
then style it to fit the font size and weight you want
.heading-tag { font-size: blah blah font-weight: blah blah blah }
- Organize your div's properly into main tags, header tags and footer tags... The order must be:
<body> <header> All other elements/tags must be a sub element of either of this three element </header> <main> All other elements/tags must be a sub element of either of this three element </main> <footer> All other elements/tags must be a sub element of either of this three element </footer> </body>
Then the HTML issue...
- Remove the role attribute you placed in the img tag, role is not needed as soon as you have an alt attribute already
<img src="blah blah" alt="description of blah blah" />
Glad to help π Kindly mark if this was helpful to you π€
0 - @Michaelajayi150Submitted about 2 years ago@Michaelajayi150Posted about 2 years ago
Having an HTML issue here... I don't have a type attribute in my link tag when importing LessCSS from their CDN and the report still claim that I still do whereby it has been removed.... Any one with idea of how to resolve this please
0 - @bit-01Submitted about 2 years ago@Michaelajayi150Posted about 2 years ago
Hi, awesome work on this π You do have an accessibility issue though, I suggest you add a label for your input place it over the input field and make it visibility - hidden and opacity - 0
Hope this helped π
Marked as helpful1 - @SantiagoLaraESubmitted about 2 years ago@Michaelajayi150Posted about 2 years ago
Nice work... You should probably check the report for accessibility and HTML5 issues
There are some issue on the semantics used.... Glad I could help
Marked as helpful0