We offer top-notch content for easy learning, with clear visual development principles.
Home Page: https://anilearn.dev
IN THE NAME OF ALLAH
I'm Ali Reza! I've got 3+ years of web dev experience, mainly focusing on front-end magic with ReactJS. I'm all about embracing new challenges and learning opportunities. Let's build something awesome together!
BTW. This applies to all input fields for custom image URLs.
Works with image URLs like https://miro.medium.com/v2/format:webp/1*LFSrbkB_nFr65tCSa4vaaw.png, but needs additional validation.
Works
Does not work, obviously
Does not work with https://miro.medium.com/v2/resize:fit:1400/format:webp/1*LFSrbkB_nFr65tCSa4vaaw.png and any other valid image URLs and needs additional validation on top of it.
You could use something like the following to determine whether the given URL is an image and display an error message if no valid image was found:
const urlContainsImage = async (url) => {
const response = await fetch(url, { method: 'GET' })
if (response && response?.ok) {
const contentType = response.headers.get('content-type')
if (contentType) {
return contentType.startsWith('image/')
}
}
return false
}
Applies to all custom user input fields for image URLs.
No response
It seems the src attribute for the graphical submit button is missing / broken.
Image exampleNo response
I have noticed that the README.md appears to be incomplete. There is an error in step 2 of the Contributing section, where it states "Clone t" instead of "Clone the Repository". Additionally, step 3 instructs to navigate to the "4c-site" directory instead of "AniLearn.dev". I would like to propose adding additional steps for staging, committing, and creating a pull request. I am enthusiastic about contributing to this project and would appreciate your assignment. I have attached a screenshot for your reference.
CSS opacity property that set transparency of an element
I want to add this into the project
No response
add dark mode theme for website for web users.
No response
No response
On https://www.anilearn.dev/css/display-property, there is no visual change when switching between inline and inline-block.
Since only the header inline style is being updated, there is no visual change between inline and inline-block. To change that, consider updating the paragraph element underneath the header as well or update the entire example.
No response
I recommend including a step that guides contributors to confirm they have the pnpm package manager installed separately, as it will not be automatically downloaded when installing node.js.
I believe it would be beneficial to include an additional step for installing pnpm at this location.
The website is good with light mode but the code is not more visible in light mode therefore a dark mode toogle button should be there so that users can switch from light to dark mode.
A toggle button at the right corner to switch between light and dark mode
As you can see there is one typo:
Instead of "Add you own Image URL" it should be "Add your own Image URL"
The placeholder URL input shows https:// but the URL from the preview to the right starts with www..
Based on the placeholder, I should use something like https://rschu.me/ which will result into WWW.HTTPS://RSCHU.ME/.
You might want to make it more clear which URL format is valid to avoid issues like that.
No response
When I was at box model page of css and I tried to visit the repository by clicking on the github button it loaded the same page instead of github repo
I will solve this issue
No response
The current Flex Order demo page is coming soon but there is already a link to a page that does not exist yet.
Consider removing the link and use opacity: 60%; or a darker text color, etc.
What if we can add a JavaScript section as well @AliReza1083 ?
Dropdown elements, such as for the ratio on the https://www.anilearn.dev/css/filter page, do not update on change and do not show the initial option.
Consider displaying the default option (e.g., landscape instead of ratio) and use ratio as label above or next to the dropdown. It makes it more clear to the user which option is active and to which option the dropdown was changed to.
This applies to all pages where dropdown elements are being used.
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.