mnafricano

Path 2.0 Flyout Menu using CSS

Demo: http://sparanoid.com/lab/path-menu/

Dribbble page: http://drbl.in/cwcK

Forked from Tunghsiao Liu's Pen Path 2.0 Flyout Menu using CSS .

A Pen by Marcello Africano on CodePen.

mnafricano

#container
  #header
    %span ACTIVITY WIDGET
  #display
    #upper
      %select
        %option Disk space usage
        %option Something else 1
        %option Something else 2
        %option Something else 3

mnafricano

html{
  background:#f1c40f;
}

#needle{
  transform-origin: 50% 9% 0;
  width:10em;
  height:2em; 
  animation: jitter 1s ease-in-out infinite; 
  animation-iteration-count: 40;

mnafricano

Turntable.FM Bots

Boombot - https://github.com/TerrordactylDesigns/boombot Chillybot - https://github.com/samuri51/chillybot CMBot - https://github.com/atomjack/cmbot Hashtag Amy - https://github.com/yayramen/hashtag-amy PostRockAndBeyond - https://github.com/swerner/PostRockAndBeyond Robo DJ - https://github.com/mmattozzi/robodj Sparkle Bot - https://github.com/sharedferret/Sparkle-Turntable-Bot Taco Bot - https://github.com/funkytaco/Turntable-API-Taco-Bot

mnafricano

<i class="macbook"></i>

mnafricano

<!-- CSSDeck Logo -->
<div id="circle">
  <div id="ring
  <div id="ring"></div>
</div>

mnafricano

<div class="spinner-wrap">
  <div class="spinner">
    <i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
  </div>
</div>

mnafricano

<i class="macbook"></i>

mnafricano

/**
 * Nice, Simple, Gradient Back
 */

background: #f06;
background: linear-gradient(45deg, #4ff, yellow);
min-height: 100%;

mnafricano

.ch-item {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: relative;
	cursor: default;
	box-shadow:
		inset 0 0 0 0 rgba(200,95,66, 0.4),
		inset 0 0 0 16px rgba(255,255,255,0.6),
		0 1px 2px rgba(0,0,0,0.1);