This commit is contained in:
parent
782b0200e0
commit
6ecff473b3
325
package-lock.json
generated
325
package-lock.json
generated
@ -39,6 +39,7 @@
|
||||
"karma-coverage": "~2.2.0",
|
||||
"karma-jasmine": "~5.1.0",
|
||||
"karma-jasmine-html-reporter": "~2.0.0",
|
||||
"schematics-scss-migrate": "^1.3.15",
|
||||
"typescript": "~4.7.2"
|
||||
}
|
||||
},
|
||||
@ -11113,6 +11114,188 @@
|
||||
"integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/schematics-scss-migrate": {
|
||||
"version": "1.3.15",
|
||||
"resolved": "https://registry.npmjs.org/schematics-scss-migrate/-/schematics-scss-migrate-1.3.15.tgz",
|
||||
"integrity": "sha512-liOWef7NlVIoW8b3Ctvr1zcfHkISBKFI3X1dZaOQjDP0rDFgBCaPKqAl1X6Eiu0fgbWmNi5XzV9gU4F/2V7q5g==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@angular-devkit/core": "^12.0.1",
|
||||
"@angular-devkit/schematics": "^12.2.8",
|
||||
"@schematics/angular": "^12.2.8",
|
||||
"glob": "^7.1.6",
|
||||
"sass": "^1.29.0",
|
||||
"typescript": "^4.3.2"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/@angular-devkit/core": {
|
||||
"version": "12.2.18",
|
||||
"resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-12.2.18.tgz",
|
||||
"integrity": "sha512-GDLHGe9HEY5SRS+NrKr14C8aHsRCiBFkBFSSbeohgLgcgSXzZHFoU84nDWrl3KZNP8oqcUSv5lHu6dLcf2fnww==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"ajv": "8.6.2",
|
||||
"ajv-formats": "2.1.0",
|
||||
"fast-json-stable-stringify": "2.1.0",
|
||||
"magic-string": "0.25.7",
|
||||
"rxjs": "6.6.7",
|
||||
"source-map": "0.7.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^12.14.1 || >=14.0.0",
|
||||
"npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
|
||||
"yarn": ">= 1.13.0"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/@angular-devkit/schematics": {
|
||||
"version": "12.2.18",
|
||||
"resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-12.2.18.tgz",
|
||||
"integrity": "sha512-bZ9NS5PgoVfetRC6WeQBHCY5FqPZ9y2TKHUo12sOB2YSL3tgWgh1oXyP8PtX34gasqsLjNULxEQsAQYEsiX/qQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@angular-devkit/core": "12.2.18",
|
||||
"ora": "5.4.1",
|
||||
"rxjs": "6.6.7"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^12.14.1 || >=14.0.0",
|
||||
"npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
|
||||
"yarn": ">= 1.13.0"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/@schematics/angular": {
|
||||
"version": "12.2.18",
|
||||
"resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-12.2.18.tgz",
|
||||
"integrity": "sha512-niRS9Ly9y8uI0YmTSbo8KpdqCCiZ/ATMZWeS2id5M8JZvfXbngwiqJvojdSol0SWU+n1W4iA+lJBdt4gSKlD5w==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@angular-devkit/core": "12.2.18",
|
||||
"@angular-devkit/schematics": "12.2.18",
|
||||
"jsonc-parser": "3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^12.14.1 || >=14.0.0",
|
||||
"npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
|
||||
"yarn": ">= 1.13.0"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/ajv": {
|
||||
"version": "8.6.2",
|
||||
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.6.2.tgz",
|
||||
"integrity": "sha512-9807RlWAgT564wT+DjeyU5OFMPjmzxVobvDFmNAhY+5zD6A2ly3jDp6sgnfyDtlIQ+7H97oc/DGCzzfu9rjw9w==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"fast-deep-equal": "^3.1.1",
|
||||
"json-schema-traverse": "^1.0.0",
|
||||
"require-from-string": "^2.0.2",
|
||||
"uri-js": "^4.2.2"
|
||||
},
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/epoberezkin"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/ajv-formats": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.0.tgz",
|
||||
"integrity": "sha512-USH2jBb+C/hIpwD2iRjp0pe0k+MvzG0mlSn/FIdCgQhUb9ALPRjt2KIQdfZDS9r0ZIeUAg7gOu9KL0PFqGqr5Q==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"ajv": "^8.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"ajv": "^8.0.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"ajv": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/glob": {
|
||||
"version": "7.2.3",
|
||||
"resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
|
||||
"integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"fs.realpath": "^1.0.0",
|
||||
"inflight": "^1.0.4",
|
||||
"inherits": "2",
|
||||
"minimatch": "^3.1.1",
|
||||
"once": "^1.3.0",
|
||||
"path-is-absolute": "^1.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": "*"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/jsonc-parser": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.0.0.tgz",
|
||||
"integrity": "sha512-fQzRfAbIBnR0IQvftw9FJveWiHp72Fg20giDrHz6TdfB12UH/uue0D3hm57UB5KgAVuniLMCaS8P1IMj9NR7cA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/magic-string": {
|
||||
"version": "0.25.7",
|
||||
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz",
|
||||
"integrity": "sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"sourcemap-codec": "^1.4.4"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/minimatch": {
|
||||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
|
||||
"integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
},
|
||||
"engines": {
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/rxjs": {
|
||||
"version": "6.6.7",
|
||||
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.7.tgz",
|
||||
"integrity": "sha512-hTdwr+7yYNIT5n4AMYp85KA6yw2Va0FLa3Rguvbpa4W3I5xynaBZo41cM3XM+4Q6fRMj3sBYIR1VAmZMXYJvRQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"tslib": "^1.9.0"
|
||||
},
|
||||
"engines": {
|
||||
"npm": ">=2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/source-map": {
|
||||
"version": "0.7.3",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz",
|
||||
"integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">= 8"
|
||||
}
|
||||
},
|
||||
"node_modules/schematics-scss-migrate/node_modules/tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/select-hose": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
|
||||
@ -21015,6 +21198,148 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"schematics-scss-migrate": {
|
||||
"version": "1.3.15",
|
||||
"resolved": "https://registry.npmjs.org/schematics-scss-migrate/-/schematics-scss-migrate-1.3.15.tgz",
|
||||
"integrity": "sha512-liOWef7NlVIoW8b3Ctvr1zcfHkISBKFI3X1dZaOQjDP0rDFgBCaPKqAl1X6Eiu0fgbWmNi5XzV9gU4F/2V7q5g==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@angular-devkit/core": "^12.0.1",
|
||||
"@angular-devkit/schematics": "^12.2.8",
|
||||
"@schematics/angular": "^12.2.8",
|
||||
"glob": "^7.1.6",
|
||||
"sass": "^1.29.0",
|
||||
"typescript": "^4.3.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@angular-devkit/core": {
|
||||
"version": "12.2.18",
|
||||
"resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-12.2.18.tgz",
|
||||
"integrity": "sha512-GDLHGe9HEY5SRS+NrKr14C8aHsRCiBFkBFSSbeohgLgcgSXzZHFoU84nDWrl3KZNP8oqcUSv5lHu6dLcf2fnww==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ajv": "8.6.2",
|
||||
"ajv-formats": "2.1.0",
|
||||
"fast-json-stable-stringify": "2.1.0",
|
||||
"magic-string": "0.25.7",
|
||||
"rxjs": "6.6.7",
|
||||
"source-map": "0.7.3"
|
||||
}
|
||||
},
|
||||
"@angular-devkit/schematics": {
|
||||
"version": "12.2.18",
|
||||
"resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-12.2.18.tgz",
|
||||
"integrity": "sha512-bZ9NS5PgoVfetRC6WeQBHCY5FqPZ9y2TKHUo12sOB2YSL3tgWgh1oXyP8PtX34gasqsLjNULxEQsAQYEsiX/qQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@angular-devkit/core": "12.2.18",
|
||||
"ora": "5.4.1",
|
||||
"rxjs": "6.6.7"
|
||||
}
|
||||
},
|
||||
"@schematics/angular": {
|
||||
"version": "12.2.18",
|
||||
"resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-12.2.18.tgz",
|
||||
"integrity": "sha512-niRS9Ly9y8uI0YmTSbo8KpdqCCiZ/ATMZWeS2id5M8JZvfXbngwiqJvojdSol0SWU+n1W4iA+lJBdt4gSKlD5w==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@angular-devkit/core": "12.2.18",
|
||||
"@angular-devkit/schematics": "12.2.18",
|
||||
"jsonc-parser": "3.0.0"
|
||||
}
|
||||
},
|
||||
"ajv": {
|
||||
"version": "8.6.2",
|
||||
"resolved": "https://registry.npmjs.org/ajv/-/ajv-8.6.2.tgz",
|
||||
"integrity": "sha512-9807RlWAgT564wT+DjeyU5OFMPjmzxVobvDFmNAhY+5zD6A2ly3jDp6sgnfyDtlIQ+7H97oc/DGCzzfu9rjw9w==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fast-deep-equal": "^3.1.1",
|
||||
"json-schema-traverse": "^1.0.0",
|
||||
"require-from-string": "^2.0.2",
|
||||
"uri-js": "^4.2.2"
|
||||
}
|
||||
},
|
||||
"ajv-formats": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-2.1.0.tgz",
|
||||
"integrity": "sha512-USH2jBb+C/hIpwD2iRjp0pe0k+MvzG0mlSn/FIdCgQhUb9ALPRjt2KIQdfZDS9r0ZIeUAg7gOu9KL0PFqGqr5Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ajv": "^8.0.0"
|
||||
}
|
||||
},
|
||||
"brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"balanced-match": "^1.0.0",
|
||||
"concat-map": "0.0.1"
|
||||
}
|
||||
},
|
||||
"glob": {
|
||||
"version": "7.2.3",
|
||||
"resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
|
||||
"integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fs.realpath": "^1.0.0",
|
||||
"inflight": "^1.0.4",
|
||||
"inherits": "2",
|
||||
"minimatch": "^3.1.1",
|
||||
"once": "^1.3.0",
|
||||
"path-is-absolute": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"jsonc-parser": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.0.0.tgz",
|
||||
"integrity": "sha512-fQzRfAbIBnR0IQvftw9FJveWiHp72Fg20giDrHz6TdfB12UH/uue0D3hm57UB5KgAVuniLMCaS8P1IMj9NR7cA==",
|
||||
"dev": true
|
||||
},
|
||||
"magic-string": {
|
||||
"version": "0.25.7",
|
||||
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.7.tgz",
|
||||
"integrity": "sha512-4CrMT5DOHTDk4HYDlzmwu4FVCcIYI8gauveasrdCu2IKIFOJ3f0v/8MDGJCDL9oD2ppz/Av1b0Nj345H9M+XIA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"sourcemap-codec": "^1.4.4"
|
||||
}
|
||||
},
|
||||
"minimatch": {
|
||||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
|
||||
"integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"brace-expansion": "^1.1.7"
|
||||
}
|
||||
},
|
||||
"rxjs": {
|
||||
"version": "6.6.7",
|
||||
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-6.6.7.tgz",
|
||||
"integrity": "sha512-hTdwr+7yYNIT5n4AMYp85KA6yw2Va0FLa3Rguvbpa4W3I5xynaBZo41cM3XM+4Q6fRMj3sBYIR1VAmZMXYJvRQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"tslib": "^1.9.0"
|
||||
}
|
||||
},
|
||||
"source-map": {
|
||||
"version": "0.7.3",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz",
|
||||
"integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==",
|
||||
"dev": true
|
||||
},
|
||||
"tslib": {
|
||||
"version": "1.14.1",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
|
||||
"integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"select-hose": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
|
||||
|
||||
@ -41,6 +41,7 @@
|
||||
"karma-coverage": "~2.2.0",
|
||||
"karma-jasmine": "~5.1.0",
|
||||
"karma-jasmine-html-reporter": "~2.0.0",
|
||||
"schematics-scss-migrate": "^1.3.15",
|
||||
"typescript": "~4.7.2"
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<div>
|
||||
<app-snow></app-snow>
|
||||
<h1>Welcome, traveler.</h1>
|
||||
<mat-drawer-container class="main-container" [autosize]="true" [hasBackdrop]="false">
|
||||
<mat-drawer #drawer class="sidenav" mode="side" [mode]="'push'" [opened]="true" >
|
||||
|
||||
@ -19,6 +19,7 @@ import { MatSidenavModule } from "@angular/material/sidenav";
|
||||
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
|
||||
import { NavBarComponent } from './pages/nav-bar/nav-bar.component';
|
||||
import { SendFormComponent } from './pages/send-form/send-form.component';
|
||||
import { SnowComponent } from './pages/snow/snow.component';
|
||||
|
||||
|
||||
|
||||
@ -33,7 +34,8 @@ import { SendFormComponent } from './pages/send-form/send-form.component';
|
||||
ThreadsComponent,
|
||||
OPComponent,
|
||||
NavBarComponent,
|
||||
SendFormComponent
|
||||
SendFormComponent,
|
||||
SnowComponent
|
||||
|
||||
],
|
||||
imports: [
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<h2>Вы находитесь на доске {{boardName}} </h2>
|
||||
<div>
|
||||
<app-send-form [board]="boardName" (sendInfoToCreate)="alert($event)">
|
||||
<app-send-form [board]="boardName" (sendInfoToCreate)="createThread($event)">
|
||||
</app-send-form>
|
||||
</div>
|
||||
<a (click)="showGuide = !showGuide" style=" font-size: small; color: chocolate; width: 500px;"> Что это и как это работает?</a>
|
||||
|
||||
@ -27,10 +27,8 @@ export class ThreadsComponent implements OnInit {
|
||||
})
|
||||
}
|
||||
|
||||
alert(tosend: any){
|
||||
console.log("Получен эмит создания треда " + tosend.text);
|
||||
console.log("С картинками: " + tosend.images)
|
||||
showAlert("Cкоро можно будет создавать треды" , "#ff0a36");
|
||||
createThread(tosend: any){
|
||||
this.apiChatService.sendThreadToApi(tosend.text, tosend.images, this.boardName)
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
|
||||
30
src/app/pages/snow/snow.component.html
Normal file
30
src/app/pages/snow/snow.component.html
Normal file
@ -0,0 +1,30 @@
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
<div class="snow">❅</div>
|
||||
48
src/app/pages/snow/snow.component.scss
Normal file
48
src/app/pages/snow/snow.component.scss
Normal file
@ -0,0 +1,48 @@
|
||||
@function random_range($min, $max) {
|
||||
$rand: random();
|
||||
$random_range: $min + floor($rand * (($max - $min) + 1));
|
||||
@return $random_range;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.snow {
|
||||
$total: 30;
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
font-size: 50px;
|
||||
border-radius: 50%;
|
||||
pointer-events: none;
|
||||
color: #f8f8f8;
|
||||
z-index: 999999;
|
||||
text-shadow: 1px 1px 1px #000000;
|
||||
|
||||
@for $i from 1 through $total {
|
||||
$random-x: random(1000000) * 0.0001vw;
|
||||
$random-offset: random_range(-100000, 100000) * 0.0001vw;
|
||||
$random-x-end: $random-x + $random-offset;
|
||||
$random-x-end-yoyo: $random-x + ($random-offset / 2);
|
||||
$random-yoyo-time: random_range(30000, 80000) / 100000;
|
||||
$random-yoyo-y: $random-yoyo-time * 100vh;
|
||||
$random-scale: random(10000) * 0.0001;
|
||||
$fall-duration: random_range(10, 30) * 1s;
|
||||
$fall-delay: random(30) * -1s;
|
||||
|
||||
&:nth-child(#{$i}) {
|
||||
opacity: random_range(2000, 8000) * 0.0001;
|
||||
transform: translate($random-x, -10px) scale($random-scale);
|
||||
animation: fall-#{$i} $fall-duration $fall-delay linear infinite;
|
||||
}
|
||||
|
||||
@keyframes fall-#{$i} {
|
||||
#{percentage($random-yoyo-time)} {
|
||||
transform: translate($random-x-end, $random-yoyo-y) scale($random-scale);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: translate($random-x-end-yoyo, 100vh) scale($random-scale);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
23
src/app/pages/snow/snow.component.spec.ts
Normal file
23
src/app/pages/snow/snow.component.spec.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { SnowComponent } from './snow.component';
|
||||
|
||||
describe('SnowComponent', () => {
|
||||
let component: SnowComponent;
|
||||
let fixture: ComponentFixture<SnowComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ SnowComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(SnowComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
15
src/app/pages/snow/snow.component.ts
Normal file
15
src/app/pages/snow/snow.component.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-snow',
|
||||
templateUrl: './snow.component.html',
|
||||
styleUrls: ['./snow.component.scss']
|
||||
})
|
||||
export class SnowComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
||||
@ -44,8 +44,8 @@ export class ApiChatService {
|
||||
}
|
||||
|
||||
|
||||
createThread(OPtext: string, OPimgUrl: string[], board: string,){
|
||||
return alert("Скоро будет работать!");
|
||||
sendThreadToApi(OPtext: string, OPimgUrl: string[], board: string,){
|
||||
return alert("Попытка создания тред с оп-постом " + OPtext + " на доске " + board);
|
||||
}
|
||||
|
||||
sampleBoardList = [
|
||||
|
||||
@ -39,4 +39,5 @@
|
||||
}
|
||||
body {
|
||||
background-color: #eee;
|
||||
overflow: hidden;
|
||||
}
|
||||
Reference in New Issue
Block a user