Skip to content

Commit

Permalink
optimized images
Browse files Browse the repository at this point in the history
  • Loading branch information
catherineisonline committed Apr 22, 2022
1 parent 5a615cf commit 1463a8c
Show file tree
Hide file tree
Showing 54 changed files with 27 additions and 28 deletions.
2 changes: 1 addition & 1 deletion deploy.sh
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
#!/usr/bin/env sh
# !/usr/bin/env sh
# abort on errors
set -e
# build
Expand Down
3 changes: 1 addition & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
"name": "frontend-mentor-challenge-solutions",
"version": "0.1.0",
"private": true,
"homepage": "/frontend-mentor-challenge-solutions",
"wst": "/dist/",

"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
Expand Down
50 changes: 25 additions & 25 deletions src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ export default {
headerDetails: [
{
headerIcon: require("@/assets/images/favicon.png"),
navIcon: require("@/assets/images/nav-icon.jpg"),
navIcon: require("@/assets/images/nav-icon.jpeg"),
projectUrl: "https://frontend-mentor-challenge-solutions.vercel.app/",
frontendMentorUrl:
"https://www.frontendmentor.io/profile/catherineisonline",
Expand All @@ -141,7 +141,7 @@ export default {
projectDescribtion:
"This is a great small challenge to help get you used to building to a design. There's no JS in this project, so you'll be able to focus on your HTML & CSS skills.",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/stats-preview-card-component.jpg"),
projectPreview: require("@/assets/images/stats-preview-card-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/stats-preview-card-component-frontendmentor/",
projectLink:
Expand All @@ -155,7 +155,7 @@ export default {
projectDescribtion:
"A perfect project for newbies who are starting to build confidence with layouts!",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/order-summary-component.jpg"),
projectPreview: require("@/assets/images/order-summary-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/order-summary-component-frontendmentor/",
projectLink:
Expand All @@ -169,7 +169,7 @@ export default {
projectDescribtion:
"This is a perfect challenge to test your layout skills. The card layout doesn't shift, so it's also great for those that haven't dived into responsive websites yet!",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/profile-card-component.jpg"),
projectPreview: require("@/assets/images/profile-card-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/profile-card-component-frontendmentor/",
projectLink:
Expand All @@ -183,7 +183,7 @@ export default {
projectDescribtion:
"In this challenge, you will build out the pricing component to the designs provided. This is perfect for beginners and people who want to complete a smaller challenge.",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/single-price-grid-component.jpg"),
projectPreview: require("@/assets/images/single-price-grid-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/single-price-grid-component-frontendmentor/",
Expand All @@ -198,7 +198,7 @@ export default {
projectDescribtion:
"This challenge is perfect if you're just getting started. The shift between the layouts will be a nice test if you're new to building responsive projects.",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/3-column-preview-card-component.jpg"),
projectPreview: require("@/assets/images/3-column-preview-card-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/3-column-card-component-frontendmentor/",
projectLink:
Expand All @@ -212,7 +212,7 @@ export default {
projectDescribtion:
"This project will test your layout skills. If you're starting to get confident with Flexbox or Grid, this will provide a nice challenge!",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/social-proof-section.jpg"),
projectPreview: require("@/assets/images/social-proof-section.jpeg"),
liveLink:
"https://catherineisonline.github.io/social-proof-section-frontendmentor/",
Expand All @@ -227,7 +227,7 @@ export default {
projectDescribtion:
"A nice layout-based challenge for beginners. This will test anyone who is new to multi-column and responsive layouts.",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/four-card-feature-section.jpg"),
projectPreview: require("@/assets/images/four-card-feature-section.jpeg"),
liveLink:
"https://catherineisonline.github.io/four-card-feature-section-frontendmentor/",
Expand All @@ -242,7 +242,7 @@ export default {
projectDescribtion:
"This HTML & CSS only challenge is perfect for anyone just starting out or anyone wanting a small project to play around with.",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/NFT-preview-card-component.jpg"),
projectPreview: require("@/assets/images/NFT-preview-card-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/nft-preview-card-frontendmentor/",
Expand All @@ -257,7 +257,7 @@ export default {
projectDescribtion:
"A perfect challenge for beginners, this project will get you working with a two column layout.",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/huddle-landing-page-with-a-single-introductory section.jpg"),
projectPreview: require("@/assets/images/huddle-landing-page-with-a-single-introductory section.jpeg"),
liveLink:
"https://catherineisonline.github.io/huddle-landing-page-with-a-single-introductory-section-frontendmentor/",
Expand All @@ -272,7 +272,7 @@ export default {
projectDescribtion:
"This component has some interesting CSS challenges in the design. If you're looking to test your CSS skills, this will be a great project for you!",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/fylo-data-storage-component.jpg"),
projectPreview: require("@/assets/images/fylo-data-storage-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/fylo-data-storage-component-frontendmentor/",
projectLink:
Expand All @@ -286,7 +286,7 @@ export default {
projectDescribtion:
"A perfect first challenge if you're new to HTML and CSS. The card layout doesn't shift, so it's ideal if you haven't learned about building responsive layouts yet.",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/QR-code-component.jpg"),
projectPreview: require("@/assets/images/QR-code-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/QR-code-component-frontendmentor/",
Expand All @@ -301,7 +301,7 @@ export default {
projectDescribtion:
"This challenge will be perfect practice for anyone wanting to test their CSS Grid skills. Grid is such a powerful addition to CSS, so it's worth getting to grips with it!",
projectStack: ["HTML", "CSS"],
projectPreview: require("@/assets/images/testimonials-grid-section.jpg"),
projectPreview: require("@/assets/images/testimonials-grid-section.jpeg"),
liveLink:
"https://catherineisonline.github.io/testimonials-grid-section-frontendmentor/",
Expand All @@ -316,7 +316,7 @@ export default {
projectDescribtion:
"In this challenge, you'll be using two separate APIs together to create an IP Address Tracking app.",
projectStack: ["HTML", "CSS", "JS", "API"],
projectPreview: require("@/assets/images/IP-address-tracker-challenge.jpg"),
projectPreview: require("@/assets/images/IP-address-tracker-challenge.jpeg"),
liveLink:
"https://catherineisonline.github.io/ip-address-tracker-frontendmentor/",
Expand All @@ -331,7 +331,7 @@ export default {
projectDescribtion:
"Integrate with the shrtcode URL shortening API and play with browser storage in this landing page challenge.",
projectStack: ["HTML", "CSS", "JS", "API"],
projectPreview: require("@/assets/images/URL-shortening-API-landing-page.jpg"),
projectPreview: require("@/assets/images/URL-shortening-API-landing-page.jpeg"),
liveLink:
"https://catherineisonline.github.io/url-shortening-api-frontendmentor/",
Expand All @@ -346,7 +346,7 @@ export default {
projectDescribtion:
"Practice your layout skills with this article preview component. There's lots of fun to be had playing around with animations for the sharing icons as well.",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/article-preview-component.jpg"),
projectPreview: require("@/assets/images/article-preview-component.jpeg"),
liveLink:
"https://catherineisonline.github.io/article-preview-component-frontendmentor/",
Expand All @@ -361,7 +361,7 @@ export default {
projectDescribtion:
"This challenge is great for beginners and offers a chance to practice basic client-side form validation.",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/ping-coming-soon.jpg"),
projectPreview: require("@/assets/images/ping-coming-soon.jpeg"),
liveLink:
"https://catherineisonline.github.io/ping-coming-soon-page-frontendmentor/",
Expand All @@ -376,7 +376,7 @@ export default {
projectDescribtion:
"In this challenge, you'll be building out an FAQ accordion. This is an extremely common front-end pattern, so it's a great opportunity to get some practice in!",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/FAQ-accordion-card.jpg"),
projectPreview: require("@/assets/images/FAQ-accordion-card.jpeg"),
liveLink:
"https://catherineisonline.github.io/faq-accordion-card-frontendmentor/",
Expand All @@ -391,7 +391,7 @@ export default {
projectDescribtion:
"This layout looks simple enough, but there are some interesting details to it that will test your CSS skills. You'll also get to practice basic form validation.",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/Base-Apparel-coming-soon-page.jpg"),
projectPreview: require("@/assets/images/Base-Apparel-coming-soon-page.jpeg"),
liveLink:
"https://catherineisonline.github.io/base-apparel-coming-soon-frontendmentor/",
Expand All @@ -406,7 +406,7 @@ export default {
projectDescribtion:
"The perfect project if you're learning how to interact with 3rd-party APIs. This challenge uses the Advice Slip API to generate random quotes of advice.",
projectStack: ["HTML", "CSS", "JS", "API"],
projectPreview: require("@/assets/images/advice-generator-app.jpg"),
projectPreview: require("@/assets/images/advice-generator-app.jpeg"),
liveLink:
"https://catherineisonline.github.io/advice-generator-app-frontendmentor/",
Expand All @@ -421,7 +421,7 @@ export default {
projectDescribtion:
"Practice building out a sign-up form complete with client-side validation using JavaScript.",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/Intro-component-with-sign-up-form.jpg"),
projectPreview: require("@/assets/images/Intro-component-with-sign-up-form.jpeg"),
liveLink:
"https://catherineisonline.github.io/intro-component-with-sign-up-form-frontendmentor/",
Expand All @@ -436,7 +436,7 @@ export default {
projectDescribtion:
"This challenge will get you thinking about building an accessible custom toggle control and also test your layout skills.",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/pricing-component-with-toggle.jpg"),
projectPreview: require("@/assets/images/pricing-component-with-toggle.jpeg"),
liveLink:
"https://catherineisonline.github.io/pricing-component-with-toggle-frontendmentor/",
Expand All @@ -451,7 +451,7 @@ export default {
projectDescribtion:
"This challenge will be a perfect test of your layout and responsive skills. There's a tiny bit of JS for the mobile menu, but the focus is HTML & CSS.",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/sunnyside-agency-landing-page.jpg"),
projectPreview: require("@/assets/images/sunnyside-agency-landing-page.jpeg"),
liveLink:
"https://catherineisonline.github.io/sunnyside-agency-landing-page-frontendmentor/",
Expand All @@ -466,7 +466,7 @@ export default {
projectDescribtion:
"This design has some nice layout challenges in it. A perfect training ground to practice your Flexbox and/or Grid skills.",
projectStack: ["HTML", "CSS", "JS"],
projectPreview: require("@/assets/images/fylo-dark-theme-landing-page.jpg"),
projectPreview: require("@/assets/images/fylo-dark-theme-landing-page.jpeg"),
liveLink:
"https://catherineisonline.github.io/fylo-dark-theme-landing-page-frontendmentor/",
Expand All @@ -481,7 +481,7 @@ export default {
projectDescribtion:
"If you're wanting to test your JavaScript skills this is the challenge for you. Use whichever JS framework you prefer and pull data from the REST Countries API.",
projectStack: ["HTML", "CSS", "JS", "API"],
projectPreview: require("@/assets/images/rest-countries-api-with-color-theme-switcher.jpg"),
projectPreview: require("@/assets/images/rest-countries-api-with-color-theme-switcher.jpeg"),
liveLink:
"https://catherineisonline.github.io/rest-countries/",
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/Base-Apparel-coming-soon-page.jpg
Binary file not shown.
Binary file added src/assets/images/FAQ-accordion-card.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/FAQ-accordion-card.jpg
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/IP-address-tracker-challenge.jpg
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file added src/assets/images/NFT-preview-card-component.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/NFT-preview-card-component.jpg
Binary file not shown.
Binary file added src/assets/images/QR-code-component.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/QR-code-component.jpg
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Binary file added src/assets/images/advice-generator-app.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/advice-generator-app.jpg
Binary file not shown.
Binary file added src/assets/images/article-preview-component.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/article-preview-component.jpg
Binary file not shown.
Binary file modified src/assets/images/favicon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/images/four-card-feature-section.jpeg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/four-card-feature-section.jpg
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed src/assets/images/fylo-dark-theme-landing-page.jpg
Binary file not shown.
Binary file removed src/assets/images/fylo-data-storage-component.jpg
Diff not rendered.
Diff not rendered.
Binary file added src/assets/images/nav-icon.jpeg
Binary file removed src/assets/images/nav-icon.jpg
Diff not rendered.
Binary file added src/assets/images/order-summary-component.jpeg
Binary file removed src/assets/images/order-summary-component.jpg
Diff not rendered.
Binary file added src/assets/images/ping-coming-soon.jpeg
Binary file removed src/assets/images/ping-coming-soon.jpg
Diff not rendered.
Binary file removed src/assets/images/pricing-component-with-toggle.jpg
Diff not rendered.
Binary file added src/assets/images/profile-card-component.jpeg
Binary file removed src/assets/images/profile-card-component.jpg
Diff not rendered.
Diff not rendered.
Binary file removed src/assets/images/single-price-grid-component.jpg
Diff not rendered.
Binary file added src/assets/images/social-proof-section.jpeg
Binary file removed src/assets/images/social-proof-section.jpg
Diff not rendered.
Binary file removed src/assets/images/stats-preview-card-component.jpg
Diff not rendered.
Binary file removed src/assets/images/sunnyside-agency-landing-page.jpg
Diff not rendered.
Binary file added src/assets/images/testimonials-grid-section.jpeg
Binary file removed src/assets/images/testimonials-grid-section.jpg
Diff not rendered.

0 comments on commit 1463a8c

Please sign in to comment.