Skip to content
This repository was archived by the owner on Oct 28, 2022. It is now read-only.

Commit 61f95bb

Browse files
petabytpetabyt
authored
Merge pull request #17 from Daniel4-Scratch/patch-3
Nav bar idea
2 parents 2fe6737 + 9196174 commit 61f95bb

File tree

1 file changed

+146
-2
lines changed

1 file changed

+146
-2
lines changed

‎popup.html‎

Lines changed: 146 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,17 @@
33
<head>
44
</head>
55
<body>
6+
<div class="dash">&nbsp; <b>ScratchFormat 2.2</b>&nbsp;&nbsp;&nbsp; <a href="https://scratchformat.github.io/" target="_newtab">Website</a> <div class="dropdown" style="">
7+
8+
<button class="dropbtn">Links</button>
9+
<div class="dropdown-content" style="left:0;">
10+
<a href="https://github.com/scratchformat/" target="_newtab">Github</a>
11+
<a href="https://github.com/scratchformat/scratchformat2" target="_newtab">Source Code</a>
12+
<a href="https://scratch.mit.edu/users/pufflegamerz" target="_newtab" class="b">@pufflegamerz</a> </div> </div>
13+
14+
<span class="dash">&nbsp;</span> <a class="white" href="http://petabyte.heb12.com/" target="_newtab">Pufflegamer'z Website</a> <div class="f"> <a class="white" style="float:right;" href="https://github.com/scratchformat" target="_blank">Github</a> <span style="float:right;">&nbsp</span> </div> </div>
615
<center>
716
<img src="logo.png" width="200">
8-
<h2>ScratchFormat 2.2</h2>
917
<p>
1018
Thank you for using ScratchFormat. <b>To use it, go
1119
on a scratch comment editor and click on it.</b> The formatter
@@ -20,10 +28,146 @@ <h2>ScratchFormat 2.2</h2>
2028
</center>
2129
</body>
2230
<style>
23-
html {
31+
body {
2432

2533
background-color: lightblue;
2634
}
35+
/*Dash*/
36+
div.dash {
37+
background-color:#4d97f8;
38+
margin:0em;
39+
color:white;
40+
padding:0px;
41+
padding-top:0px;
42+
}
43+
div.dash img{
44+
background-color:white;
45+
vertical-align: text-top;
46+
}
47+
48+
div.dash a {
49+
background-color:#4d97f8;
50+
border-radius:0px;
51+
border:0px solid #0e1633;
52+
display:inline-block;
53+
cursor:pointer;
54+
color:#ffffff;
55+
font-family:Arial;
56+
font-size:15px;
57+
font-weight:bold;
58+
padding:20px 14px;
59+
text-decoration:none;
60+
}
61+
div.dash a:hover {
62+
background-color:#3b7cd1;
63+
}
64+
div.dash a:active {
65+
position:relative;
66+
top:1px;
67+
}
68+
div.dash a.white {
69+
background-color:white;
70+
border-radius:4px;
71+
border:1px solid lightgray;
72+
display:inline-block;
73+
cursor:pointer;
74+
color:
75+
#3b7cd1
76+
;
77+
font-family:Arial;
78+
font-size:15px;
79+
font-weight:bold;
80+
padding:10px 14px;
81+
text-decoration:none;
82+
}
83+
div.dash a.white:hover {
84+
background-color: lightgrey;
85+
}
86+
div.dash a.white:active {
87+
position:relative;
88+
top:1px;
89+
}
90+
div.dash b{
91+
font-size:20px;
92+
}
93+
94+
body {
95+
margin:0em;
96+
}
97+
div.dash div.f{
98+
padding:8px;
99+
float:right;
100+
}
101+
span.dash{
102+
border-left: 2px dashed
103+
#3b7cd1
104+
;
105+
}
106+
/*Other*/
107+
div.te{
108+
margin:1em;
109+
}
110+
111+
112+
113+
/*DropDown*/
114+
.dropbtn {
115+
background-color:#4d97f8;
116+
border-radius:0px;
117+
border:0px solid #0e1633;
118+
display:inline-block;
119+
cursor:pointer;
120+
color:#ffffff;
121+
font-family:Arial;
122+
font-size:15px;
123+
font-weight:bold;
124+
padding:20px 14px;
125+
text-decoration:none;
126+
}
127+
128+
.dropdown {
129+
position: relative;
130+
display: inline-block;
131+
}
132+
133+
.dropdown-content {
134+
display: none;
135+
position: absolute;
136+
right: 0;
137+
background-color: #f9f9f9;
138+
min-width: 160px;
139+
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
140+
z-index: 1;
141+
border-radius:10px;
142+
}
143+
144+
.dropdown-content a {
145+
color: white;
146+
background-color: #f0c83f;
147+
padding: 12px 16px;
148+
text-decoration: none;
149+
display: block;
150+
font-weight:bold;
151+
border-left: 1.2px solid #bf9f00;
152+
border-right: 1.2px solid #bf9f00;
153+
width:134px;
154+
}
155+
.dropdown-content a.b {
156+
border-bottom-left-radius: 10px;
157+
border-bottom-right-radius: 10px;
158+
border-top: 1.4px solid #3b7cd1;
159+
border-bottom: 1.2px solid #3b7cd1;
160+
}
161+
162+
.dropdown-content a:hover {background-color: #3b7cd1;}
163+
164+
.dropdown:hover .dropdown-content {
165+
display: block;
166+
}
167+
168+
.dropdown:hover .dropbtn {
169+
background-color: #3b7cd1;
170+
}
27171
</style>
28172
<script type="text/javascript" src="javascript.js"></script>
29173
</html>

0 commit comments

Comments
 (0)