Converted some objects to components.
This commit is contained in:
@ -8,7 +8,7 @@
|
||||
* Version:
|
||||
* 1.0.0 - 2018/05/03
|
||||
*/
|
||||
.o-app {
|
||||
.c-app {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
width: 100%;
|
@ -10,20 +10,20 @@
|
||||
* Version:
|
||||
* 1.0.0 - 2018/06/12
|
||||
*/
|
||||
$o-hamburger-menu--max: 200%;
|
||||
$o-hamburger-menu--pos-x: 100%;
|
||||
$o-hamburger-menu--pos-y: 0%;
|
||||
@include t-keyframes(o-hamburger-menu--open) {
|
||||
from { clip-path: circle(0% at $o-hamburger-menu--pos-x $o-hamburger-menu--pos-y); }
|
||||
to { clip-path: circle($o-hamburger-menu--max at $o-hamburger-menu--pos-x $o-hamburger-menu--pos-y); }
|
||||
$c-hamburger-menu--max: 200%;
|
||||
$c-hamburger-menu--pos-x: 100%;
|
||||
$c-hamburger-menu--pos-y: 0%;
|
||||
@include t-keyframes(c-hamburger-menu--open) {
|
||||
from { clip-path: circle(0% at $c-hamburger-menu--pos-x $c-hamburger-menu--pos-y); }
|
||||
to { clip-path: circle($c-hamburger-menu--max at $c-hamburger-menu--pos-x $c-hamburger-menu--pos-y); }
|
||||
}
|
||||
|
||||
@include t-keyframes(o-hamburger-menu--close) {
|
||||
from { clip-path: circle($o-hamburger-menu--max at $o-hamburger-menu--pos-x $o-hamburger-menu--pos-y); }
|
||||
to { clip-path: circle(0% at $o-hamburger-menu--pos-x $o-hamburger-menu--pos-y); }
|
||||
@include t-keyframes(c-hamburger-menu--close) {
|
||||
from { clip-path: circle($c-hamburger-menu--max at $c-hamburger-menu--pos-x $c-hamburger-menu--pos-y); }
|
||||
to { clip-path: circle(0% at $c-hamburger-menu--pos-x $c-hamburger-menu--pos-y); }
|
||||
}
|
||||
|
||||
.o-hamburger-menu {
|
||||
.c-hamburger-menu {
|
||||
|
||||
&__menu {
|
||||
display: none;
|
||||
@ -81,16 +81,16 @@ $o-hamburger-menu--pos-y: 0%;
|
||||
|
||||
|
||||
&.is-open {
|
||||
.o-hamburger-menu__menu {
|
||||
.c-hamburger-menu__menu {
|
||||
display: block;
|
||||
@include t-animation-name(o-hamburger-menu--open);
|
||||
@include t-animation-name(c-hamburger-menu--open);
|
||||
}
|
||||
}
|
||||
|
||||
&.is-closing {
|
||||
.o-hamburger-menu__menu {
|
||||
.c-hamburger-menu__menu {
|
||||
display: block;
|
||||
@include t-animation-name(o-hamburger-menu--close);
|
||||
@include t-animation-name(c-hamburger-menu--close);
|
||||
}
|
||||
}
|
||||
}
|
@ -5,7 +5,7 @@
|
||||
* Version:
|
||||
* 1.0.0 - 2018/05/07
|
||||
*/
|
||||
.o-main {
|
||||
.c-main {
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
width: 100%;
|
@ -12,9 +12,9 @@
|
||||
* Version:
|
||||
* 1.0.0 - 2018/05/03
|
||||
*/
|
||||
$o-navbar--link-thickness: 5px;
|
||||
$c-navbar--link-thickness: 5px;
|
||||
|
||||
.o-navbar {
|
||||
.c-navbar {
|
||||
z-index: $s-z--navbar;
|
||||
|
||||
&.is-stuck {
|
||||
@ -67,7 +67,7 @@ $o-navbar--link-thickness: 5px;
|
||||
|
||||
&.is-active:after {
|
||||
background: $s-color--navbar__bar-hover;
|
||||
height: $o-navbar--link-thickness;
|
||||
height: $c-navbar--link-thickness;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@ -75,7 +75,7 @@ $o-navbar--link-thickness: 5px;
|
||||
|
||||
&:after {
|
||||
background: $s-color--navbar__bar-hover;
|
||||
height: $o-navbar--link-thickness;
|
||||
height: $c-navbar--link-thickness;
|
||||
}
|
||||
}
|
||||
}
|
@ -58,27 +58,27 @@
|
||||
@import './elements/_headings.scss';
|
||||
|
||||
//Objects
|
||||
@import './objects/main.scss';
|
||||
|
||||
@import './objects/_app.scss';
|
||||
@import './objects/_background.scss';
|
||||
@import './objects/_button.scss';
|
||||
@import './objects/_element-scroll-fader.scss';
|
||||
@import './objects/_floating-content-box.scss';
|
||||
@import './objects/_form.scss';
|
||||
@import './objects/_hamburger-menu.scss';
|
||||
@import './objects/_input.scss';
|
||||
@import './objects/_loader.scss';
|
||||
@import './objects/_navbar.scss';
|
||||
@import './objects/_page-transition.scss';
|
||||
@import './objects/_title.scss';
|
||||
@import './objects/_video.scss';
|
||||
|
||||
//Components
|
||||
@import './components/_app.scss';
|
||||
@import './components/_body-section.scss';
|
||||
@import './components/_clear-section.scss';
|
||||
@import './components/_footer.scss';
|
||||
@import './components/_hamburger-menu.scss';
|
||||
@import './components/_image-section.scss';
|
||||
@import './components/_main.scss';
|
||||
@import './components/_navbar.scss';
|
||||
@import './components/_page.scss';
|
||||
@import './components/_section.scss';
|
||||
@import './components/_split-section.scss';
|
||||
|
Reference in New Issue
Block a user