文件列表:

.vscode/ (0, 2023-09-07)
.vscode/extensions.json (75, 2023-09-07)
index.html (560, 2023-09-07)
netlify.toml (63, 2023-09-07)
package-lock.json (61361, 2023-09-07)
package.json (444, 2023-09-07)
postcss.config.js (82, 2023-09-07)
public/ (0, 2023-09-07)
public/favicon.ico (4286, 2023-09-07)
public/images/ (0, 2023-09-07)
public/images/desktop-img.svg (7091, 2023-09-07)
public/images/favicon-32x32.png (1063, 2023-09-07)
public/images/icon-list.svg (227, 2023-09-07)
public/images/icon-success.svg (408, 2023-09-07)
public/images/illustration-sign-up-mobile.svg (7909, 2023-09-07)
screenshot.png (569638, 2023-09-07)
src/ (0, 2023-09-07)
src/App.vue (4070, 2023-09-07)
src/assets/ (0, 2023-09-07)
src/assets/base.css (691, 2023-09-07)
src/assets/logo.svg (276, 2023-09-07)
src/assets/main.css (541, 2023-09-07)
src/components/ (0, 2023-09-07)
src/components/AlertModal.vue (979, 2023-09-07)
src/main.js (144, 2023-09-07)
tailwind.config.js (471, 2023-09-07)
vite.config.js (309, 2023-09-07)

# fem-newsletter # Frontend Mentor - Newsletter sign-up form with success message solution This is a solution to the [Newsletter sign-up form with success message challenge on Frontend Mentor](https://www.frontendmentor.io/challenges/newsletter-signup-form-with-success-message-3FC1AZbNrv). Frontend Mentor challenges help you improve your coding skills by building realistic projects. ## Table of contents - [Overview](#overview) - [The challenge](#the-challenge) - [Screenshot](#screenshot) - [Links](#links) - [My process](#my-process) - [Built with](#built-with) - [Useful resources](#useful-resources) - [Author](#author) ## Overview ### The challenge Users should be able to: - Add their email and submit the form - See a success message with their email after successfully submitting the form - See form validation messages if: - The field is left empty - The email address is not formatted correctly - View the optimal layout for the interface depending on their device's screen size - See hover and focus states for all interactive elements on the page ### Screenshot  ### Links - Live Site URL: ## My process ### Built with - HTML5 - TailwindCSS - Desktop-first workflow - [VueJs](https://vuejs.org/) - JS library - [Styled Components](https://tailwindcss.com/) - For styles ### Useful resources - [BoxShadow](https://cssgenerator.org/box-shadow-css-generator.html) - This helped me with custom box shadow - [Animation](https://animate.style/) - This helped me with animation ## Author - Frontend Mentor - [@sincerely-chiche](https://www.frontendmentor.io/profile/yourusername) - Twitter - [@immicks](https://www.twitter.com/immicks) This template should help get you started developing with Vue 3 in Vite. ## Recommended IDE Setup [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin). ## Customize configuration See [Vite Configuration Reference](https://vitejs.dev/config/). ## Project Setup ```sh npm install ``` ### Compile and Hot-Reload for Development ```sh npm run dev ``` ### Compile and Minify for Production ```sh npm run build ```

近期下载者：

相关文件：

评论：[我要评论] [举报此文件]

收藏者：