JonasFranzDEV
/
portio-hugo
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

migrate all variables

Browse Source
master
Aaron N. Brock 4 years ago
parent cfaf37f62c
commit 0cd2cbb4a0
9 changed files with 85 additions and 128 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 17
      assets/scss/_variables.scss
  2. 6
      assets/scss/components/_footer-section.scss
  3. 16
      assets/scss/components/_hero-section.scss
  4. 54
      assets/scss/components/_navbar.scss
  5. 15
      assets/scss/components/_page-title.scss
  6. 39
      assets/scss/components/_preloder.scss
  7. 56
      assets/scss/components/_service-section.scss
  8. 4
      assets/scss/components/_testimonial-section.scss
  9. 6
      layouts/partials/hero.html

17
assets/scss/_variables.scss
Unescape View File

@ -1,20 +1,3 @@
//site color variables
$primary-color: #5d78ff;
$secondary-color: #282f49;
$text-color: #9d9ea5;
$text-color-dark: #00113e;
$site-ease: cubic-bezier(0.36, 0.03, 0, 0.91);
$gray: #f7f9ff;
$dark-gray: #646569;
// solid colors
$white: #fff;
$black: #000;
//////
////// Bootstrap Variables
//////
// Colors
$primary: #5d78ff;
$secondary: #282f49;

6
assets/scss/components/_footer-section.scss
Unescape View File

@ -19,7 +19,7 @@
}
}
&__cta {
background: $primary-color;
background: $primary;
padding: 100px 80px;
border-radius: 20px;
display: flex;
@ -117,10 +117,6 @@
}
}
}
// &_sitemap{
// }
// &_address{
// }
}
&__footer {
padding: 50px 0;

16
assets/scss/components/_hero-section.scss
Unescape View File

@ -58,16 +58,6 @@
@include desktop {
display: inline-block;
}
// &::before {
// position: absolute;
// content: "";
// height: 2px;
// width: 20px;
// top: 50%;
// left: -20px;
// transform: translateX(-50%);
// background: $secondary-color;
// }
}
p {
font-size: $font-size-lg;
@ -150,9 +140,13 @@
left: 55%;
transform: translate(-50%, -50%);
transition: all 0.3s ease;
path {
fill: $primary;
}
}
&:hover {
background-color: $primary-color;
background-color: $primary;
svg {
path {
fill: #ffffff;

54
assets/scss/components/_navbar.scss
Unescape View File

@ -1,70 +1,70 @@
.navbar{
.navbar {
padding: 40px 0;
background: transparent;
transition: all .3s ease;
@include desktop{
transition: all 0.3s ease;
@include desktop {
background: $white;
}
@include desktop{
@include desktop {
padding: 15px 20px;
margin: 10px 10px 0;
border-radius: 5px;
}
.navbar-brand{
img{
@include desktop{
.navbar-brand {
img {
@include desktop {
width: 80%;
}
}
}
&.nav__color__change{
&.nav__color__change {
background: $white;
padding: 20px 0;
box-shadow: 0px 10px 20px 0px rgba(50,65,141,0.1);
@include desktop{
box-shadow: 0px 10px 20px 0px rgba(50, 65, 141, 0.1);
@include desktop {
padding: 15px 20px;
}
}
@include desktop{
.navbar-toggler{
@include desktop {
.navbar-toggler {
outline: 0;
padding: 0;
&-icon {
height: 2px;
width: 25px;
transition: all 0.2s;
background: $primary-color;
background: $primary;
display: block;
&:not(:last-child){
&:not(:last-child) {
margin-bottom: 5px;
}
&:nth-child(1){
&:nth-child(1) {
transform: rotate(45deg);
transform-origin: 10% 10%;
}
&:nth-child(2){
&:nth-child(2) {
opacity: 0;
filter: alpha(opacity=0);
}
&:nth-child(3){
&:nth-child(3) {
transform: rotate(-45deg);
transform-origin: 10% 90%;
}
}
&.collapsed{
.navbar-toggler-icon{
&:nth-child(1){
transform: rotate(0);
&.collapsed {
.navbar-toggler-icon {
&:nth-child(1) {
transform: rotate(0);
}
&:nth-child(2){
opacity: 1;
filter: alpha(opacity=1);
&:nth-child(2) {
opacity: 1;
filter: alpha(opacity=1);
}
&:nth-child(3){
transform: rotate(0);
&:nth-child(3) {
transform: rotate(0);
}
}
}
}
}
}
}

15
assets/scss/components/_page-title.scss
Unescape View File

@ -62,20 +62,5 @@
}
.breadcrumb-item + .breadcrumb-item::before {
content: "-";
// color: $secondary-color;
// font-size: 17px;
// padding-right: 10px;
// @include mobile {
// font-size: 14px;
// }
// @include mobile-xs {
// padding-right: 0px;
// }
}
// .breadcrumb-item + .breadcrumb-item {
// padding-left: 10px;
// @include mobile-xs {
// padding-right: 0px;
// }
// }
}

39
assets/scss/components/_preloder.scss
Unescape View File

@ -1,32 +1,32 @@
.preloader-wrap {
width: 100%;
height: 100%;
position: fixed;
top: 0;
bottom: 0;
background: $white;
z-index: 2000;
text-align: center;
width: 100%;
height: 100%;
position: fixed;
top: 0;
bottom: 0;
background: $white;
z-index: 2000;
text-align: center;
height: 100vh;
.inner{
.inner {
position: absolute;
height: 170px;
width: 170px;
left: 50%;
top: 50%;
transform: translate( -50%, -50% );
border: 1px solid $primary-color;
border-top: 5px solid $primary-color;
transform: translate(-50%, -50%);
border: 1px solid $primary;
border-top: 5px solid $primary;
border-radius: 50%;
animation: spin 1s infinite linear;
@include desktop{
@include desktop {
height: 150px;
width: 150px;
}
}
.percentage {
z-index: 100;
color: $primary-color;
color: $primary;
opacity: 1;
font-weight: 600;
font-family: "bebasbold";
@ -37,19 +37,18 @@
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
@include desktop{
transform: translate(-50%, -50%);
@include desktop {
font-size: 50px;
}
}
}
@keyframes spin{
@keyframes spin {
0% {
transform: translate( -50%, -50% ) rotate(0);
transform: translate(-50%, -50%) rotate(0);
}
100% {
transform: translate( -50%, -50% ) rotate(360deg);
transform: translate(-50%, -50%) rotate(360deg);
}
}

56
assets/scss/components/_service-section.scss
Unescape View File

@ -1,57 +1,57 @@
.service{
.service {
position: relative;
overflow: hidden;
padding-bottom: 275px;
&__background{
&__background {
position: absolute;
top: 0;
right: 0;
z-index: -1;
width: 61%;
svg{
svg {
width: 100%;
height: 100%;
}
}
&__background_shape{
&__background_shape {
position: absolute;
bottom: -10%;
left: -7%;
height: 465px;
width: 410px;
svg{
width:100%;
svg {
width: 100%;
}
@include desktop{
@include desktop {
display: none;
}
}
&__background_pattern{
&__background_pattern {
position: absolute;
bottom: 4%;
left: 6%;
animation: move_top 5s infinite linear;
@include desktop{
@include desktop {
display: none;
}
}
&__slider{
&_item{
&__slider {
&_item {
margin: 15px;
padding: 30px;
box-shadow: 0px 20px 40px 0px rgba(50,65,141,0.12);
box-shadow: 0px 20px 40px 0px rgba(50, 65, 141, 0.12);
border-radius: 20px;
background: $white;
&-icon{
&-icon {
height: 110px;
width: 125px;
position: relative;
.icon-background{
.icon-background {
position: absolute;
top: 0;
right: 0;
}
.icon{
.icon {
position: absolute;
left: 0;
bottom: 0;
@ -62,51 +62,51 @@
.slick-list {
overflow: visible;
}
.slick-dots{
.slick-dots {
display: flex;
align-items: center;
margin: 0;
padding: 0;
justify-content: center;
li{
li {
margin: 0;
list-style: none;
height: 8px;
width: 8px;
&:not(:last-child){
&:not(:last-child) {
margin-right: 15px;
}
button{
button {
cursor: pointer;
height: 100%;
width: 100%;
background: #C2C8CC;
background: #c2c8cc;
border-radius: 50%;
transition: all .3s ease;
transition: all 0.3s ease;
display: block;
padding: 0;
text-indent: -9999px;
&:focus {
outline: 0;
}
&:hover{
background: $primary-color;
&:hover {
background: $primary;
}
}
&.slick-active{
&.slick-active {
height: 10px;
width: 10px;
border-radius: 50%;
button{
background-color: $primary-color;
button {
background-color: $primary;
}
}
}
}
.slick-slide {
&:focus{
&:focus {
outline: 0;
}
}
}
}
}

4
assets/scss/components/_testimonial-section.scss
Unescape View File

@ -99,7 +99,7 @@
outline: 0;
}
&:hover {
background: $primary-color;
background: $primary;
}
}
&.slick-active {
@ -107,7 +107,7 @@
width: 10px;
border-radius: 50%;
button {
background-color: $primary-color;
background-color: $primary;
}
}
}

6
layouts/partials/hero.html
Unescape View File

@ -50,10 +50,10 @@
<div class="thumb">
<img src="{{ .videoThumb }}" alt="popup" />
</div>
<a href="{{ .videoURL }}" type="button" class="popup-button">
<a href="{{ .videoURL }}" type="button" class="popup-button text-center big">
<svg xmlns="http://www.w3.org/2000/svg" width="21" height="24" viewBox="0 0 21 24">
<path fill="#5d78ff"
d="M17.961 10.264a2 2 0 010 3.473L2.992 22.29A2 2 0 010 20.554V3.446A2 2 0 012.992 1.71z"
<path d="M17.961 10.264a2 2 0 010 3.473L2.992 22.29A2 2 0 010 20.554V3.446A2 2 0 012.992 1.71z"
data-name="Polygon 4" />
</svg>
</a>

Write Preview
Loading…
Cancel
Save