GithubHelp home page GithubHelp logo

isabella232 / vsf-default Goto Github PK

View Code? Open in Web Editor NEW

This project forked from vuestorefront/vsf-default

0.0 0.0 0.0 2.63 MB

Vue Storefront Default theme. Always Open Source, MIT license. Made with :green_heart: by Vue Storefront. (please consider vsf-capybara instead)

Home Page: http://demo.storefrontcloud.io/

License: MIT License

Vue 92.55% JavaScript 1.40% TypeScript 2.24% HTML 0.33% SCSS 3.47%

vsf-default's Introduction

vsf-default

Vue Storefront Default theme (please consider vsf-capybara instead)

πŸŽ‰ Current status: Production ready

The design

This theme is basic template of typical eCommerce for a fashion industry. In the project we used Material Icons.

Vue Storefront - Annimations in sidebar menu

Vue Storefront - Annimations in featured products box

Here you can read more about the process of designing PWA for eCommerce.

The design is available in open source in the Figma file format under the URL https://www.figma.com/file/VKyqbHFI55TKIKcQlFLiVpVF/Vue-Storefront-Open-Source.

Browser Compatibility

  • last 2 Chrome versions
  • last 2 Firefox versions
  • last 2 Edge versions
  • modern browsers

πŸ”Œ Installation

To be able to use new Default theme in your Vue Storefront installation, you need to:

  1. Install lerna globally:

    npm install -g lerna
    

    or

    yarn global add lerna
    
  2. Configure vsf-default repository as a git submodule in theme path of your Vue Storefront workspace, and then track master branch:

    git submodule add -b master [email protected]:DivanteLtd/vsf-default.git src/themes/default
    
  3. Fetch all the data:

    git submodule update --init --remote
    
  4. Update Vue Storefront configuration by copying local.json file from vsf-default to root config directory.

  5. Update TypeScript compiler option in tsconfig.json in root directory: change value for compilerOptions.paths.theme/* from default theme ["src/themes/default/*"] to brand new Default theme: ["src/themes/default/*"].

  6. Download all dependencies and start development server:

    lerna bootstrap && yarn dev
    
  7. That’s all! Now after opening your development server (http://localhost:3000 by default) you should see Vue Storefront with Default theme! πŸŽ‰

Troubleshooting

After git submodule add -b master [email protected]:DivanteLtd/vsf-default.git src/themes/default you see message: 'src/themes/default' already exists in the index

That is shown because directory already exist or if you removed it then you need to remove it from git index git rm -r --cached src/themes/default

The screenshots

Vue Storefront - Annimations in the sidebar cart

Vue Storefront - Annimations on producy card

vsf-default's People

Contributors

lsliwaradioluz avatar pkarw avatar thermscissorpunch avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.