Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
126 changes: 70 additions & 56 deletions case.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,7 @@

<!-- Le styles -->
<link type="text/css" rel="stylesheet" href="css/jquery.miniColors.css" />
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script type="text/javascript">
</script>
<style type="text/css">
Expand All @@ -30,10 +29,6 @@
border-top: 1px solid #E5E5E5;
background-color: whiteSmoke;
}
body {
padding-top: 60px;
/* background-color: #000000; */
}
.color-preview {
border: 1px solid #CCC;
margin: 2px;
Expand Down Expand Up @@ -73,8 +68,26 @@
<body class="preview" data-spy="scroll" data-target=".subnav" data-offset="80">

<!-- Navbar
================================================== -->
<div class="navbar navbar-fixed-top">
================================================== -->
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Custom T-Shirt</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="index.html">T-Shirt</a></li>
</ul>
</div>
</div>
</nav>
<!-- <div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
Expand All @@ -90,7 +103,7 @@
</div>
</div>
</div>
</div>
</div> -->

<div class="container">
<section id="typography">
Expand All @@ -100,7 +113,7 @@ <h1>iPhone Case</h1>

<!-- Headings & Paragraph Copy -->
<div class="row">
<div class="span3">
<div class="col-md-3">

<div class="tabbable"> <!-- Only required for left/right tabs -->
<ul class="nav nav-tabs">
Expand All @@ -112,47 +125,48 @@ <h1>iPhone Case</h1>
<div class="well">
<!-- <h3>Tee Styles</h3>-->
<!-- <p>-->
<select id="phoneTypes">
<select id="phoneTypes" class="form-control">
<option value="1" selected="selected">iPhone 5</option>
<option value="2">iPhone 4</option>
<option value="3">Samsumg III</option>
</select>
<!-- </p>-->
</div>
<div class="well">
<ul class="nav">
<li class="color-preview" title="White" style="background-color:#ffffff;"></li>
<li class="color-preview" title="Dark Heather" style="background-color:#616161;"></li>
<li class="color-preview" title="Gray" style="background-color:#f0f0f0;"></li>
<li class="color-preview" title="Charcoal" style="background-color:#5b5b5b;"></li>
<li class="color-preview" title="Black" style="background-color:#222222;"></li>
<li class="color-preview" title="Heather Orange" style="background-color:#fc8d74;"></li>
<li class="color-preview" title="Heather Dark Chocolate" style="background-color:#432d26;"></li>
<li class="color-preview" title="Salmon" style="background-color:#eead91;"></li>
<li class="color-preview" title="Chesnut" style="background-color:#806355;"></li>
<li class="color-preview" title="Dark Chocolate" style="background-color:#382d21;"></li>
<li class="color-preview" title="Citrus Yellow" style="background-color:#faef93;"></li>
<li class="color-preview" title="Avocado" style="background-color:#aeba5e;"></li>
<li class="color-preview" title="Kiwi" style="background-color:#8aa140;"></li>
<li class="color-preview" title="Irish Green" style="background-color:#1f6522;"></li>
<li class="color-preview" title="Scrub Green" style="background-color:#13afa2;"></li>
<li class="color-preview" title="Teal Ice" style="background-color:#b8d5d7;"></li>
<li class="color-preview" title="Heather Sapphire" style="background-color:#15aeda;"></li>
<li class="color-preview" title="Sky" style="background-color:#a5def8;"></li>
<li class="color-preview" title="Antique Sapphire" style="background-color:#0f77c0;"></li>
<li class="color-preview" title="Heather Navy" style="background-color:#3469b7;"></li>
<li class="color-preview" title="Cherry Red" style="background-color:#c50404;"></li>
</ul>
<span>
<span class="color-preview" title="White" style="background-color:#ffffff;"></span>
<span class="color-preview" title="Dark Heather" style="background-color:#616161;"></span>
<span class="color-preview" title="Gray" style="background-color:#f0f0f0;"></span>
<span class="color-preview" title="Charcoal" style="background-color:#5b5b5b;"></span>
<span class="color-preview" title="Black" style="background-color:#222222;"></span>
<span class="color-preview" title="Heather Orange" style="background-color:#fc8d74;"></span>
<span class="color-preview" title="Heather Dark Chocolate" style="background-color:#432d26;"></span>
<span class="color-preview" title="Salmon" style="background-color:#eead91;"></span>
<span class="color-preview" title="Chesnut" style="background-color:#806355;"></span>
<span class="color-preview" title="Dark Chocolate" style="background-color:#382d21;"></span>
<span class="color-preview" title="Citrus Yellow" style="background-color:#faef93;"></span>
<span class="color-preview" title="Avocado" style="background-color:#aeba5e;"></span>
<span class="color-preview" title="Kiwi" style="background-color:#8aa140;"></span>
<span class="color-preview" title="Irish Green" style="background-color:#1f6522;"></span>
<span class="color-preview" title="Scrub Green" style="background-color:#13afa2;"></span>
<span class="color-preview" title="Teal Ice" style="background-color:#b8d5d7;"></span>
<span class="color-preview" title="Heather Sapphire" style="background-color:#15aeda;"></span>
<span class="color-preview" title="Sky" style="background-color:#a5def8;"></span>
<span class="color-preview" title="Antique Sapphire" style="background-color:#0f77c0;"></span>
<span class="color-preview" title="Heather Navy" style="background-color:#3469b7;"></span>
<span class="color-preview" title="Cherry Red" style="background-color:#c50404;"></span>
</span>
</div>
</div>
<div class="tab-pane" id="tab2">
<div class="well" style="height:400px;">
<div class="input-append">
<input class="span2" id="text-string" type="text" placeholder="add text here..."><button id="add-text" class="btn" title="Add text"><i class="icon-share-alt"></i></button>
<hr>
<button class="btn btn-primary">Upload</button>
<hr>
</div>
<div class="well">
<div class="input-group">
<input id="text-string" type="text" class="form-control" placeholder="add text here...">
<span class="input-group-btn">
<button id="add-text" class="btn btn-default" type="button" title="Add text"><i class="glyphicon glyphicon-share-alt"></i></button>
</span>
</div>
<hr>
<img style="cursor:pointer;width:90px;height:120px;" class="img-polaroid" src="img/phones/designs/1.jpg">
<img style="cursor:pointer;width:90px;height:120px;" class="img-polaroid" src="img/phones/designs/7.jpg">
<img style="cursor:pointer;width:90px;height:120px;" class="img-polaroid" src="img/phones/designs/8.jpg">
Expand All @@ -166,11 +180,11 @@ <h1>iPhone Case</h1>
</div>
</div>
</div>
<div class="span6">
<div class="col-md-6">
<div align="center" style="min-height: 32px;">
<div class="clearfix">
<div class="btn-group inline pull-left" id="texteditor" style="display:none;">
<button id="font-family" class="btn dropdown-toggle" data-toggle="dropdown" title="Font Style"><i class="icon-font" style="width:19px;height:19px;"></i></button>
<button id="font-family" class="btn btn-default" data-toggle="dropdown" title="Font Style"><i class="glyphicon glyphicon-font" style="width:19px;height:19px;"></i></button>
<ul class="dropdown-menu" role="menu" aria-labelledby="font-family-X">
<li><a tabindex="-1" href="#" onclick="setFont('Arial');" class="Arial">Arial</a></li>
<li><a tabindex="-1" href="#" onclick="setFont('Helvetica');" class="Helvetica">Helvetica</a></li>
Expand All @@ -187,27 +201,27 @@ <h1>iPhone Case</h1>
<li><a tabindex="-1" href="#" onclick="setFont('Plaster');" class="Plaster">Plaster</a></li>
<li><a tabindex="-1" href="#" onclick="setFont('Engagement');" class="Engagement">Engagement</a></li>
</ul>
<button id="text-bold" class="btn" data-original-title="Bold"><img src="img/font_bold.png" height="" width=""></button>
<button id="text-italic" class="btn" data-original-title="Italic"><img src="img/font_italic.png" height="" width=""></button>
<button id="text-strike" class="btn" title="Strike" style=""><img src="img/font_strikethrough.png" height="" width=""></button>
<button id="text-underline" class="btn" title="Underline" style=""><img src="img/font_underline.png"></button>
<a class="btn" href="#" rel="tooltip" data-placement="top" data-original-title="Font Color"><input type="hidden" id="text-fontcolor" class="color-picker" size="7" value="#000000"></a>
<a class="btn" href="#" rel="tooltip" data-placement="top" data-original-title="Font Border Color"><input type="hidden" id="text-strokecolor" class="color-picker" size="7" value="#000000"></a>
<button id="text-bold" class="btn btn-default" data-original-title="Bold"><img src="img/font_bold.png" height="" width=""></button>
<button id="text-italic" class="btn btn-default" data-original-title="Italic"><img src="img/font_italic.png" height="" width=""></button>
<button id="text-strike" class="btn btn-default" title="Strike" style=""><img src="img/font_strikethrough.png" height="" width=""></button>
<button id="text-underline" class="btn btn-default" title="Underline" style=""><img src="img/font_underline.png"></button>
<a class="btn btn-default" href="#" rel="tooltip" data-placement="top" data-original-title="Font Color"><input type="hidden" id="text-fontcolor" class="color-picker" size="7" value="#000000"></a>
<a class="btn btn-default" href="#" rel="tooltip" data-placement="top" data-original-title="Font Border Color"><input type="hidden" id="text-strokecolor" class="color-picker" size="7" value="#000000"></a>
<!--- Background <input type="hidden" id="text-bgcolor" class="color-picker" size="7" value="#ffffff"> --->
</div>
<div class="pull-right" align="" id="imageeditor" style="display:none;">
<div class="btn-group">
<button class="btn" id="bring-to-front" title="Bring to Front"><i class="icon-fast-backward rotate" style="height:19px;"></i></button>
<button class="btn" id="send-to-back" title="Send to Back"><i class="icon-fast-forward rotate" style="height:19px;"></i></button>
<button id="remove-selected" class="btn" title="Delete selected item"><i class="icon-trash" style="height:19px;"></i></button>
<div class="btn btn-group">
<button class="btn btn-default" id="bring-to-front" title="Bring to Front"><i class="glyphicon glyphicon-step-backward rotate" style="height:19px;"></i></button>
<button class="btn btn-default" id="send-to-back" title="Send to Back"><i class="glyphicon glyphicon-step-forward rotate" style="height:19px;"></i></button>
<button id="remove-selected" class="btn btn-default" title="Delete selected item"><i class="glyphicon glyphicon-trash" style="height:19px;"></i></button>
</div>
</div>
</div>
</div>
<!-- EDITOR -->
<div style="background-color: #ffffff;position: relative; top:20px;height:560px;">
<div id="phoneDiv" class="page" style="width: 282px; height: 590px; position: relative;left:25%; background-color: rgb(255, 255, 255);">
<img id="phone" src="img/phones/iphone5A.png"></img>
<img id="phone" class="img img-responsive" src="img/phones/iphone5A.png"></img>
<div id="drawingArea" style="position: absolute;top:70px;left:30px;z-index: 10;width: 230px; height:450px;">
<canvas id="tcanvas" width=230 height="450" class="hover" style="-webkit-user-select: none;"></canvas>
</div>
Expand All @@ -216,7 +230,7 @@ <h1>iPhone Case</h1>
<!-- /EDITOR -->
</div>

<div class="span3">
<div class="col-md-3">
<div class="well">
<h3>Total Prices</h3>
<p>
Expand All @@ -235,7 +249,7 @@ <h3>Total Prices</h3>
</tr>
</table>
</p>
<button type="button" class="btn btn-large btn-block btn-success" name="addToTheBag" id="addToTheBag">Add to bag <i class="icon-briefcase icon-white"></i></button>
<button type="button" class="btn btn-large btn-block btn-success" name="addToTheBag" id="addToTheBag">Add to bag <i class="glyphicon glyphicon-shopping-cart"></i></button>
</div>
</div>

Expand Down
Loading