- scss styling

This commit is contained in:
Arno Kaimbacher 2021-12-21 11:36:32 +01:00
parent 11c8f3531a
commit fafa254851
6 changed files with 146 additions and 87 deletions

130
package-lock.json generated
View File

@ -2014,9 +2014,9 @@
"dev": true
},
"node_modules/@types/node": {
"version": "17.0.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.0.tgz",
"integrity": "sha512-eMhwJXc931Ihh4tkU+Y7GiLzT/y/DBNpNtr4yU9O2w3SYBsr9NaOPhQlLKRmoWtI54uNwuo0IOUFQjVOTZYRvw==",
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.2.tgz",
"integrity": "sha512-JepeIUPFDARgIs0zD/SKPgFsJEAF0X5/qO80llx59gOxFTboS9Amv3S+QfB7lqBId5sFXJ99BN0J6zFRvL9dDA==",
"dev": true
},
"node_modules/@types/normalize-package-data": {
@ -3228,9 +3228,9 @@
"dev": true
},
"node_modules/@vue/devtools-api": {
"version": "6.0.0-beta.20.1",
"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.20.1.tgz",
"integrity": "sha512-R2rfiRY+kZugzWh9ZyITaovx+jpU4vgivAEAiz80kvh3yviiTU3CBuGuyWpSwGz9/C7TkSWVM/FtQRGlZ16n8Q=="
"version": "6.0.0-beta.21.1",
"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.21.1.tgz",
"integrity": "sha512-FqC4s3pm35qGVeXRGOjTsRzlkJjrBLriDS9YXbflHLsfA9FrcKzIyWnLXoNm+/7930E8rRakXuAc2QkC50swAw=="
},
"node_modules/@vue/eslint-config-prettier": {
"version": "6.0.0",
@ -4751,9 +4751,9 @@
}
},
"node_modules/caniuse-lite": {
"version": "1.0.30001287",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001287.tgz",
"integrity": "sha512-4udbs9bc0hfNrcje++AxBuc6PfLNHwh3PO9kbwnfCQWyqtlzg3py0YgFu8jyRTTo85VAz4U+VLxSlID09vNtWA==",
"version": "1.0.30001291",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001291.tgz",
"integrity": "sha512-roMV5V0HNGgJ88s42eE70sstqGW/gwFndosYrikHthw98N5tLnOTxFqMLQjZVRxTWFlJ4rn+MsgXrR7MDPY4jA==",
"dev": true,
"funding": {
"type": "opencollective",
@ -6672,9 +6672,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.4.23",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.23.tgz",
"integrity": "sha512-q3tB59Api3+DMbLnDPkW/UBHBO7KTGcF+rDCeb0GAGyqFj562s6y+c/2tDKTS/y5lbC+JOvT4MSUALJLPqlcSA==",
"version": "1.4.25",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.25.tgz",
"integrity": "sha512-bTwub9Y/76EiNmfaiJih+hAy6xn7Ns95S4KvI2NuKNOz8TEEKKQUu44xuy0PYMudjM9zdjKRS1bitsUvHTfuUg==",
"dev": true
},
"node_modules/elliptic": {
@ -9087,9 +9087,9 @@
"dev": true
},
"node_modules/ignore": {
"version": "5.1.9",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.9.tgz",
"integrity": "sha512-2zeMQpbKz5dhZ9IwL0gbxSW5w0NK/MSAMtNuhgIHEPmaU3vPdKPL0UdvUCXs5SS4JAwsBxysK5sFMW8ocFiVjQ==",
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz",
"integrity": "sha512-CmxgYGiEPCLhfLnpPp1MoRmifwEIOgjcHXxOBjv7mY96c+eWScsOP9c112ZyLdWHi0FxHjI+4uVhKYp/gcdRmQ==",
"dev": true,
"engines": {
"node": ">= 4"
@ -10067,24 +10067,30 @@
}
},
"node_modules/launch-editor": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.2.1.tgz",
"integrity": "sha512-On+V7K2uZK6wK7x691ycSUbLD/FyKKelArkbaAMSSJU8JmqmhwN2+mnJDNINuJWSrh2L0kDk+ZQtbC/gOWUwLw==",
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.3.0.tgz",
"integrity": "sha512-3QrsCXejlWYHjBPFXTyGNhPj4rrQdB+5+r5r3wArpLH201aR+nWUgw/zKKkTmilCfY/sv6u8qo98pNvtg8LUTA==",
"dev": true,
"dependencies": {
"chalk": "^2.3.0",
"picocolors": "^1.0.0",
"shell-quote": "^1.6.1"
}
},
"node_modules/launch-editor-middleware": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/launch-editor-middleware/-/launch-editor-middleware-2.2.1.tgz",
"integrity": "sha512-s0UO2/gEGiCgei3/2UN3SMuUj1phjQN8lcpnvgLSz26fAzNWPQ6Nf/kF5IFClnfU2ehp6LrmKdMU/beveO+2jg==",
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/launch-editor-middleware/-/launch-editor-middleware-2.3.0.tgz",
"integrity": "sha512-GJR64trLdFFwCoL9DMn/d1SZX0OzTDPixu4mcfWTShQ4tIqCHCGvlg9fOEYQXyBlrSMQwylsJfUWncheShfV2w==",
"dev": true,
"dependencies": {
"launch-editor": "^2.2.1"
"launch-editor": "^2.3.0"
}
},
"node_modules/launch-editor/node_modules/picocolors": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
"dev": true
},
"node_modules/levn": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/levn/-/levn-0.3.0.tgz",
@ -11155,9 +11161,9 @@
}
},
"node_modules/object-inspect": {
"version": "1.11.1",
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.11.1.tgz",
"integrity": "sha512-If7BjFlpkzzBeV1cqgT3OSWT3azyoxDGajR+iGnFBfVV2EWyDyWaZZW2ERDjUaY2QM8i5jI3Sj7mhsM4DDAqWA==",
"version": "1.12.0",
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.0.tgz",
"integrity": "sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==",
"funding": {
"url": "https://github.com/sponsors/ljharb"
}
@ -13322,9 +13328,9 @@
"dev": true
},
"node_modules/sass": {
"version": "1.45.0",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.45.0.tgz",
"integrity": "sha512-ONy5bjppoohtNkFJRqdz1gscXamMzN3wQy1YH9qO2FiNpgjLhpz/IPRGg0PpCjyz/pWfCOaNEaiEGCcjOFAjqw==",
"version": "1.45.1",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.45.1.tgz",
"integrity": "sha512-pwPRiq29UR0o4X3fiQyCtrESldXvUQAAE0QmcJTpsI4kuHHcLzZ54M1oNBVIXybQv8QF2zfkpFcTxp8ta97dUA==",
"dev": true,
"dependencies": {
"chokidar": ">=3.0.0 <4.0.0",
@ -18637,9 +18643,9 @@
"dev": true
},
"@types/node": {
"version": "17.0.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.0.tgz",
"integrity": "sha512-eMhwJXc931Ihh4tkU+Y7GiLzT/y/DBNpNtr4yU9O2w3SYBsr9NaOPhQlLKRmoWtI54uNwuo0IOUFQjVOTZYRvw==",
"version": "17.0.2",
"resolved": "https://registry.npmjs.org/@types/node/-/node-17.0.2.tgz",
"integrity": "sha512-JepeIUPFDARgIs0zD/SKPgFsJEAF0X5/qO80llx59gOxFTboS9Amv3S+QfB7lqBId5sFXJ99BN0J6zFRvL9dDA==",
"dev": true
},
"@types/normalize-package-data": {
@ -19584,9 +19590,9 @@
}
},
"@vue/devtools-api": {
"version": "6.0.0-beta.20.1",
"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.20.1.tgz",
"integrity": "sha512-R2rfiRY+kZugzWh9ZyITaovx+jpU4vgivAEAiz80kvh3yviiTU3CBuGuyWpSwGz9/C7TkSWVM/FtQRGlZ16n8Q=="
"version": "6.0.0-beta.21.1",
"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.21.1.tgz",
"integrity": "sha512-FqC4s3pm35qGVeXRGOjTsRzlkJjrBLriDS9YXbflHLsfA9FrcKzIyWnLXoNm+/7930E8rRakXuAc2QkC50swAw=="
},
"@vue/eslint-config-prettier": {
"version": "6.0.0",
@ -20846,9 +20852,9 @@
}
},
"caniuse-lite": {
"version": "1.0.30001287",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001287.tgz",
"integrity": "sha512-4udbs9bc0hfNrcje++AxBuc6PfLNHwh3PO9kbwnfCQWyqtlzg3py0YgFu8jyRTTo85VAz4U+VLxSlID09vNtWA==",
"version": "1.0.30001291",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001291.tgz",
"integrity": "sha512-roMV5V0HNGgJ88s42eE70sstqGW/gwFndosYrikHthw98N5tLnOTxFqMLQjZVRxTWFlJ4rn+MsgXrR7MDPY4jA==",
"dev": true
},
"case-sensitive-paths-webpack-plugin": {
@ -22374,9 +22380,9 @@
"dev": true
},
"electron-to-chromium": {
"version": "1.4.23",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.23.tgz",
"integrity": "sha512-q3tB59Api3+DMbLnDPkW/UBHBO7KTGcF+rDCeb0GAGyqFj562s6y+c/2tDKTS/y5lbC+JOvT4MSUALJLPqlcSA==",
"version": "1.4.25",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.25.tgz",
"integrity": "sha512-bTwub9Y/76EiNmfaiJih+hAy6xn7Ns95S4KvI2NuKNOz8TEEKKQUu44xuy0PYMudjM9zdjKRS1bitsUvHTfuUg==",
"dev": true
},
"elliptic": {
@ -24231,9 +24237,9 @@
"dev": true
},
"ignore": {
"version": "5.1.9",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.9.tgz",
"integrity": "sha512-2zeMQpbKz5dhZ9IwL0gbxSW5w0NK/MSAMtNuhgIHEPmaU3vPdKPL0UdvUCXs5SS4JAwsBxysK5sFMW8ocFiVjQ==",
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.0.tgz",
"integrity": "sha512-CmxgYGiEPCLhfLnpPp1MoRmifwEIOgjcHXxOBjv7mY96c+eWScsOP9c112ZyLdWHi0FxHjI+4uVhKYp/gcdRmQ==",
"dev": true
},
"immutable": {
@ -24970,22 +24976,30 @@
"dev": true
},
"launch-editor": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.2.1.tgz",
"integrity": "sha512-On+V7K2uZK6wK7x691ycSUbLD/FyKKelArkbaAMSSJU8JmqmhwN2+mnJDNINuJWSrh2L0kDk+ZQtbC/gOWUwLw==",
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/launch-editor/-/launch-editor-2.3.0.tgz",
"integrity": "sha512-3QrsCXejlWYHjBPFXTyGNhPj4rrQdB+5+r5r3wArpLH201aR+nWUgw/zKKkTmilCfY/sv6u8qo98pNvtg8LUTA==",
"dev": true,
"requires": {
"chalk": "^2.3.0",
"picocolors": "^1.0.0",
"shell-quote": "^1.6.1"
},
"dependencies": {
"picocolors": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
"integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==",
"dev": true
}
}
},
"launch-editor-middleware": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/launch-editor-middleware/-/launch-editor-middleware-2.2.1.tgz",
"integrity": "sha512-s0UO2/gEGiCgei3/2UN3SMuUj1phjQN8lcpnvgLSz26fAzNWPQ6Nf/kF5IFClnfU2ehp6LrmKdMU/beveO+2jg==",
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/launch-editor-middleware/-/launch-editor-middleware-2.3.0.tgz",
"integrity": "sha512-GJR64trLdFFwCoL9DMn/d1SZX0OzTDPixu4mcfWTShQ4tIqCHCGvlg9fOEYQXyBlrSMQwylsJfUWncheShfV2w==",
"dev": true,
"requires": {
"launch-editor": "^2.2.1"
"launch-editor": "^2.3.0"
}
},
"levn": {
@ -25881,9 +25895,9 @@
"dev": true
},
"object-inspect": {
"version": "1.11.1",
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.11.1.tgz",
"integrity": "sha512-If7BjFlpkzzBeV1cqgT3OSWT3azyoxDGajR+iGnFBfVV2EWyDyWaZZW2ERDjUaY2QM8i5jI3Sj7mhsM4DDAqWA=="
"version": "1.12.0",
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.12.0.tgz",
"integrity": "sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g=="
},
"object-is": {
"version": "1.1.5",
@ -27644,9 +27658,9 @@
"dev": true
},
"sass": {
"version": "1.45.0",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.45.0.tgz",
"integrity": "sha512-ONy5bjppoohtNkFJRqdz1gscXamMzN3wQy1YH9qO2FiNpgjLhpz/IPRGg0PpCjyz/pWfCOaNEaiEGCcjOFAjqw==",
"version": "1.45.1",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.45.1.tgz",
"integrity": "sha512-pwPRiq29UR0o4X3fiQyCtrESldXvUQAAE0QmcJTpsI4kuHHcLzZ54M1oNBVIXybQv8QF2zfkpFcTxp8ta97dUA==",
"dev": true,
"requires": {
"chokidar": ">=3.0.0 <4.0.0",

View File

@ -114,6 +114,13 @@ $table-striped-row-even-hover-background-color: #ecf2fa;
height: 100% !important;
}
@media only screen and (min-width: 1408px) {
.header-image {
background-image: url("../site/img/Main-banner-homepage-2560x.jpg");
min-height: 700px;
}
}
/* =Section general styling
-------- */
// section {
@ -249,30 +256,30 @@ body {
display: none;
}
// .animate_content {
// animation: animate 3s ease;
// }
.animate_content {
animation: animate 3s ease;
}
// @keyframes animate {
// 10% {
// transform: scale(1, 0.004);
// }
// 35% {
// transform: scale(0.001, 0.004);
// opacity: 1;
// }
// 50% {
// transform: scale(0.001, 0.004);
// opacity: 0;
// }
// 85% {
// transform: scale(1, 0.004);
// opacity: 1;
// }
// 100% {
// transform: scale(1, 1);
// }
// }
@keyframes animate {
10% {
transform: scale(1, 0.004);
}
35% {
transform: scale(0.001, 0.004);
opacity: 1;
}
50% {
transform: scale(0.001, 0.004);
opacity: 0;
}
85% {
transform: scale(1, 0.004);
opacity: 1;
}
100% {
transform: scale(1, 1);
}
}
.page_description {
font-weight: 300;
@ -434,3 +441,29 @@ body {
.work-items div:hover .work-front {
display: none;
}
@media only screen and (max-width: 580px) {
.mobile-space {
margin-top: 2em;
}
.page-breaker {
padding: 0;
}
footer .card {
margin-bottom: 2em;
}
.overlay-boxes {
margin-bottom: 1em;
}
.super-card {
margin-bottom: 1em;
}
.partner-logos {
padding: 0;
}
.search-box {
width: auto;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 488 KiB

View File

@ -96,7 +96,7 @@
</div>
</section>
<section class="section">
<div>
<div class="column is-full text-center">
<h1>TETHYS SERVICES</h1>
<p class="lead">Eine Übersicht unserer Dienstleistungen</p>
@ -157,7 +157,7 @@
</div>
</div>
</div>
</section>
</div>
</div>
<div class="clearfix mt-3"></div>

View File

@ -1,6 +1,6 @@
<template>
<div id="page_style" class="rows site-content page__style page__description" autocomplete="off">
<div class="container-fluid page-breaker mz-5">
<div class="container-fluid banner mz-5">
<vs-input v-on:search-change="onSearch" v-bind:propDisplay="searchTerm" v-bind:placeholder="'Enter your search term...'"></vs-input>
</div>
<div class="column is-half is-offset-one-quarter" style="padding-top: 0; margin-top: 0">
@ -143,7 +143,7 @@ export default SearchViewComponent;
</script>
<style scoped>
.page-breaker {
.banner {
background-image: url(./../../assets/site/img/main-search-banner.jpg);
background-size: cover;
background-position-x: center;
@ -151,9 +151,21 @@ export default SearchViewComponent;
background-repeat: no-repeat;
padding: 6.2em;
min-height: 400px;
width: 100%;
/* display: flex;
flex-direction: column; */
justify-content: center;
align-items: center;
}
.mz-5 {
margin-bottom: 1.5 rem;
}
@media (max-width: 576px) {
.banner {
align-items: flex-start;
height: 400px;
}
}
</style>

View File

@ -1,6 +1,6 @@
<template>
<div class="container">
<section class="section">
<div>
<div class="column is-full text-center">
<h1>TETHYS SERVICES</h1>
<p class="lead">Eine Übersicht unserer Dienstleistungen</p>
@ -61,7 +61,7 @@
</div>
</div>
</div>
</section>
</div>
</div>
</template>