codeprint/index.html at master · matatsuna/codeprint · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="shortcut icon" href="./img/favicon.png">

    <title>codePrint | ハイライト付きでソースコードを印刷</title>

    <meta name="description" content="プログラムソースコードをシンタックス付きで見やすくカラーで印刷 javascript,html,php,swift,ruby,python,perl,java,markdown,yamlをハイライト付きで印刷" />
    <meta property="og:url" content="http://service.matatsuna.net/codeprint" />
    <meta property="og:title" content="codePrint | ハイライト付きでソースコードを印刷" />
    <meta property="og:type" content="site" />
    <meta property="og:description" content="プログラムソースコードをシンタックス付きで見やすくカラーで印刷 javascript,html,php,swift,ruby,python,perl,java,markdown,yamlをハイライト付きで印刷" />
    <meta property="og:image" content="https://service.matatsuna.net/codeprint/img/logo_transparent.png" />
    <meta name="twitter:card" content="summary" />
    <meta name="twitter:site" content="@matatsuna" />
    <meta property="og:site_name" content="codePrint | ハイライト付きでソースコードを印刷" />

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--Import Google Icon Font-->
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <!--Import materialize.css-->
    <link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css"
        media="screen,projection" />
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js"></script>
    <script src="./build.js"></script>

    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-62998505-11"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag() { dataLayer.push(arguments); }
        gtag('js', new Date());

        gtag('config', 'UA-62998505-11');
    </script>

    <style>
        .row {
            margin-bottom: 0px;
        }

        body {
            margin: 0px;
            background-color: azure;
        }

        .CodeMirror {
            border-top: 1px solid #eee;
            border-bottom: 1px solid #eee;
            line-height: 1.3;
            height: 100%;
        }

        .CodeMirror-linenumbers {
            padding: 0 8px;
        }

        .code {
            margin: 0px;
            height: 100%;
        }

        @media print {
            .no_print {
                display: none;
            }
        }
    </style>
</head>

<body>

    <div id="mode" class="no_print row">
        <div class="col s1">
            <a href="./">
                <img style="margin-left:10%;width:80px;" src="./img/logo_transparent.png" alt="logo">
            </a>
        </div>
        <div class="col s3"></div>
        <div class="input-field col s4 center">
            <select id=mode-select>
                <option selected>javascript</option>
                <option>html</option>
                <option>php</option>
                <option>swift</option>
                <option>ruby</option>
                <option>python</option>
                <option>perl</option>
                <option>java</option>
                <option>markdown</option>
                <option>yaml</option>
            </select>
            <label>Select a mode</label>
        </div>
        <div class="col s3"></div>
        <div class="col s1">
            <a href="#" class="btn-floating center" style="margin-top:1rem;" onclick="window.print(); return false;">
                <i class="material-icons">print</i>
            </a>
        </div>
    </div>

    <div id="code" class="code"></div>
</body>

</html>