Skip to content

Instantly share code, notes, and snippets.

@maylogger
maylogger / SassMeister-input.scss
Created March 17, 2014 15:31
Generated by SassMeister.com.
// ----
// Sass (v3.3.3)
// Compass (v1.0.0.alpha.18)
// Breakpoint (v2.4.2)
// ----
@import "breakpoint";
// 設定要有 fallback
$breakpoint-no-query-fallbacks: true;
.bottom-nav { font-family: helvetica, arial, sans-serif; position: fixed; left: 0; bottom: 0; width: 100%; height: 80px; background: rgba(0, 0, 0, 0.8); color: white; }
.bottom-nav ul, .bottom-nav li { margin: 0; padding: 0; border: 0; list-style: none; }
.bottom-nav a { color: white; color: inherit; text-decoration: inherit; cursor: inherit; font-size: 13px; line-height: 1.5; }
.bottom-nav a:active, .bottom-nav a:focus { outline: none; }
.bottom-nav .bottom-nav-item { position: relative; text-align: center; width: 7em; float: left; padding-top: 1em; }
.bottom-nav .sub-menu { position: absolute; bottom: 100%; left: 0; width: 100%; height: 0px; opacity: .75; overflow: hidden; margin: 0 -99999px 0; padding: 0 99999px 0; background: rgba(0, 0, 0, 0.8); -webkit-transition: 1s; -moz-transition: 1s; -o-transition: 1s; transition: 1s; }
.bottom-nav .sub-menu a { display: block; padding: 3px; }
.bottom-nav .sub-menu a:hover { text-decoration: none; background: #de9c31; }
.bottom-nav .sub-menu li:first-child { margin-
@maylogger
maylogger / config.rb
Created September 3, 2013 01:46
slim setting
# Require any additional compass plugins here.
require 'slim'
Slim::Engine.set_default_options :pretty => true, :disable_escape => true, :format => :html5
{block:IndexPage}
{block:Pagination}
<div id="pagination">
{block:PreviousPage}
<a href="{PreviousPage}" class="previous" data-current-page="{CurrentPage}" data-total-pages="{TotalPages}">上一頁<span class="bg"></span></a>
{/block:PreviousPage}
{block:NextPage}
<a href="{NextPage}" class="next" data-current-page="{CurrentPage}" data-total-pages="{TotalPages}">下一頁<span class="bg"></span></a>
{/block:NextPage}
<div class="loader"></div>
@maylogger
maylogger / gist:6380829
Created August 29, 2013 17:13
sublime text 最新設定
{
"theme": "Flatland Dark.sublime-theme",
"color_scheme": "Packages/Theme - Flatland/Flatland Dark.tmTheme",
"flatland_sidebar_tree_large": true,
"close_windows_when_empty": false,
"detect_indentation": false,
"disable_formatted_linebreak": true,
"drag_text": false,
"draw_minimap_border": true,
"draw_white_space": true,
$context: 6;
@include span-columns($context);
@for $width from 1 through 3 {
@for $height from 1 through 3 {
.block-#{$width}-#{$height} {
@include span-columns($width * 2, $context);
padding-top: columns($height * 2, $context);
}
}
}
$total-columns : 12;
$column-width : 4em;
$gutter-width : 1em;
$grid-padding : $gutter-width;
@maylogger
maylogger / QR-bookmarklet.js
Created May 21, 2013 06:25
url convert to QR code bookmarklet
javascript:void(window.open('http://chart.apis.google.com/chart?cht=qr&chs=300x300&chl='+encodeURIComponent(location.href),'Qr%20code','top=100,left=200,width=350,height=350,status=yes'));
@maylogger
maylogger / _replace-text-with-svg.scss
Last active December 16, 2015 13:39
這是一個 compass mixin 會使用 SVG 檔案取代文字,不支援 SVG 的瀏覽器自動使用備援 PNG 代替。
@mixin replace-text-with-svg($svg-name, $png-name: $svg-name) {
@include replace-text-with-dimensions($png-name + ".png");
background-image: none, image-url($svg-name + ".svg");
}
@maylogger
maylogger / isMobile.js
Created March 13, 2013 12:54
偵測是否為手機
function isMobile(){
return (
(navigator.userAgent.match(/Android/i)) ||
(navigator.userAgent.match(/webOS/i)) ||
(navigator.userAgent.match(/iPhone/i)) ||
(navigator.userAgent.match(/iPod/i)) ||
(navigator.userAgent.match(/iPad/i)) ||
(navigator.userAgent.match(/BlackBerry/))
);
}