diff --git a/gulpfile.js b/gulpfile.js index a74af0d..dcc353a 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -71,7 +71,7 @@ var uglify = require('gulp-terser'); var optimizejs = require('gulp-optimize-js'); // Styles -var sass = require('gulp-sass'); +var sass = require('gulp-sass')(require('node-sass')); var postcss = require('gulp-postcss'); var prefix = require('autoprefixer'); var minify = require('cssnano'); @@ -251,4 +251,4 @@ exports.watch = series( exports.default, startServer, watchSource -); \ No newline at end of file +); diff --git a/package.json b/package.json index 5c66949..09d9226 100644 --- a/package.json +++ b/package.json @@ -15,8 +15,8 @@ "browser-sync": "^2.27.6" }, "devDependencies": { - "autoprefixer": "10.3.7", - "cssnano": "5.0.8", + "autoprefixer": "10.4.0", + "cssnano": "5.0.9", "del": "6.0.0", "gulp": "4.0.2", "gulp-concat": "2.6.1", @@ -25,15 +25,15 @@ "gulp-optimize-js": "1.1.0", "gulp-postcss": "9.0.1", "gulp-rename": "2.0.0", - "gulp-sass": "4.1.1", + "gulp-sass": "5.0.0", "gulp-terser": "2.1.0", "lazypipe": "1.0.2", + "node-sass": "^6.0.1", "node-sass-tilde-importer": "^1.0.2", - "postcss": "^8.3.11" + "postcss": "^8.3.11", + "sass": "^1.43.4" }, "dependencies": { - "@fortawesome/fontawesome-free": "^5.15.4", - "bootstrap": "^4.6.0", - "jquery": "^3.6.0" + "bootstrap": "^5.1.3" } } diff --git a/src/index.html b/src/index.html index 673c10f..08900cc 100644 --- a/src/index.html +++ b/src/index.html @@ -39,7 +39,7 @@
-
+

Samuel Philipp

@@ -202,7 +202,7 @@
-

My Services

+

My Projects

@@ -217,7 +217,6 @@
-
@@ -228,7 +227,6 @@

Facilis ipsum reprehenderit nemo molestias. Aut cum mollitia reprehenderit.

-
@@ -242,47 +240,6 @@
- - -
-
- -
- - - -
-

Web Developent

-

Facilis ipsum reprehenderit nemo molestias. Aut cum mollitia reprehenderit.

-
-
- -
- -
-
- - - -
-

Web Marketing

-

Facilis ipsum reprehenderit nemo molestias. Aut cum mollitia reprehenderit.

-
-
- -
-
-
- - - -
-

Support

-

Facilis ipsum reprehenderit nemo molestias. Aut cum mollitia reprehenderit.

-
-
-
-
@@ -411,67 +368,60 @@
-

Docker95%

+
Docker95%
-

Git90%

+
Git90%
-
+
-

Intellij IDEA80%

+
Intellij IDEA80%
-
+
-

Node.js85%

+
Node.js85%
-
+
-

Spring Framework100%

+
Spring Framework100%
-
+
-

Angular70%

+
Angular70%
-
+
-

CI/CD85%

+
CI/CD85%
-
+
-

tba75%

+
tba75%
-
+
@@ -519,68 +469,38 @@
-
- -
-

Project Name

- Website -
- -
-
- -
-

Project Name

- Illustration -
- -
-
- -
-

Project Name

- Brading -
- -
-
- -
-

Project Name

- Illustration -
- -
-
+
-

Contact

+

Contact

-
+
-
+
-
+
-
-
- +
+
+ +
@@ -591,18 +511,18 @@
-
Made with in Germany
-
Samuel Philipp
+
Made with in Germany
+
Samuel Philipp
-
Imprint +
Imprint
-
Privacy +
Privacy
-
Code
+
Code
+ class="i-chart-line me-2">Stats
diff --git a/src/scss/main.scss b/src/scss/main.scss index db986fe..8c09922 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -1,162 +1,10 @@ -@import "~bootstrap/scss/bootstrap-grid"; -@import "~bootstrap/scss/bootstrap-reboot"; -@import "~bootstrap/scss/utilities/align"; -@import "~bootstrap/scss/utilities/spacing"; -@import "~bootstrap/scss/utilities/display"; -@import "~bootstrap/scss/utilities/text"; -@import "~bootstrap/scss/utilities/float"; -@import "~bootstrap/scss/forms"; -@import "~bootstrap/scss/buttons"; -@import "~@fortawesome/fontawesome-free/scss/fontawesome"; -@import "~@fortawesome/fontawesome-free/scss/solid"; -@import "~@fortawesome/fontawesome-free/scss/brands"; -@import "~@fortawesome/fontawesome-free/scss/regular"; +$primary: #fea500; -@font-face { - font-family: 'Minotaur'; - src: local('Minotaur Phatte'), url(../font/minotaur.ttf) format('truetype'); -} - -body { - color: #fff; - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); - padding: 0; - margin: 0; -} - -.site-container { - width: 100%; - height: 100vh; - display: flex; - flex-direction: column; - overflow: hidden; - - .content { - position: relative; - flex: 1 1 auto; - } - - .footer { - background-image: url("../img/bg.png"); - color: #ffffff; - z-index: 1; - } -} - -.image { - display: block; - background-repeat: no-repeat; - background-position: center center; - background-size: cover; - position: absolute; - top: -25px; - left: -25px; - width: calc(100% + 50px); - height: calc(100% + 50px); - z-index: 0; -} - -.follow { - position: absolute; - top: 0; - right: 0; - padding: 1rem; - z-index: 1; -} - -#developer { - background-image: url('../img/sp-codes.png'); -} - -#magician { - background-image: url('../img/sp-magic_overlay.png'); -} - -.headers { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - display: flex; - flex-direction: column; - align-items: stretch; - text-align: center; -} - -.headers .magician { - color: #000000; - font-family: "Minotaur", cursive; - font-weight: normal; - font-size: 5rem; - text-shadow: 0 0 1rem #ffffff; -} - -.headers .developer { - color: #ffffff; - font-family: "Minotaur", monospace; - font-weight: bold; - font-size: 5rem; - text-shadow: 0 0 1rem #000000; -} - -@include media-breakpoint-down(md) { - .headers .magician, - .headers .developer { - font-size: 4rem; - } -} - -@include media-breakpoint-down(sm) { - .headers .magician, - .headers .developer { - font-size: 3rem; - } -} - -.headers a { - text-decoration: none; -} - -.headers .codes { - flex-grow: 1; - display: flex; - align-items: center; - justify-content: center; -} - -.headers .magic { - flex-grow: 0.6; - display: flex; - align-items: center; - justify-content: center; -} - -.headers .padding { - flex-grow: 1.3; -} - -.menu { - border-top: 1px solid #ffffff; - - a { - color: #ffffff; - } -} - -.full-size { - width: 100%; - height: 100%; -} - -// ------------------------------ NEW ------------------------------ +@import "~bootstrap/scss/bootstrap"; $icomoon-font-path: "../font"; @import "icons/style"; - -$primary: #fea500; - body { color: #000; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);