97 lines
6.1 KiB
HTML
97 lines
6.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Ultimate Hacking Keyboard Configurator</title>
|
|
<link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet">
|
|
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link href="css/app.css" rel="stylesheet">
|
|
<link href="css/macro.css" rel="stylesheet">
|
|
<link href="css/style.css" rel="stylesheet">
|
|
<script src="node_modules/jquery/dist/jquery.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="macro--edit main-content__inner">
|
|
<div class="row">
|
|
<h1 class="col-xs-12 pane-title">
|
|
<i class="fa fa-play"></i>
|
|
<span class="macro__name pane-title__name" contenteditable="true">Macro1</span> <i class="fa"></i>
|
|
</h1>
|
|
</div>
|
|
<div class="row">
|
|
<div id="listWithHandle" class="list-group col-xs-10 col-xs-offset-1">
|
|
<div class="list-group-item action--item">
|
|
<span class="glyphicon glyphicon-option-vertical move-handle" aria-hidden="true"></span>
|
|
<i class="fa fa-mouse-pointer"></i> Move pointer by 100px leftward
|
|
<i class="glyphicon glyphicon-pencil action--edit"></i>
|
|
<i class="glyphicon glyphicon-trash action--trash"></i>
|
|
</div>
|
|
<div class="list-group-item macro-settings" style="display: none;">
|
|
<div class="helper"></div>
|
|
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut
|
|
labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
|
|
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
|
|
sit amet.</p>
|
|
<div class="row">
|
|
<div class="col-sm-12 flex-button-wrapper">
|
|
<button class="btn btn-primary btn-sm pull-right flex-button settings-save">Save</button>
|
|
<button class="btn btn-default btn-sm pull-right flex-button settings-cancel" style="margin-right: .5em;">Cancel</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="list-group-item action--item">
|
|
<span class="glyphicon glyphicon-option-vertical move-handle" aria-hidden="true"></span>
|
|
<i class="fa fa-square"></i> Press letter A
|
|
<i class="glyphicon glyphicon-pencil action--edit"></i>
|
|
<i class="glyphicon glyphicon-trash action--trash"></i>
|
|
</div>
|
|
<div class="list-group-item action--item">
|
|
<span class="glyphicon glyphicon-option-vertical move-handle" aria-hidden="true"></span>
|
|
<i class="fa fa-square"></i> Press Alt+Tab
|
|
<i class="glyphicon glyphicon-pencil action--edit"></i>
|
|
<i class="glyphicon glyphicon-trash action--trash"></i>
|
|
</div>
|
|
<div class="list-group-item action--item">
|
|
<span class="glyphicon glyphicon-option-vertical move-handle" aria-hidden="true"></span>
|
|
<i class="fa fa-clock-o"></i> Delay of 235ms
|
|
<i class="glyphicon glyphicon-pencil action--edit"></i>
|
|
<i class="glyphicon glyphicon-trash action--trash"></i>
|
|
</div>
|
|
<div class="list-group-item action--item">
|
|
<span class="glyphicon glyphicon-option-vertical move-handle" aria-hidden="true"></span>
|
|
<i class="fa fa-mouse-pointer"></i> Press button 1
|
|
<i class="glyphicon glyphicon-pencil action--edit"></i>
|
|
<i class="glyphicon glyphicon-trash action--trash"></i>
|
|
</div>
|
|
<div class="list-group-item action--item">
|
|
<span class="glyphicon glyphicon-option-vertical move-handle" aria-hidden="true"></span>
|
|
<i class="fa fa-mouse-pointer"></i> Scroll by 150px downward
|
|
<i class="glyphicon glyphicon-pencil action--edit"></i>
|
|
<i class="glyphicon glyphicon-trash action--trash"></i>
|
|
</div>
|
|
<div class="list-group-item action--item add-new__action-item no-reorder">
|
|
<a href="#" class="add-new__action-item--link"><i class="fa fa-plus"></i> Add new action item</a>
|
|
</div>
|
|
<div class="list-group-item new-macro-settings">
|
|
<div class="helper"></div>
|
|
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut
|
|
labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo
|
|
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor
|
|
sit amet.</p>
|
|
<div class="row">
|
|
<div class="col-sm-12 flex-button-wrapper">
|
|
<button class="btn btn-primary btn-sm pull-right flex-button settings-save">Save</button>
|
|
<button class="btn btn-default btn-sm pull-right flex-button settings-cancel" style="margin-right: .5em;">Cancel</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
|
<script src="node_modules/sortablejs/Sortable.js"></script>
|
|
<script src="node_modules/select2/dist/js/select2.min.js"></script>
|
|
<script src="macro.js"></script>
|
|
</body>
|
|
</html> |