initial commit

.gitignore

@@ -0,0 +1,42 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist
+/tmp
+/out-tsc
+
+# dependencies
+/node_modules
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+yarn-error.log
+testem.log
+/typings
+
+# System Files
+.DS_Store
+Thumbs.db
+
+# Bitbucket Pipelines
+bitbucket-pipelines.yml

README.md

@@ -0,0 +1,18 @@
+# README #
+
+## How do I get set up? ##
+
+#### Install all dependencies ####
+```npm install```
+
+#### compile the code ####
+```npm start```
+
+## Contribution guidelines ##
+
+* PR are always welcome
+* Don't push anything directly into master branch
+
+## Who do I talk to? ##
+
+* ismailfarooq

assets/js/script.js

@@ -0,0 +1,4 @@
+$(document).ready(function() {
+  // your code
+  var window = $(window);
+})

assets/sass/components/_footer.scss

@@ -0,0 +1,7 @@
+//===========================================
+// -Footer start
+//===========================================
+
+//===========================================
+// -Footer end
+//===========================================

assets/sass/components/_header.scss

@@ -0,0 +1,7 @@
+//===========================================
+// -Header start
+//===========================================
+
+//===========================================
+// -Header end
+//===========================================

assets/sass/components/_navbar.scss

@@ -0,0 +1,7 @@
+//===========================================
+// -Navbar start
+//===========================================
+
+//===========================================
+// -Navbar end
+//===========================================

assets/sass/helpers/_mixins.scss

@@ -0,0 +1,87 @@
+//===========================================
+// -Mixins start
+//===========================================
+
+// conver px to rem
+@function rem($pixels, $context: 16) {
+  @return ($pixels / $context) * 1rem;
+}
+
+// Media Query
+@mixin mq($breakpoint, $type: min) {
+  // Checking $breakpoint value in $grid-breakpoints object value
+  @if map_has_key($grid-breakpoints, $breakpoint) {
+    // getting $grid-breakpoints object value and asign width
+    $width: map_get($grid-breakpoints, $breakpoint);
+    // Decrease 1px from $grid-breakpoints value for max-width $type
+    @if $type == max {
+      $width: $width - 1px;
+    }
+    // Print Media query
+    @media (#{$type}-width: $width) {
+      @content;
+    }
+  }
+}
+
+@mixin mq-only($min-width, $max-width) {
+  @if map_has_key($grid-breakpoints, $min-width) and
+    map_has_key($grid-breakpoints, $max-width)
+  {
+    // define value to relevant$grid-breakpoints
+    $min-width: map_get($grid-breakpoints, $min-width);
+    $max-width: map_get($grid-breakpoints, $max-width) - 1px;
+
+    @media (min-width: $min-width) and (max-width: $max-width) {
+      @content;
+    }
+  } @else {
+    @error "Please Define correct media query breakpoint";
+  }
+}
+
+@mixin font-face($family, $path, $name, $weight: normal, $style: normal) {
+  @font-face {
+    font-family: "#{$family}";
+    src: url("#{$path}/#{$name}.ttf") format("truetype"),
+      url("#{$path}/#{$name}.woff") format("woff"),
+      url("#{$path}/#{$name}.svg##{$name}") format("svg");
+    font-weight: $weight;
+    font-style: $style;
+  }
+}
+
+@mixin center($horizontal: true, $vertical: true) {
+  position: absolute;
+  @if ($horizontal and $vertical) {
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  } @else if ($horizontal) {
+    left: 50%;
+    transform: translate(-50%, 0);
+  } @else if ($vertical) {
+    top: 50%;
+    transform: translate(0, -50%);
+  }
+}
+
+@mixin flex-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+@mixin square($size) {
+  width: $size;
+  height: $size;
+}
+
+@mixin circle($size) {
+  @include square($size);
+  border-radius: 50%;
+}
+
+//===========================================
+// -Mixins end
+//===========================================

assets/sass/helpers/_variables.scss

@@ -0,0 +1,30 @@
+//===========================================
+// -Variables start
+//===========================================
+
+// Colors start
+
+// define your vars or override bootstrap vars
+$default: red;
+$primary: green;
+$secondary: blue;
+$alternate: cyan;
+
+// Typography Family
+$font-default: "Roboto", sans-serif;
+$font-primery: "Montserrat", sans-serif;
+
+$font-path: "../fonts";
+
+// define your Break Points or override bootstrap Break Points
+$grid-breakpoints: (
+  xs: 0,
+  sm: 576px,
+  md: 768px,
+  lg: 992px,
+  xl: 1200px
+);
+
+// ===========================================
+// -Variables end
+// ===========================================

assets/sass/pages/_home.scss

@@ -0,0 +1,7 @@
+//===========================================
+// -Home Page start
+//===========================================
+
+//===========================================
+// -Home Page end
+//===========================================

assets/sass/partials/_buttons.scss

@@ -0,0 +1,14 @@
+//===========================================
+// -Buttons start
+//===========================================
+
+.btn {
+  cursor: pointer;
+  &[disabled],
+  &.disabled {
+    cursor: not-allowed;
+  }
+}
+//===========================================
+// -Buttons end
+//===========================================

assets/sass/partials/_classes.scss

@@ -0,0 +1,11 @@
+//===========================================
+// -Helper Classes start
+//===========================================
+
+.center {
+  margin: auto;
+}
+
+//===========================================
+// -Helper Classes end
+//===========================================

assets/sass/partials/_fonts.scss

@@ -0,0 +1,9 @@
+//===========================================
+// -Fonts start
+//===========================================
+
+@include font-face("family", $font-path, "Roboto-Regular", 400, "normal");
+
+//===========================================
+// -Fonts  end
+//===========================================

assets/sass/partials/_forms.scss

@@ -0,0 +1,7 @@
+//===========================================
+// -Forms Start
+//===========================================
+
+//===========================================
+// -Forms end
+//===========================================

assets/sass/partials/_global.scss

@@ -0,0 +1,61 @@
+//=======================================================
+// -Global style start
+//=======================================================
+
+// Default style start
+
+html,
+body {
+  font-family: $font-default;
+  min-height: 100vh;
+  scroll-behavior: smooth;
+  text-rendering: optimizeSpeed;
+  line-height: 1.5;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  // Media Query max width Usage
+  @include mq("md", max) {
+    font-size: 14px;
+  }
+  // Media Query min max width Usage
+  @include mq-only("md", "xl") {
+    font-size: 15px;
+  }
+  // Media Query min width Usage
+  @include mq("xl", min) {
+    font-size: 16px;
+  }
+}
+
+// Make images easier to work with
+img {
+  max-width: 100%;
+  display: block;
+}
+
+// Remove list styles on ul, ol elements with a class attribute
+ul[class],
+ol[class] {
+  padding-left: 0;
+  list-style: none;
+}
+
+%headings {
+  font-weight: 900;
+  text-transform: uppercase;
+  line-height: 1;
+  margin-top: 0;
+}
+
+@for $i from 1 through 6 {
+  h#{$i},
+  .h#{$i} {
+    @extend %headings;
+  }
+}
+
+//=======================================================
+// -Global style  end
+//=======================================================

assets/sass/style.scss

@@ -0,0 +1,61 @@
+//===========================================
+// -Helpers Start
+//===========================================
+
+@import "helpers/variables";
+@import "helpers/mixins";
+
+//===========================================
+// -Helpers End
+//===========================================
+
+//===========================================
+// -Vendors Start
+//===========================================
+
+// Add packages as per your requirement
+// package can be inlude via node_modules or manuallay from vendors folder
+
+@import "../../node_modules/bootstrap/scss/bootstrap";
+// or
+// @import "vendors/bootstrap";
+
+//===========================================
+// -Vendors End
+//===========================================
+
+//===========================================
+// -Partials Start
+//===========================================
+
+@import "partials/fonts";
+@import "partials/classes";
+@import "partials/buttons";
+@import "partials/forms";
+@import "partials/global";
+
+//===========================================
+// -Partials End
+//===========================================
+
+//===========================================
+// -components Start
+//===========================================
+
+@import "components/header";
+@import "components/footer";
+@import "components/navbar";
+
+//===========================================
+// -components End
+//===========================================
+
+//===========================================
+// -Pages Start
+//===========================================
+
+@import "pages/home";
+
+//===========================================
+// -Pages End
+//===========================================