Apply correct size for brainly tutor small logo (#2062)

* Apply correct size to brainly tutoror small logo

* Remove deprecated mixin from logo scss

* Update node version in supporting files

* Add new sass rule to handle reposnsive mixin

.node-version

@@ -1 +1 @@
-v8
+v14

.nvmrc

@@ -1 +1 @@
-v8
+v14

.sass-lint.yml

@@ -0,0 +1,7 @@
+options:
+  config-file: 'node_modules/sass-lint-config-brainly/.sass-lint.yml'
+rules:
+  # Enforce that mixins should be written before declarations in a ruleset.
+  mixins-before-declarations:
+    - 2
+    - exclude: ['sgBreakpoint', 'sgResponsive']

Dockerfile

@@ -1,4 +1,4 @@
-FROM mhart/alpine-node:8.1
+FROM mhart/alpine-node:14
 
 WORKDIR /style-guide
 

package.json

@@ -116,7 +116,7 @@
   },
   "scripts": {
     "js-lint": "yarn run eslint --ext .js --ext .jsx src/",
-    "scss-lint": "sass-lint -c node_modules/sass-lint-config-brainly/.sass-lint.yml -v -q 'src/**/*.scss'",
+    "scss-lint": "sass-lint -c .sass-lint.yml -v -q 'src/**/*.scss'",
     "scss-unused-variables": "./scripts/find_scss_unused_variables.sh src/",
     "js-typecheck": "flow && node ./scripts/build-types.js",
     "build": "gulp build",

src/components/logo/_logo.scss

@@ -11,7 +11,7 @@ $includeHtml: false !default;
     height: $logoDefaultHeight;
     width: $logoDefaultWidth;
 
-    @include sgBreakpoint(medium-up) {
+    @include sgResponsive(md) {
       height: $logoLargeHeight;
       width: $logoLargeWidth;
     }
@@ -21,7 +21,7 @@ $includeHtml: false !default;
       width: $logoDefaultWidth;
       height: 68px;
 
-      @include sgBreakpoint(medium-up) {
+      @include sgResponsive(md) {
         width: $logoLargeWidth;
         height: 92px;
       }
@@ -35,32 +35,42 @@ $includeHtml: false !default;
       width: $logoDefaultWidth;
       height: 90px;
 
-      @include sgBreakpoint(medium-up) {
+      @include sgResponsive(md) {
         width: $logoLargeWidth;
         height: 120px;
       }
     }
 
+    &--brainly-tutoring-small {
+      width: $logoDefaultWidth;
+      height: 72px;
+
+      @include sgResponsive(md) {
+        width: $logoLargeWidth;
+        height: 96px;
+      }
+    }
+
     &--eodev {
       width: 114px;
 
-      @include sgBreakpoint(medium-up) {
+      @include sgResponsive(md) {
         width: 154px;
       }
     }
 
     &--nosdevoirs {
       width: 161px;
 
-      @include sgBreakpoint(medium-up) {
+      @include sgResponsive(md) {
         width: 217px;
       }
     }
 
     &--znanija {
       width: 131px;
 
-      @include sgBreakpoint(medium-up) {
+      @include sgResponsive(md) {
         width: 176px;
       }
     }