UI by Adrian Nasaruk

github-pages: https://buildweek-kidsfly-pg.github.io/UI/

Created a "Home" and "About" page.

HTML for the Home-Page: Head:

<title>KidsFly</title>

Head for the About page:

<title>About Us</title>

Part of the HTML body:

navigation and header:

KidsFly!

Home About Us

Sign Up Log In

We take care of you!

No more stress while traveling with kids! Sign up now!

CSS and Less for my Project:

my imports for Less:

@import "variables.less"; @import "mixins.less"; @import "reset.less"; @import "global.less"; @import "navigation.less"; @import "home-page.less"; @import "about.less";

Service section for my Home-page:

.services { display: flex; width: 100%; justify-content: space-between;

@media @phone{
    flex-direction: column;
}

.checkin{
    width: 30%;

    @media @phone{
        width: 100%;
    }
    img {
        width: 100%;
        height: 25vh;
        border-radius: 5px;

        @media @phone{
            height: 40vh;
        }
    }
}
.gate {
    width: 30%;
    @media @phone{
        width: 100%;
    }
    img{
       width: 100%;
       height: 25vh;
       border-radius: 5px;

       @media @phone{
           height: 40vh;
       }
    }
}
.luggage{
    width: 30%;
    @media @phone{
        width: 100%;
    }
    img{
       width: 100%;
       height: 25vh;
       border-radius: 5px;

       @media @phone{
        height: 40vh;
    }
    }
}

}

my mixins:

.aboutpeople () { display: flex; width: 40%; flex-direction: column; margin: 20px auto;

    @media @phone {
        width: 90%;
        margin-top: 1%;
    }

}

.picture(){ border-radius: 5px; height: 45vh; }

Welcome to GitHub Pages

You can use the editor on GitHub to maintain and preview the content for your website in Markdown files.

Whenever you commit to this repository, GitHub Pages will run Jekyll to rebuild the pages in your site, from the content in your Markdown files.

Markdown

Markdown is a lightweight and easy-to-use syntax for styling your writing. It includes conventions for

Syntax highlighted code block

# Header 1
## Header 2
### Header 3

- Bulleted
- List

1. Numbered
2. List

**Bold** and _Italic_ and `Code` text

[Link](url) and ![Image](src)

For more details see GitHub Flavored Markdown.

Jekyll Themes

Your Pages site will use the layout and styles from the Jekyll theme you have selected in your repository settings. The name of this theme is saved in the Jekyll _config.yml configuration file.

Support or Contact

Having trouble with Pages? Check out our documentation or contact support and we’ll help you sort it out.