Skip to content

Commit

Permalink
Deploying to gh-pages from @ 6cb96f1 🚀
Browse files Browse the repository at this point in the history
  • Loading branch information
@scopewu
scopewu committed Oct 22, 2024
0 parents commit 18c033e
Show file tree
Hide file tree
Showing 5 changed files with 357 additions and 0 deletions.
1 change: 1 addition & 0 deletions CNAME
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
qr-vue.tie.pub
342 changes: 342 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,342 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
/>
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<title>qrcode.vue - A Vue.js component to generate QRCode</title>
<meta name="author" content="@scopewu" />
<meta name="Keywords" content="qrcode.vue,qrcode,component" />
<meta
name="description"
content="qrcode.vue - A Vue.js component for QRCode."
/>
<link rel="canonical" href="https://qr-vue.tie.pub" />
<meta property="og:site_name" content="qrcode.vue" />
<meta property="og:type" content="website" />
<meta property="og:title" content="QRCode Vue" />
<meta property="og:description" content="qrcode.vue - A Vue.js component to generate QRCode" />
<meta property="og:url" content="https://qr-vue.tie.pub" />

<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="QRCode Vue" />
<meta name="twitter:description" content="qrcode.vue - A Vue.js component to generate QRCode" />
<meta name="twitter:url" content="https://qr-vue.tie.pub" />
<meta name="twitter:label1" content="Written by" />
<meta name="twitter:data1" content="scopewu" />
<meta name="twitter:creator" content="@ngwwj" />
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<style>
body {
font: 16px/1.5 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB',
'Microsoft YaHei', SimSun, sans-serif;
color: #333;
}

h1 {
margin-bottom: 0.67em;
}

.fork {
width: 150px;
height: 150px;
position: absolute;
top: 0;
right: 0;
}
.fork img {
max-width: 100%;
}

.qrcode-wrap.border {
display: inline-block;
border-width: 6px !important;
}

.qrcode {
vertical-align: middle;
}

@media screen and (min-width: 768px) {
.container-fluid {
max-width: 798px;
}
}

@media screen and (max-width: 470px) {
h1 {
font-size: 26px;
}

.fork {
width: 100px;
height: 100px;
}
}
.widget a {
text-decoration: none;
outline: 0
}

.widget {
display: inline-block;
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;
font-size: 0;
line-height: 0;
white-space: nowrap
}

.btn, .social-count {
position: relative;
display: inline-flex;
height: 20px;
padding: 2px 5px;
font-size: 11px;
font-weight: 600;
line-height: 14px;
vertical-align: bottom;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-repeat: repeat-x;
background-position: -1px -1px;
background-size: 110% 110%;
border: 1px solid
}

.btn {
border-radius: .25em
}

.btn:not(:last-child) {
border-radius: .25em 0 0 .25em
}

.social-count {
border-left: 0;
border-radius: 0 .25em .25em 0
}

.widget-lg .btn, .widget-lg .social-count {
height: 16px;
padding: 5px 10px;
font-size: 12px;
line-height: 16px
}

.octicon {
display: inline-block;
vertical-align: text-top;
fill: currentColor;
overflow: visible
}

.btn {
color: #24292f;
background-color: #ebf0f4;
border-color: #ccd1d5;
border-color: rgba(27, 31, 36, .15);
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg'%3e%3clinearGradient id='o' x2='0' y2='1'%3e%3cstop stop-color='%23f6f8fa'/%3e%3cstop offset='90%25' stop-color='%23ebf0f4'/%3e%3c/linearGradient%3e%3crect width='100%25' height='100%25' fill='url(%23o)'/%3e%3c/svg%3e");
background-image: -moz-linear-gradient(top, #f6f8fa, #ebf0f4 90%);
background-image: linear-gradient(180deg, #f6f8fa, #ebf0f4 90%);
filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#FFF6F8FA', endColorstr='#FFEAEFF3')
}

:root .btn {
filter: none
}

.btn:focus, .btn:hover {
background-color: #e9ebef;
background-position: 0 -0.5em;
border-color: #caccd1;
border-color: rgba(27, 31, 36, .15);
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg'%3e%3clinearGradient id='o' x2='0' y2='1'%3e%3cstop stop-color='%23f3f4f6'/%3e%3cstop offset='90%25' stop-color='%23e9ebef'/%3e%3c/linearGradient%3e%3crect width='100%25' height='100%25' fill='url(%23o)'/%3e%3c/svg%3e");
background-image: -moz-linear-gradient(top, #f3f4f6, #e9ebef 90%);
background-image: linear-gradient(180deg, #f3f4f6, #e9ebef 90%);
filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#FFF3F4F6', endColorstr='#FFE8EAEE')
}

:root .btn:focus, :root .btn:hover {
filter: none
}

.btn:active {
background-color: #e5e9ed;
border-color: #c7cbcf;
border-color: rgba(27, 31, 36, .15);
box-shadow: inset 0 .15em .3em rgba(27, 31, 36, .15);
background-image: none;
filter: none
}

.social-count {
color: #24292f;
background-color: #fff;
border-color: #ddddde;
border-color: rgba(27, 31, 36, .15)
}

.social-count:focus, .social-count:hover {
color: #0969da
}

.octicon-heart {
color: #bf3989
}
.space-x-2 :not(:first-of-type){
margin-left: 0.5rem;
}
[v-cloak] {
display: none;
}
</style>
<script type="module" src="https://cdn.jsdelivr.net/gh/scopewu/qrcode.vue@gh-pages/static/js/244.0608197f.js"></script><script type="module" src="https://cdn.jsdelivr.net/gh/scopewu/qrcode.vue@gh-pages/static/js/index.792f9eb1.js"></script></head>
<body>
<div id="root">
<div class="container-fluid mb-5">
<header class="border-bottom mt-4 mb-3 pb-2">
<div class='row align-items-center my-3'>
<h1 class='col-sm-8 m-0'>qrcode.vue:</h1>
<div class='col-4 space-x-2 text-end'>
<a
href='https://github.com/scopewu/qrcode.vue'
class='link-dark link-underline-opacity-25 link-underline-opacity-100-hover'
>GitHub</a>
<a
href='https://tie.pub'
class='link-dark link-underline-opacity-25 link-underline-opacity-100-hover'
target='_blank'
rel='noopener'
>Author</a>
</div>
</div>
<div class='row'>
<div class='col-4'>
<div class="widget" v-cloak>
<a class="btn" href="https://github.com/scopewu/qrcode.vue" rel="noopener" target="_blank" aria-label="Star qrcode.vue on GitHub">
<svg viewBox="0 0 16 16" width="14" height="14" class="octicon octicon-mark-github" aria-hidden="true">
<path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path>
</svg>
<span>&nbsp;</span>
<span>Star</span>
</a>
<a class="social-count" href="https://github.com/scopewu/qrcode.vue/stargazers" rel="noopener" target="_blank" :aria-label="`${stargazersCount} stargazers on GitHub`">{{ stargazersCount }}</a>
</div>
</div>
</div>
</header>
<form v-cloak>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">Value:</label>
<div class="col-sm-10">
<textarea v-model="value" class="form-control" rows="3"></textarea>
</div>
</div>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">Size:</label>
<div class="col-sm-10">
<div class='row'>
<div class='col-8'>
<input
type="range"
v-model="size"
min="100"
max="800"
step="20"
class="form-range"
/>
</div>
<div class='col-auto'>{{size}}</div>
</div>
</div>
</div>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">Margin:</label>
<div class="col-sm-10">
<div class='row'>
<div class='col-8'>
<input
type="range"
v-model="margin"
min="0"
max="10"
step='1'
class="form-range"
/>
</div>
<div class='col-auto'>{{margin}}</div>
</div>
</div>
</div>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">Level:</label>
<div class="col-sm-10">
<select v-model="level" class="form-select">
<option value="L">L</option>
<option value="M">M</option>
<option value="Q">Q</option>
<option value="H">H</option>
</select>
</div>
</div>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">renderAs:</label>
<div class="col-sm-10">
<select v-model="renderAs" class="form-select">
<option value="svg">svg</option>
<option value="canvas">canvas</option>
</select>
</div>
</div>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">Background:</label>
<div class="col-sm-10">
<input type="color" class="border border-3 rounded" v-model="background">
</div>
</div>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">Foreground:</label>
<div class="col-sm-10">
<input type="color" class="border border-3 rounded" v-model="foreground">
</div>
</div>
<div class="row mb-3">
<label class="col-sm-2 col-form-label">QR_CODE:</label>
<div class="col-sm-10">
<div class="form-control-static">
<div class="border qrcode-wrap">
<qrcode-vue
class="qrcode"
:value="value"
:margin='Number(margin)'
:render-as="renderAs"
:size="Number(size)"
:level="level"
:background="background"
:foreground='foreground'
:image-settings='imageSettings'
></qrcode-vue>
</div>
</div>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
6 changes: 6 additions & 0 deletions static/js/244.0608197f.js

Large diffs are not rendered by default.

7 changes: 7 additions & 0 deletions static/js/244.0608197f.js.LICENSE.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
/*! #__NO_SIDE_EFFECTS__ */

/**
* vue v3.5.12
* (c) 2018-present Yuxi (Evan) You and Vue contributors
* @license MIT
**/
Loading

0 comments on commit 18c033e

Please sign in to comment.