Mirrors/inspec
2
0
Fork 0
mirror of https://github.com/inspec/inspec synced 2024-12-24 03:53:15 +00:00
Code Issues Projects Releases Packages Wiki Activity
inspec/www/source/stylesheets/_layout.scss

92 lines
3.5 KiB
SCSS
Raw Normal View History

Add main site navigation Also includes integration of Font awesome icons.
2016-09-20 16:22:12 +00:00
WIP New Inspec.io Base SCSS, JS, fonts, images, HTML ported over to old inspec.io tempting engine. —To do: Media queries, Header, footer, docs, tutorials
2016-12-13 03:13:38 +00:00
//Alignment
Add main site footer
2016-09-21 00:11:41 +00:00
WIP New Inspec.io Base SCSS, JS, fonts, images, HTML ported over to old inspec.io tempting engine. —To do: Media queries, Header, footer, docs, tutorials
2016-12-13 03:13:38 +00:00
.strict-center {
left: 0;
right: 0;
margin: auto;
text-align: center;
Add main site footer
2016-09-21 00:11:41 +00:00
}
WIP New Inspec.io Base SCSS, JS, fonts, images, HTML ported over to old inspec.io tempting engine. —To do: Media queries, Header, footer, docs, tutorials
2016-12-13 03:13:38 +00:00
.strict-right {
float: right;
text-align: right;
}
//margins
Add main site footer
2016-09-21 00:11:41 +00:00
WIP New Inspec.io Base SCSS, JS, fonts, images, HTML ported over to old inspec.io tempting engine. —To do: Media queries, Header, footer, docs, tutorials
2016-12-13 03:13:38 +00:00
.margin-both-xl {
margin-top: $percent_lg;
margin-bottom: $percent_lg;
}
.margin-top-xl {
margin-top: $percent_lg;
}
.margin-under-xl {
margin-bottom: $percent_lg;
}
.margin-both {
margin-top: $percent_md;
margin-bottom: $percent_md;
}
.margin-top {
margin-top: $percent_md;
}
.margin-under {
margin-bottom: $percent_md;
}
.margin-under-xs {
margin-bottom: $percent_sm;
}
Add main site navigation Also includes integration of Font awesome icons.
2016-09-20 16:22:12 +00:00
WIP New Inspec.io Base SCSS, JS, fonts, images, HTML ported over to old inspec.io tempting engine. —To do: Media queries, Header, footer, docs, tutorials
2016-12-13 03:13:38 +00:00
//Art
Add main site navigation Also includes integration of Font awesome icons.
2016-09-20 16:22:12 +00:00
WIP New Inspec.io Base SCSS, JS, fonts, images, HTML ported over to old inspec.io tempting engine. —To do: Media queries, Header, footer, docs, tutorials
2016-12-13 03:13:38 +00:00
.icon-art {
height: 100px;
margin-bottom: 15px;
margin-top: 15px;
}
.icon {
width: 70px;
height: 70px;
border-radius: 50%;
border: 2px solid $color_white;
overflow: hidden;
background: $color_white;
margin-top: -35px;
z-index: 50;
position: absolute;
img {
display: block;
padding: 30%;
height: auto;
}
}
.shadow {
box-shadow: 0 0 25px $color_shadow;
}
.block-angl {
background: $color_triangle_block;
clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 100%);
}
.triangle-shade {
background-image: url('/images/home/triangle-motif.png');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 85% 0;
}
.purp-shade {
background: -moz-radial-gradient(center, ellipse cover, rgba(151,110,229,0.4) 0%, rgba(151,110,229,0.2) 50%, rgba(151,110,229,0) 100%);
background: -webkit-radial-gradient(center, ellipse cover, rgba(151,110,229,0.4) 0%,rgba(151,110,229,0.2) 50%,rgba(151,110,229,0) 100%);
background: radial-gradient(ellipse at center, rgba(151,110,229,0.4) 0%,rgba(151,110,229,0.2) 50%,rgba(151,110,229,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66976ee5', endColorstr='#00976ee5',GradientType=1 );
}
.blue-gradient {
background: -moz-linear-gradient(100% -14.24% -80deg,rgba(99, 206, 153, 1) 0%,rgba(91, 201, 163, 1) 8.33%,rgba(67, 185, 194, 1) 36.64%,rgba(58, 179, 206, 1) 52.48%,rgba(58, 175, 206, 1) 67.93%,rgba(58, 162, 206, 1) 83.94%,rgba(58, 142, 206, 1) 100%);
background: -webkit-linear-gradient(-80deg, rgba(99, 206, 153, 1) 0%, rgba(91, 201, 163, 1) 8.33%, rgba(67, 185, 194, 1) 36.64%, rgba(58, 179, 206, 1) 52.48%, rgba(58, 175, 206, 1) 67.93%, rgba(58, 162, 206, 1) 83.94%, rgba(58, 142, 206, 1) 100%);
background: -webkit-gradient(linear,100% -14.24% ,56.15% 114.24% ,color-stop(0,rgba(99, 206, 153, 1) ),color-stop(0.0833,rgba(91, 201, 163, 1) ),color-stop(0.3664,rgba(67, 185, 194, 1) ),color-stop(0.5248,rgba(58, 179, 206, 1) ),color-stop(0.6793,rgba(58, 175, 206, 1) ),color-stop(0.8394,rgba(58, 162, 206, 1) ),color-stop(1,rgba(58, 142, 206, 1) ));
background: -o-linear-gradient(-80deg, rgba(99, 206, 153, 1) 0%, rgba(91, 201, 163, 1) 8.33%, rgba(67, 185, 194, 1) 36.64%, rgba(58, 179, 206, 1) 52.48%, rgba(58, 175, 206, 1) 67.93%, rgba(58, 162, 206, 1) 83.94%, rgba(58, 142, 206, 1) 100%);
background: -ms-linear-gradient(-80deg, rgba(99, 206, 153, 1) 0%, rgba(91, 201, 163, 1) 8.33%, rgba(67, 185, 194, 1) 36.64%, rgba(58, 179, 206, 1) 52.48%, rgba(58, 175, 206, 1) 67.93%, rgba(58, 162, 206, 1) 83.94%, rgba(58, 142, 206, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#63CE99', endColorstr='#3A8ECE' ,GradientType=0)";
background: linear-gradient(170deg, rgba(99, 206, 153, 1) 0%, rgba(91, 201, 163, 1) 8.33%, rgba(67, 185, 194, 1) 36.64%, rgba(58, 179, 206, 1) 52.48%, rgba(58, 175, 206, 1) 67.93%, rgba(58, 162, 206, 1) 83.94%, rgba(58, 142, 206, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#63CE99',endColorstr='#3A8ECE' , GradientType=1);
}
Reference in a new issue Copy permalink