Made the landing page
* Unneeded demo files where removed
* Content was added
* I changed things to make the site work without javascript
* It still uses javascript, but disabeling javascript made it that text wasn't shown, this isn't the case any more
* I just removed the class from the body element
* When opening the site it has a weird "jump" effect instead of comming up. This could be better, but is good enough for now
* I only removed the class in the html, not from the css or javascript
* This should also be done, but feels like too much work for now
* Images didn't properly fit any more when javascript was disabled. This has been fixed with css and there is no distinction anymore between js and non-js
* This probably means that there is javascript or something that should be removed. I didn't do that
* The "Our Services" section had three shades for the children, but then fell back on the first shade for other sections. It now uses two shades, one for odd children and one for even children
This commit is contained in:
Ilja
47
original/assets/sass/base/_page.scss
Normal file
47
original/assets/sass/base/_page.scss
Normal file
@@ -0,0 +1,47 @@
|
||||
///
|
||||
/// Hyperspace by HTML5 UP
|
||||
/// html5up.net | @ajlkn
|
||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||
///
|
||||
|
||||
/* Basic */
|
||||
|
||||
// MSIE: Required for IEMobile.
|
||||
@-ms-viewport {
|
||||
width: device-width;
|
||||
}
|
||||
|
||||
// MSIE: Prevents scrollbar from overlapping content.
|
||||
body {
|
||||
-ms-overflow-style: scrollbar;
|
||||
}
|
||||
|
||||
// Ensures page width is always >=320px.
|
||||
@include breakpoint('<=xsmall') {
|
||||
html, body {
|
||||
min-width: 320px;
|
||||
}
|
||||
}
|
||||
|
||||
// Set box model to border-box.
|
||||
// Based on css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
*, *:before, *:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
body {
|
||||
background: _palette(bg);
|
||||
|
||||
// Stops initial animations until page loads.
|
||||
&.is-preload {
|
||||
*, *:before, *:after {
|
||||
@include vendor('animation', 'none !important');
|
||||
@include vendor('transition', 'none !important');
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
76
original/assets/sass/base/_reset.scss
Normal file
76
original/assets/sass/base/_reset.scss
Normal file
@@ -0,0 +1,76 @@
|
||||
///
|
||||
/// Hyperspace by HTML5 UP
|
||||
/// html5up.net | @ajlkn
|
||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||
///
|
||||
|
||||
// Reset.
|
||||
// Based on meyerweb.com/eric/tools/css/reset (v2.0 | 20110126 | License: public domain)
|
||||
|
||||
html, body, div, span, applet, object,
|
||||
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
|
||||
pre, a, abbr, acronym, address, big, cite,
|
||||
code, del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var, b,
|
||||
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
|
||||
form, label, legend, table, caption, tbody,
|
||||
tfoot, thead, tr, th, td, article, aside,
|
||||
canvas, details, embed, figure, figcaption,
|
||||
footer, header, hgroup, menu, nav, output, ruby,
|
||||
section, summary, time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol, ul {
|
||||
list-style:none;
|
||||
}
|
||||
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-text-size-adjust: none;
|
||||
}
|
||||
|
||||
mark {
|
||||
background-color: transparent;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
input::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
input, select, textarea {
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
-ms-appearance: none;
|
||||
appearance: none;
|
||||
}
|
||||
200
original/assets/sass/base/_typography.scss
Normal file
200
original/assets/sass/base/_typography.scss
Normal file
@@ -0,0 +1,200 @@
|
||||
///
|
||||
/// Hyperspace by HTML5 UP
|
||||
/// html5up.net | @ajlkn
|
||||
/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
|
||||
///
|
||||
|
||||
/* Type */
|
||||
|
||||
body, input, select, textarea {
|
||||
color: _palette(fg);
|
||||
font-family: _font(family);
|
||||
font-size: 16.5pt;
|
||||
font-weight: _font(weight);
|
||||
line-height: 1.75;
|
||||
|
||||
@include breakpoint('<=xlarge') {
|
||||
font-size: 13pt;
|
||||
}
|
||||
|
||||
@include breakpoint('<=large') {
|
||||
font-size: 12pt;
|
||||
}
|
||||
|
||||
@include breakpoint('<=xxsmall') {
|
||||
font-size: 11pt;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
@include vendor('transition', (
|
||||
'color #{_duration(transition)} ease',
|
||||
'border-bottom-color #{_duration(transition)} ease'
|
||||
));
|
||||
border-bottom: dotted 1px _palette(fg-light);
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
border-bottom-color: transparent;
|
||||
color: _palette(fg-bold);
|
||||
}
|
||||
}
|
||||
|
||||
strong, b {
|
||||
color: _palette(fg-bold);
|
||||
font-weight: _font(weight-bold);
|
||||
}
|
||||
|
||||
em, i {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 0 _size(element-margin) 0;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: _palette(fg-bold);
|
||||
font-weight: _font(weight-bold);
|
||||
line-height: 1.5;
|
||||
margin: 0 0 (_size(element-margin) * 0.25) 0;
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.75em;
|
||||
|
||||
&.major {
|
||||
margin: 0 0 (_size(element-margin) * 0.65) 0;
|
||||
position: relative;
|
||||
padding-bottom: 0.35em;
|
||||
|
||||
&:after {
|
||||
@include vendor('background-image', 'linear-gradient(to right, #{_palette(accent1)}, #{_palette(accent3)})');
|
||||
@include vendor('transition', 'max-width #{_duration(transition)} ease');
|
||||
border-radius: 0.2em;
|
||||
bottom: 0;
|
||||
content: '';
|
||||
height: 0.05em;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.75em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
@include breakpoint('<=small') {
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 0.6em;
|
||||
}
|
||||
}
|
||||
|
||||
sub {
|
||||
font-size: 0.8em;
|
||||
position: relative;
|
||||
top: 0.5em;
|
||||
}
|
||||
|
||||
sup {
|
||||
font-size: 0.8em;
|
||||
position: relative;
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: solid (_size(border-width) * 4) _palette(border);
|
||||
font-style: italic;
|
||||
margin: 0 0 _size(element-margin) 0;
|
||||
padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
|
||||
}
|
||||
|
||||
code {
|
||||
background: _palette(border-bg);
|
||||
border-radius: _size(border-radius);
|
||||
border: solid _size(border-width) _palette(border);
|
||||
font-family: _font(family-fixed);
|
||||
font-size: 0.9em;
|
||||
margin: 0 0.25em;
|
||||
padding: 0.25em 0.65em;
|
||||
}
|
||||
|
||||
pre {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
font-family: _font(family-fixed);
|
||||
font-size: 0.9em;
|
||||
margin: 0 0 _size(element-margin) 0;
|
||||
|
||||
code {
|
||||
display: block;
|
||||
line-height: 1.75em;
|
||||
padding: 1em 1.5em;
|
||||
overflow-x: auto;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-bottom: solid _size(border-width) _palette(border);
|
||||
margin: _size(element-margin) 0;
|
||||
|
||||
&.major {
|
||||
margin: (_size(element-margin) * 1.5) 0;
|
||||
}
|
||||
}
|
||||
|
||||
.align-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.align-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.align-right {
|
||||
text-align: right;
|
||||
}
|
||||
Reference in New Issue
Block a user