Skip to content

Commit 973b909

Browse files
cho45cho45
committed
remove bootstrap
1 parent adaca89 commit 973b909

1 file changed

Lines changed: 118 additions & 9 deletions

File tree

‎demo.html‎

Lines changed: 118 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@
44
<title>Demo of String_random.js</title>
55
<meta charset="utf-8"/>
66
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
7-
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
87

98
<meta name="keywords" content="JavaScript,Library,RegExp,Regular Expression,Random String"/>
109
<meta name="description" content="String_random.js is a library for generating random string from a regular experession."/>
@@ -16,13 +15,123 @@
1615
<meta name="twitter:creator" content="cho45"/>
1716

1817
<style>
19-
body {
20-
padding: 20px 0;
21-
}
22-
23-
.twitter-share-button {
24-
margin-left: 10px;
25-
}
18+
body {
19+
padding: 32px 0;
20+
background: #f8f8fa;
21+
color: #23242a;
22+
font-family: 'Fira Mono', 'Menlo', 'Consolas', 'Monaco', monospace;
23+
}
24+
.container {
25+
max-width: 900px;
26+
margin: 0 auto;
27+
background: #fff;
28+
border-radius: 10px;
29+
box-shadow: 0 4px 24px rgba(0,0,0,0.08);
30+
padding: 32px 32px 24px 32px;
31+
}
32+
h1 {
33+
font-size: 2.2em;
34+
font-weight: bold;
35+
letter-spacing: 0.02em;
36+
color: #ffb86c;
37+
margin-bottom: 0.5em;
38+
}
39+
.lead {
40+
color: #666;
41+
font-size: 1.1em;
42+
margin-bottom: 2em;
43+
}
44+
form {
45+
margin-bottom: 2em;
46+
}
47+
input[name="regexp"] {
48+
font-family: inherit;
49+
font-size: 1.2em;
50+
background: #f8f8fa;
51+
color: #23242a;
52+
border: 1.5px solid #bbb;
53+
border-radius: 6px;
54+
padding: 12px 16px;
55+
margin-bottom: 12px;
56+
transition: border 0.2s;
57+
width: 100%;
58+
box-sizing: border-box;
59+
}
60+
input[name="regexp"]:focus {
61+
border-color: #ffb86c;
62+
outline: none;
63+
}
64+
input[type="submit"], .btn-primary {
65+
background: #ffb86c;
66+
color: #23242a;
67+
border: none;
68+
font-weight: bold;
69+
transition: background 0.2s;
70+
font-size: 1.3em;
71+
padding: 16px 40px;
72+
border-radius: 8px;
73+
box-shadow: 0 2px 8px rgba(0,0,0,0.07);
74+
margin-bottom: 10px;
75+
}
76+
input[type="submit"]:hover, .btn-primary:hover {
77+
background: #ffa94d;
78+
}
79+
#examples {
80+
margin-top: 10px;
81+
font-size: 0.98em;
82+
color: #0077b6;
83+
}
84+
#examples a {
85+
color: #0077b6;
86+
text-decoration: underline dotted;
87+
margin: 0 2px;
88+
cursor: pointer;
89+
transition: color 0.2s;
90+
}
91+
#examples a:hover {
92+
color: #ffb86c;
93+
}
94+
.jumbotron {
95+
background: #f8f8fa;
96+
border-radius: 8px;
97+
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
98+
padding: 40px 20px 20px 20px;
99+
}
100+
.jumbotron p {
101+
font-size: 1.1em;
102+
background: #fffbe6;
103+
border-left: 4px solid #ffb86c;
104+
padding: 8px 16px;
105+
margin-bottom: 18px;
106+
border-radius: 4px;
107+
word-break: break-all;
108+
color: #23242a;
109+
font-family: inherit;
110+
}
111+
.twitter-share-button {
112+
margin-left: 10px;
113+
background: #1da1f2;
114+
color: #fff !important;
115+
border-radius: 4px;
116+
padding: 2px 10px;
117+
font-size: 0.95em;
118+
text-decoration: none;
119+
transition: background 0.2s;
120+
border: none;
121+
display: inline-block;
122+
}
123+
.twitter-share-button:hover {
124+
background: #0d8ddb;
125+
}
126+
@media (max-width: 900px) {
127+
.container {
128+
max-width: 100vw;
129+
padding: 12px 2vw 12px 2vw;
130+
}
131+
.jumbotron {
132+
padding: 24px 4vw 12px 4vw;
133+
}
134+
}
26135
</style>
27136
</head>
28137
<body>
@@ -35,7 +144,7 @@ <h1>Demo of String_random.js</h1>
35144

36145
<form style="text-align: center; padding: 30px 0" class="">
37146
<div class="form-group">
38-
<input type="text" name="regexp" placeholder="RegExp" class="form-control input-lg" style="" required/>
147+
<input type="text" name="regexp" placeholder="RegExp" class="form-control input-lg" required/>
39148
</div>
40149
<input type="submit" value="Generate" class="btn btn-primary btn-lg"/>
41150
<div id="examples">

0 commit comments

Comments
 (0)