valor-labs / vs-website

valor-software.com

valor-software.com

Staging Production

Development

Read this first

• Style Guide
• Git Commit Guidelines

Clone the project to your local machine

git clone [email protected]:VS-work/vs-website.git

Install dependencies

npm i or using yarn yarn install

Start development server

npm run serve

Site will be available on 4200 port http://localhost:4200

Make your changes, make sure tests pass

npm t

Create PR, assign developers who can make code review. (ask your mentor, team/tech lead..);

Storage notes

All content is stored in json format. To change any data like Projects, Team, Vacancies, Feedback and Text on site just edit ts files in src/services/collections/ dir.

Team:

To hide team member on the /team page, set show: false in team.ts.

Leave member on the project page, but make him unclickable, remove url param.

Vacancies:

To hide vacancy on the /careers page, set show: false in vacancies.ts.

Publishing

Autodeploy is now configured only for staging server using GitHub Deploy keys and Travis CI.

Check links below for details or setting up new keys:

• Add GitHub Deploy key,
• Travis CI config

Public key is stored in repo deploy_key.enc and private as env var on the Travis CI

Check deploy.sh for more details.

Manual Deploy

Because of using GitHub Pages to host site all you need is have write access to https://github.com/VS-work/vs-work.github.io repo for staging and to https://github.com/valor-software/valor-software.github.io for production.

Sequncing:

1. Make sure all your changes tested well, code was reviewed, tests and TSLint pass.
2. Now you can run npm run manual.deploy:stage
3. Test app on https://vs-work.github.io/#/
4. Run npm run manual.deploy:prod to publish on production.
5. Test on https://valor-software.com/#/

vs-website's Issues

Desktop.Home page.Menu component: Implementation of layout according with design

In this section needs to have:

• At this page will be custom grid Bootstrap(width - 1400 pixel)
• Contact button. Redirect to Contact page
• Humburger menu will be look like on this example with footer: http://purplerockscissors.com/
• Arrow in the bottom of page has to clickable and allow to scroll down
• Starry sky. Needs to have dynamic background. Here is source code for implementation :
  http://codepen.io/VincentGarreau/pen/pnlso
  Here is zip file for background
  background.zip

This component is reusable for all pages of web-site.

Desktop.About page: Section 1,2,3

Needs to implement layout according with design:

• Menu component
• Page header component
• Simple content component
  
  

Desktop.Home page: Add blue gradient according with design

Desktop. How we do it. Description font is not so exuding

WTR:

1. Open Services page
2. Pay attention at description font

Result: Description font is not so exuding
Expected result: Need to make font more exuding

Desktop.Team page: Implementation of `Simple content component`

Implement component according with design mock-up

Desktop.Header components

Needs to implement:

• reusable menu component
• Text(white)
• Background image
• plain text(in black square block)

Desktop. Navigate to the top of the page after redirecting

WTR:

1. Open page https://vs-work.github.io/#/
2. Navigate to the bottom of the page
3. Go to any another page(for example About page)
4. Pay attention where page is opened

Result: About page, opened on the bottom
Expected result: All pages should opens from the top. Except only if user click on links, that follows to specific page part

General. Contact forms. Button "Send inquiry" doesn't work

WTR:

1. Go ti Contact page
2. Fill all fields, click on button "Send inquiry"

Result: Nothing happens - Button "Send inquiry" doesn't work
Expected result: Inquiry sended

Desktop.Home page.`What we do for...` section: Implement static text and button `See how we do...`

On this section just need to implement a static text and button according with design.

• Button has to redirect to Approach page
  
• Fixed menu has to be on top during the scroll for all pages
  

Here is icons:
Icons-home-page.zip

Desktop.Comments component:Implementation of slider, title and description

This component has to be implemented on next pages:

• Home
• Services
• Clients

We need to implement :

• Title, description
• Slider for this section
• Pagination

Desktop.Footer component: Implementation of component according with design mock-up

This component is reusable for all pages of web-site.

• Let's talk button redirect to Contact form

Desktop. Burger menu. Button Close can disappear in certain terms

WTR:

1. Open https://vs-work.github.io/#/
2. Open burger menu
3. Use right scroll bar for navigating
4. Pay attention at close button

Result: Button Close can disappear
Expected result: Button Close can't disappear

Desktop.Services page.Footer section: Implementation of component according with design mock-up

Let's talk button redirect to Contact form

Footer. Insert link to Behance

WTR:

1. Open https://vs-work.github.io/#/
2. Go to the footer of the page
3. Click on Be icon

Result: Opens https://vs-work.github.io/#/
Expected result: Opens https://www.behance.net/ValorSoftware

Desktop.Fixed menu: Mismatch with design

Needs to remove underlining after you hover on menu items

Pay attention on screenshot

Desktop.Services page: Menu and header components

Needs to implement layout according with design mock-up:

• Menu component
• Page header component
  

Desktop. Need to collapse burger menu when user comeback to home page

WTR:

1. Open https://vs-work.github.io/#/
2. Open burger menu
3. Click on any page
4. Press Back button

Result: User returns to home page, and burger menu still opened
Expected result: When user returns to home page - burger menu should collapse

Desktop.Team member page: Implementation of `Project list component`

Here we can see projects in which team member took part

Desktop.Home page.Projects component: Need to implement according with design mock-up

Needs to add:

• Title, description, view case(link to Case study page)
• Button "More projects"

Desktop.Approach page: Our results section

Needs to implement:

• Slider with items: {Title, result description, image, link, ...}
  View case study redirect to internal project

Desktop.About page: Implementation of Footer section according with design mock-up

Needs to implement footer component according with design.

• Button Let's talk redirect to Contact page
  

Desktop.Home page: Particles js. stop working on route changing

This issue connected with #1

Desktop. Particles are not responsive at mouse cursor in some fileds

WTR:

1. Open https://vs-work.github.io/#/
2. Navigate mouse cursor to fields, marked on screenshot
3. Pay attention at particles

Result: Particles are not responsive at mouse cursor
Expected result: Particles are responsive at mouse cursor

Desktop: Single-Content component

This component is reusable on next pages:

• Home page
• About page
• Approach page

Desktop.Team member: Implementation of `Team member component`

Needs to implement component according with design-mock-up

Desktop.Home page.`Thanks for partners` component: Implementation layout according with design mock-up

We need to implement - Title, description, columns with valid HTML, pale-grey background

Desktop.Approach page: Implementation of Footer section according with design mock-up

Needs to implement footer component according with design.

• Button Let's talk redirect to Contact page
  

Desktop. Particles are disappears after using back button

WTR:

1. Open https://vs-work.github.io/#/
2. Click on button Contact at the right top part of the screen
3. Click on button Let's Talk
4. Press back button 2 times
5. Pay attention at particles on main screen

Result: Particles on main screen is disappear
Expected result: Particles on main screen is not disappear

Desktop. Contact form. Section "Add document" doesn't work

WTR:

1. Go to Contact page
2. Try to add some document, using form "Add document"

Result: Section "Add document" doesn't work
Expected result: Section "Add document" works correctly, user can add documents

Desktop.Internal project page (Case study) Implementation `Case study component`

Needs to implement next reusable components:

• menu
• title, description
• background
• online link
• link on behance

Desktop.Services page.Comments component:Implementation of slider, title and description

We need to implement layout according with design mock-up :

• Title, description
• Slider for this section
• Pagination

Desktop.Illustrated content component

Needs to implement layout according with design mock-up:

• Illustrated content components for 4 sections
  
  

Desktop.About page: Section `Vacancies List`

Needs to implement:

• Title, description(with link)
• Grid with: {Vacancy name, link}

• View position link route to Vacancy page
  

Desktop: Generate menu items from routes

Desktop. Careers page. Phone number filed. Make type= "number"

WTR:

1. Open Careers page
2. Inspect field "Your phone"
3. Pay attention at attribute "type"

Result: Attribute type is text
Expected result: Attribute type is number

Desktop. Need improve animation for Contact button

WTR:

1. Open https://vs-work.github.io/#/
2. Navigate cursor to Contact button
3. Pay attention at button animation

Result: Button animation is not pretty good
Expected result: Need improve animation for Contact button

General: set up autodeployment

Desktop.duplex-content component

Needs to implement Illustrated content component:

• Image
• Background
• Formatted html

Desktop.Twitter component: Implementation component according with design mock up

For now, this component will reusable for next pages:

• home

Twitter widget https://gapminder-org-dev.firebaseapp.com/ which already implemented.

Desktop. Contact form. Form "Add document" is different for 3 pages

WTR:

1. Go to Contact page
2. Go to Careers page
3. Go to Case study page
4. Pa attention at field "Add document"

Result: Form "Add document" is different for 3 pages
Expected result: Form "Add document" should be same for all pages

Desktop.Clients.Case study page.Similar projects block: Remove current project from similar list

This issue connected with #3

If we choose Case study in similar project doesn't need display chosen project.

Desktop.Team page: Implementation of `Team list component`

Desktop.Contact page: Implementation of `Let's talk` component

Desktop.Services page: `How we do it` section

Needs to implement Simple content component according with design mock-up

Desktop. Implementation of forms.

We have three places where need to implement forms:

• On Contact page.
  
• Vacancy page
  
• Case study page.
  

Desktop. Contact form. User font the same as placeholder font

WTR:

1. Go to Contact page
2. Fill any field
3. Compare font in placeholder with text in filled form

Result: Font the same
Expected result: User font should be more exuding then placeholder font

Desktop.Careers page: Implementation of Vacancy description page

Desktop. Careers page & Contact page: Implementation of component "Learn more about ... "

Link culture redirect to About page

Desktop. Contact form. No icon in field "Add document"

WTR:

1. Go to Contact page
2. Pay attention at field "Add document"

Result: No icon in field "Add document"
Expected result: Icon in field "Add document" displayed correctly

Desktop. Case study page. Contact form is not centered

WTR:

1. Go to case study page(Clients=>View case)
2. Pay attention at contact form

Result: Contact from is not centered
Expected result: Contact form is centered