Skip to content

Instantly share code, notes, and snippets.

View gearmobile's full-sized avatar
🇷🇺
Working remotely

Valeriy Semenenko gearmobile

🇷🇺
Working remotely
View GitHub Profile
@gearmobile
gearmobile / unknown-width-and-height-flexbox
Created May 28, 2015 19:02
Element has unknown width and height - flexbox
.parent {
display: flex;
justify-content: center;
align-items: center;
}
@gearmobile
gearmobile / css-triangles
Last active August 29, 2015 14:22
CSS Triangles
HTML:
<div class="arrow-up"></div>
<div class="arrow-down"></div>
<div class="arrow-left"></div>
<div class="arrow-right"></div>
CSS:
.arrow-up {
width: 0;
height: 0;
@gearmobile
gearmobile / cross-browser-min-height
Created May 28, 2015 19:24
Cross-Browser Min Height
div {
min-height: 500px;
height:auto !important;
height: 500px;
}
@gearmobile
gearmobile / toggle-button-menu
Created May 28, 2015 19:39
Toggle Button Menu
Jade:
header.header
.button
.button__item
.button__item
.button__item
.button__item
ul.menu
li.menu__item
a.menu__link(href="#") menu link
@gearmobile
gearmobile / accordeon-vertical-jquery
Created May 29, 2015 11:26
Accordeon Vertical jQuery
JADE:
section.accordeon__wrapper
ul.accordeon
li.accordeon__item
a.accordeon__trigger(href="#{js}") accordeon item 1
ul.accordeon__inner
li.accordeon__inner__item: a.accordeon__inner__link(href="#{js}") accordeon inner link 1
li.accordeon__inner__item: a.accordeon__inner__link(href="#{js}") accordeon inner link 2
li.accordeon__inner__item: a.accordeon__inner__link(href="#{js}") accordeon inner link 3
li.accordeon__item
@gearmobile
gearmobile / accordeon-vertical
Created May 30, 2015 10:34
Accordeon Vertical
Jade:
section.accordeon__wrapper
ul.accordeon
li.accordeon__item
a.accordeon__trigger(href="#{js}") accordeon item 1
ul.accordeon__inner
li.accordeon__inner__item: a.accordeon__inner__link(href="#{js}") accordeon inner link 1
li.accordeon__inner__item: a.accordeon__inner__link(href="#{js}") accordeon inner link 2
li.accordeon__inner__item: a.accordeon__inner__link(href="#{js}") accordeon inner link 3
li.accordeon__item
Jade:
section.panel
h3.panel__title panel title
p.panel__text Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maxime, dicta.
a.panel__button(href="#{js}") read more
Stylus:
.panel
width 400px
margin auto
@gearmobile
gearmobile / page-header
Created May 30, 2015 11:49
Page Header
Jade:
header.header
a.header__logo(href="#{js}")
h1.header__title page header
=' '
small.header__subtext subtext of page header
Stylus:
.header
@gearmobile
gearmobile / Horizontal-Dropdown-Menu via padding-bottom
Created May 30, 2015 19:19
Horizontal Dropdown Menu via padding-bottom
Jade:
ul.menu
li.menu__item
a.menu__link(href="#") menu item
li.menu__item
a.menu__link(href="#") menu item
li.menu__item
a.menu__link(href="#") menu item
ul.submenu
li.submenu__item
@gearmobile
gearmobile / Horizontal Dropdown Menu via margin-top
Created May 30, 2015 19:25
Horizontal Dropdown Menu via margin-top
Jade:
ul.menu
li.menu__item
a.menu__link(href="#") menu item
li.menu__item
a.menu__link(href="#") menu item
li.menu__item
a.menu__link(href="#") menu item
li.menu__item
a.menu__link(href="#") menu item