Skip to content

Commit

Permalink
2-space tabs
Browse files Browse the repository at this point in the history
  • Loading branch information
adamschwartz committed Sep 12, 2016
1 parent 614c785 commit 0c8c8f1
Show file tree
Hide file tree
Showing 7 changed files with 303 additions and 303 deletions.
2 changes: 1 addition & 1 deletion LICENSE.txt
Original file line number Diff line number Diff line change
Expand Up @@ -5,4 +5,4 @@ Permission is hereby granted, free of charge, to any person obtaining a copy of

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
74 changes: 37 additions & 37 deletions demo/css/demo.css
Original file line number Diff line number Diff line change
@@ -1,63 +1,63 @@
.carbonads-wrapper {
box-sizing: border-box;
display: inline-block;
background: #eee;
font-family: "Avenir Next", "Helevetica Neue", Helevetica, Arial, sans-serif;
margin-top: 50px;
box-sizing: border-box;
display: inline-block;
background: #eee;
font-family: "Avenir Next", "Helevetica Neue", Helevetica, Arial, sans-serif;
margin-top: 50px;
}

.carbonads-wrapper * {
box-sizing: inherit;
box-sizing: inherit;
}

#carbonads {
width: 162px;
display: block;
overflow: hidden;
line-height: 1.33;
width: 162px;
padding: 11px 16px 0;
max-width: 100%;
font-size: 12px;
background: #eee;
margin: 0 auto;
width: 162px;
display: block;
overflow: hidden;
line-height: 1.33;
width: 162px;
padding: 11px 16px 0;
max-width: 100%;
font-size: 12px;
background: #eee;
margin: 0 auto;
}

#carbonads span {
position: relative;
display: block;
overflow: hidden;
position: relative;
display: block;
overflow: hidden;
}

.carbon-img, .carbon-img img {
display: block;
width: 130px;
height: 100px;
display: block;
width: 130px;
height: 100px;
}

.carbon-img {
margin-bottom: 7px;
background: #ccc;
margin-bottom: 7px;
background: #ccc;
}

.carbon-img img {
background: #fff;
background: #fff;
}

.carbon-text {
color: inherit;
display: block;
float: left;
text-align: left;
text-decoration: none;
color: inherit;
display: block;
float: left;
text-align: left;
text-decoration: none;
}

.carbon-poweredby {
color: #b9b9b9;
text-decoration: none;
display: block;
text-align: left;
font-size: 10px;
margin-top: 2px;
margin-bottom: 11px;
color: #b9b9b9;
text-decoration: none;
display: block;
text-align: left;
font-size: 10px;
margin-top: 2px;
margin-bottom: 11px;
}
156 changes: 78 additions & 78 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,88 +3,88 @@
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Chrome Tabs</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="demo/css/demo.css">
<link rel="stylesheet" href="css/chrome-tabs.css">
<link rel="stylesheet" href="css/chrome-tabs-dark-theme.css">
</head>
<body>
<div class="chrome-tabs-shell">
<div class="chrome-tabs">
<div class="chrome-tab">
<div class="chrome-tab-favicon" style="background-image: url('demo/images/google-favicon.png')"></div>
<div class="chrome-tab-title">Google</div>
<div class="chrome-tab-close"></div>
<div class="chrome-tab-curves">
<div class="chrome-tab-curves-left-shadow"></div>
<div class="chrome-tab-curves-left-highlight"></div>
<div class="chrome-tab-curves-left"></div>
<div class="chrome-tab-curves-right-shadow"></div>
<div class="chrome-tab-curves-right-highlight"></div>
<div class="chrome-tab-curves-right"></div>
</div>
</div>
<div class="chrome-tab chrome-tab-current">
<div class="chrome-tab-favicon" style="background-image: url('demo/images/facebook-favicon.ico')"></div>
<div class="chrome-tab-title">Facebook</div>
<div class="chrome-tab-close"></div>
<div class="chrome-tab-curves">
<div class="chrome-tab-curves-left-shadow"></div>
<div class="chrome-tab-curves-left-highlight"></div>
<div class="chrome-tab-curves-left"></div>
<div class="chrome-tab-curves-right-shadow"></div>
<div class="chrome-tab-curves-right-highlight"></div>
<div class="chrome-tab-curves-right"></div>
</div>
</div>
</div>
<div class="chrome-shell-bottom-bar"></div>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Chrome Tabs</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="demo/css/demo.css">
<link rel="stylesheet" href="css/chrome-tabs.css">
<link rel="stylesheet" href="css/chrome-tabs-dark-theme.css">
</head>
<body>
<div class="chrome-tabs-shell">
<div class="chrome-tabs">
<div class="chrome-tab">
<div class="chrome-tab-favicon" style="background-image: url('demo/images/google-favicon.png')"></div>
<div class="chrome-tab-title">Google</div>
<div class="chrome-tab-close"></div>
<div class="chrome-tab-curves">
<div class="chrome-tab-curves-left-shadow"></div>
<div class="chrome-tab-curves-left-highlight"></div>
<div class="chrome-tab-curves-left"></div>
<div class="chrome-tab-curves-right-shadow"></div>
<div class="chrome-tab-curves-right-highlight"></div>
<div class="chrome-tab-curves-right"></div>
</div>
</div>
<div class="chrome-tab chrome-tab-current">
<div class="chrome-tab-favicon" style="background-image: url('demo/images/facebook-favicon.ico')"></div>
<div class="chrome-tab-title">Facebook</div>
<div class="chrome-tab-close"></div>
<div class="chrome-tab-curves">
<div class="chrome-tab-curves-left-shadow"></div>
<div class="chrome-tab-curves-left-highlight"></div>
<div class="chrome-tab-curves-left"></div>
<div class="chrome-tab-curves-right-shadow"></div>
<div class="chrome-tab-curves-right-highlight"></div>
<div class="chrome-tab-curves-right"></div>
</div>
</div>
</div>
<div class="chrome-shell-bottom-bar"></div>
</div>

<br>
<br>

<p><button>Toggle dark theme</button></p>
<p><button>Toggle dark theme</button></p>

<div class="carbonads-wrapper">
<script async="true" id="_carbonads_js" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=adamschwartzco"></script>
</div>
<div class="carbonads-wrapper">
<script async="true" id="_carbonads_js" src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=adamschwartzco"></script>
</div>

<script src="js/deps/jquery.min.js"></script>
<script src="js/deps/jquery-ui.min.js"></script>
<script src="js/chrome-tabs.js"></script>
<script>
var $chromeTabsExampleShell = $('.chrome-tabs-shell')
chromeTabs.init({
$shell: $chromeTabsExampleShell,
minWidth: 45,
maxWidth: 160
});
chromeTabs.addNewTab($chromeTabsExampleShell, {
favicon: 'demo/images/eager-favicon.ico',
title: 'Eager',
data: {
timeAdded: +new Date()
}
});
$chromeTabsExampleShell.bind('chromeTabRender', function(){
var $currentTab = $chromeTabsExampleShell.find('.chrome-tab-current');
if ($currentTab.length && window['console'] && console.log) {
console.log('Current tab index', $currentTab.index(), 'title', $.trim($currentTab.text()), 'data', $currentTab.data('tabData').data);
}
});
<script src="js/deps/jquery.min.js"></script>
<script src="js/deps/jquery-ui.min.js"></script>
<script src="js/chrome-tabs.js"></script>
<script>
var $chromeTabsExampleShell = $('.chrome-tabs-shell')
chromeTabs.init({
$shell: $chromeTabsExampleShell,
minWidth: 45,
maxWidth: 160
});
chromeTabs.addNewTab($chromeTabsExampleShell, {
favicon: 'demo/images/eager-favicon.ico',
title: 'Eager',
data: {
timeAdded: +new Date()
}
});
$chromeTabsExampleShell.bind('chromeTabRender', function(){
var $currentTab = $chromeTabsExampleShell.find('.chrome-tab-current');
if ($currentTab.length && window['console'] && console.log) {
console.log('Current tab index', $currentTab.index(), 'title', $.trim($currentTab.text()), 'data', $currentTab.data('tabData').data);
}
});

$('button').click(function(){
if ($chromeTabsExampleShell.hasClass('chrome-tabs-dark-theme')) {
$chromeTabsExampleShell.removeClass('chrome-tabs-dark-theme');
} else {
$chromeTabsExampleShell.addClass('chrome-tabs-dark-theme');
}
});
</script>
</body>
$('button').click(function(){
if ($chromeTabsExampleShell.hasClass('chrome-tabs-dark-theme')) {
$chromeTabsExampleShell.removeClass('chrome-tabs-dark-theme');
} else {
$chromeTabsExampleShell.addClass('chrome-tabs-dark-theme');
}
});
</script>
</body>
</html>
Loading

0 comments on commit 0c8c8f1

Please sign in to comment.