Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
add scss variables
  • Loading branch information
Alex committed Aug 7, 2018
1 parent e479007 commit b953dea
Show file tree
Hide file tree
Showing 9 changed files with 7,037 additions and 1 deletion.
Binary file added .DS_Store
Binary file not shown.
Binary file added assets/.DS_Store
Binary file not shown.
Binary file added assets/scss/.DS_Store
Binary file not shown.
21 changes: 21 additions & 0 deletions assets/scss/variables/colors.scss
@@ -0,0 +1,21 @@
// COLORS
$color_primary: #42b883;
$color_secondary: #3C8171;
$color_reverse: #35495e;

$color_nuxt_black: #2c3e50;
$color_nuxt_grey: #7F8C90;
$color_nuxt_silver: #DAE1E9;
$color_nuxt_white: #F5F7FA;

$color_black: #1F2D3D;
$color_light_black: #324057;
$color_extra_light_black:#475669;
$color_silver:#8492A6;
$color_light_silver:#99A9BF;
$color_extra_light_silver:#C0CCDA;
$color_gray:#D3DCE6;
$color_light_gray:#E5E9F2;
$color_extra_light_gray:#EFF2F7;
$color_dark_white:#F9FAFC;
$color_white:#FFFFFF;
4 changes: 4 additions & 0 deletions assets/scss/variables/sizes.scss
@@ -0,0 +1,4 @@
$xs: 576px;
$sm: 768px;
$md: 992px;
$lg: 1200px;
2 changes: 1 addition & 1 deletion components/Header.vue
@@ -1,7 +1,7 @@
<template>
<header class="Header">
<nuxt-link class="Header__Logo" to="/">
<img src="~static/logo_nav.png" alt="Nuxt" />
<img src="~static/logo_nav.png" alt="Nuxt"/>
<h1 class="Header__Logo__Text">NUXT</h1>
</nuxt-link>
<div class="Header__Toggler">
Expand Down
19 changes: 19 additions & 0 deletions components/lib/Container.vue
@@ -0,0 +1,19 @@
<style lang="scss">
.Container {
width: 100%;
padding: 0 15px;
margin: 0 auto;
@media (min-width: 576px) {
max-width: 540px;
}
@media (min-width: 768px) {
max-width: 720px;
}
@media (min-width: 992px) {
max-width: 960px;
}
@media (min-width: 1200px) {
max-width: 1140px;
}
}
</style>
16 changes: 16 additions & 0 deletions components/lib/Nav.vue
@@ -0,0 +1,16 @@
<template>
<nav class="Nav">
<slot/>
</nav>
</template>

<style lang="scss">
$nav-height-lg: 72px;
$nav-height-sm: 64px;
$nav-height-xs: 56px;
.Nav {
height: $nav-height-xs;
color: $color-white;
}
</style>

0 comments on commit b953dea

Please sign in to comment.