Skip to content

Commit 0e3961c

Browse files
adampresleyadampresley
committed
Added social media images, cleaned up page.
1 parent 61164ab commit 0e3961c

File tree

8 files changed

+47
-115
lines changed

8 files changed

+47
-115
lines changed

‎images/aboutme.png

668 Bytes
Loading

‎images/browser-screenshot.png

51.3 KB
Loading

‎images/gplus-32.png

968 Bytes
Loading

‎images/linkedin.png

2.54 KB
Loading

‎images/sublime-screenshot.png

85.8 KB
Loading

‎images/twitter.png

2.5 KB
Loading

‎index.html

Lines changed: 39 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,24 @@
11
<!doctype html>
22
<html>
33
<head>
4-
<meta charset="utf-8">
5-
<meta http-equiv="X-UA-Compatible" content="chrome=1">
6-
<title>Sublime View In Browser Plugin by adampresley</title>
4+
<meta charset="utf-8" />
5+
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
6+
<title>Sublime Text View In Browser Plugin by adampresley</title>
77

8-
<link rel="stylesheet" href="stylesheets/styles.css">
9-
<link rel="stylesheet" href="stylesheets/pygment_trac.css">
8+
<link rel="stylesheet" href="stylesheets/styles.css" />
9+
<link rel="stylesheet" href="stylesheets/pygment_trac.css" />
1010
<script src="javascripts/scale.fix.js"></script>
11-
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
11+
12+
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
1213
<!--[if lt IE 9]>
1314
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
1415
<![endif]-->
1516
</head>
17+
1618
<body>
1719
<div class="wrapper">
1820
<header>
19-
<h1 class="header">Sublime View In Browser Plugin</h1>
21+
<h1 class="header">Sublime Text View In Browser Plugin</h1>
2022
<p class="header">Open the contents of your current view/tab in a web browser</p>
2123

2224
<ul>
@@ -25,126 +27,52 @@ <h1 class="header">Sublime View In Browser Plugin</h1>
2527
<li><a class="buttons github" href="https://github.com/adampresley/sublime-view-in-browser">View On GitHub</a></li>
2628
</ul>
2729

28-
<p class="header">This project is maintained by <a class="header name" href="https://github.com/adampresley">adampresley</a></p>
29-
30-
31-
</header>
32-
<section>
33-
<h1>Sublime Text 2 - View In Browser</h1>
34-
<p>
35-
<em>View In Browser</em> is a Sublime Text 2 plugin that will open whatever is in your
36-
current view/tab. If the file current open is new and has not been saved a temporary
37-
file is created (in your default temp directory for your OS) with the extension of
38-
<strong>.htm</strong> and your browser will open it. However if the current open file is saved
39-
and has a name this plugin will open it in whatever you have set to handle
40-
its type.
41-
</p>
42-
43-
<p>By default the keystroke assigned to this plugin is <em>CTRL + ALT + V</em>.</p>
44-
45-
<h2>Installation</h2>
46-
<p>
47-
Using the Sublime Text 2 Package Control plugin (<a href="http://wbond.net/sublime_packages/package_control">http://wbond.net/sublime_packages/package_control</a>)
48-
press <em>CTRL + SHIFT + P</em> and find <strong>Package Control: Install Package</strong> and press <em>Enter</em>.
49-
Find this plugin in the list by name <strong>View In Browser</strong>.
50-
</p>
51-
52-
<h2>Configuring Browsers</h2>
53-
54-
<p>
55-
By default this plugin will open files in Firefox. You can configure it to open
56-
using another browser of your choice. To do this, choose <em>Settings - User</em> from <em>Preferences &gt; Package Settings &gt; View In Browser</em>.
57-
</p>
58-
59-
<p>
60-
The browser you wish to use to open files is set in the key named <strong>selectedBrowser</strong>. The list of browsers
61-
you can use and configure are in the key named <strong>supportedBrowsers</strong>.
62-
</p>
63-
6430
<p>
65-
The <strong>supportedBrowsers</strong> values can be configured to have paths to your browser installations.
66-
Each browser listed is an array (list) of configurations that allow you to setup a browser
67-
for multiple operating systems. For example under <em>chrome</em> there are two configurations.
68-
The first is for your average Linux system. The second is for Windows.
31+
<a href="https://github.com/adampresley" target="_blank"><img src="images/octocat-small.png" alt="GitHub" title="GitHub" height="24" /></a>
32+
<a href="https://twitter.com/adampresley" target="_blank"><img src="images/twitter.png" alt="Twitter" title="Twitter" width="24" height="24" /></a>
33+
<a href="https://plus.google.com/u/0/101569206882533476460/posts/p/pub" target="_blank"><img src="images/gplus-32.png" alt="Google+" title="Google+" width="24" height="24" /></a>
34+
<a href="http://www.linkedin.com/in/adampresley" target="_blank"><img src="images/linkedin.png" alt="LinkedIn" title="LinkedIn" width="24" height="24" /></a>
35+
<a href="http://about.me/adampresley" target="_blank"><img src="images/aboutme.png" alt="About.me" title="About.me" width="24" height="24" /></a>
6936
</p>
37+
</header>
7038

71-
<h3>Windows Considerations</h3>
72-
39+
<section>
40+
<h1>View In Browser</h1>
7341
<p>
74-
One of the things you may notice in the Windows configuration for <em>chrome</em> is a variable in
75-
the command path that looks like: <strong>%Local AppData%</strong>. This is a reference to your Windows
76-
installation's <strong>AppData</strong> folder in your user profile directory. There is a variable
77-
there because this value will differ for each user on your computer, and Chrome installs
78-
to your <strong>AppData</strong> folder.
42+
<em>View In Browser</em> is a Sublime Text 2 plugin that will open whatever is in your
43+
current view/tab in your browser of choice. If the file you are working with is new
44+
and has not been saved then this plugin will save a temporary copy fo you and then open it up.
45+
View In Browser also works with local application servers to open your files using a URL prefix.
7946
</p>
8047

81-
<p>Here is a list of supported variables:</p>
48+
<div class="left-screenshot">
49+
<h3>From this...</h3>
50+
<img src="images/sublime-screenshot.png" alt="Sublime Text Screenshot" />
51+
</div>
8252

83-
<ul>
84-
<li><strong>AppData</strong> - Your main application data folder for your profile (usually roaming)</li>
85-
<li><strong>Personal</strong> - Your documents ___location</li>
86-
<li><strong>Desktop</strong> - The path to your Desktop ___location (may be unreliable)</li>
87-
<li><strong>Start Menu</strong> - The path to your Start Menu items ___location</li>
88-
<li><strong>Local AppData</strong> - Your local application data folder for your profile</li>
89-
<li><strong>My Video</strong> - Path to your videos ___location</li>
90-
<li><strong>My Pictures</strong> - Path to your pictures ___location</li>
91-
<li><strong>My Music</strong> - Path to your music ___location</li>
92-
</ul>
93-
94-
<p>
95-
Note that many of these are not terribly useful for determining browser ___location, unless you
96-
have decided to install Firefox in your My Music folder.
97-
</p>
53+
<div class="right-screenshot">
54+
<h3>To this.</h3>
55+
<img src="images/browser-screenshot.png" alt="Browser Screenshot" />
56+
</div>
9857

99-
<h2>Configure to View on Local Server</h2>
58+
<div class="final-push">
59+
<h3>In just one keystroke.</h3>
60+
<p><em>CTRL + ALT + V</em></p>
61+
</div>
10062

101-
<p>
102-
The View In Browser plugin also supports the ability to view files in the context of
103-
a local server. So if you have a local Apache, Tomcat, or some other server application running
104-
you can configure this plugin to open your file prefixed with a URL.
105-
</p>
10663

64+
<h2>Where To Start</h2>
10765
<p>
108-
To configure this the View In Browser plugin reads the configuration of your currently
109-
loaded project. You can edit a project file by opening the <em>sublime-project</em> file
110-
by choosing <strong>Project</strong> -&gt; <strong>Edit Project</strong>. In your project file you will need to specify
111-
two things:
66+
To get started the <a href="https://github.com/adampresley/sublime-view-in-browser/wiki" target="_blank">View In Browser wiki</a> has
67+
guides to aide in installation, browser configuration, and local server project configuration.
11268
</p>
11369

11470
<ul>
115-
<li><strong>baseUrl</strong> - The root URL to prefix files with </li>
116-
<li><strong>basePath</strong> - The base path where your site/application lives</li>
71+
<li><a href="https://github.com/adampresley/sublime-view-in-browser/wiki/Getting-Started" target="_blank">Getting Started</a></li>
72+
<li><a href="https://github.com/adampresley/sublime-view-in-browser/wiki/Configuring-Browsers" target="_blank">Configuring Browsers</a></li>
73+
<li><a href="https://github.com/adampresley/sublime-view-in-browser/wiki/Viewing-on-a-Local-Server" target="_blank">Viewing on a Local Server</a></li>
11774
</ul>
11875

119-
<p>Here's how that looks.</p>
120-
121-
<div class="highlight"><pre><span class="p">{</span>
122-
<span class="s2">"folders"</span><span class="o">:</span>
123-
<span class="p">[</span>
124-
<span class="p">{</span>
125-
<span class="s2">"path"</span><span class="o">:</span> <span class="s2">"/home/&lt;username&gt;/code/python/my-cool-website"</span>
126-
<span class="p">}</span>
127-
<span class="p">],</span>
128-
<span class="s2">"settings"</span><span class="o">:</span> <span class="p">{</span>
129-
<span class="s2">"sublime-view-in-browser"</span><span class="o">:</span> <span class="p">{</span>
130-
<span class="s2">"baseUrl"</span><span class="o">:</span> <span class="s2">"http://localhost:8080"</span><span class="p">,</span>
131-
<span class="s2">"basePath"</span><span class="o">:</span> <span class="s2">"/home/&lt;username&gt;/code/python/my-cool-website"</span>
132-
<span class="p">}</span>
133-
<span class="p">}</span>
134-
<span class="p">}</span>
135-
</pre></div>
136-
137-
<p>
138-
Notice the key named <strong>settings</strong> which is a dictionary that contains another key named
139-
<strong>sublime-view-in-browser</strong>. This is where you will put your <strong>baseUrl</strong> and <strong>basePath</strong>
140-
settings.
141-
</p>
142-
143-
<p>
144-
Now when you activate View In Browser your file will open with the HTTP protocol instead
145-
of the FILE protocol.
146-
</p>
147-
14876
<h2>Change History</h2>
14977

15078
<ul>

‎stylesheets/styles.css

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,7 @@ img {
146146
max-width: 650px;
147147
padding: 5px;
148148
margin: 10px 0 32px 0;
149-
border: 1px solid #ccc;
149+
/*border: 1px solid #ccc;*/
150150
}
151151

152152

@@ -207,7 +207,7 @@ td {
207207
header {
208208
background-color: #171717;
209209
color: #FDFDFB;
210-
width:170px;
210+
width:190px;
211211
float:left;
212212
position:fixed;
213213
border: 1px solid #000;
@@ -217,7 +217,7 @@ header {
217217
-moz-border-radius-bottomright: 4px;
218218
border-top-right-radius: 4px;
219219
border-bottom-right-radius: 4px;
220-
padding: 34px 25px 22px 50px;
220+
padding: 34px 25px 22px 40px;
221221
margin: 30px 25px 0 0;
222222
-webkit-font-smoothing: antialiased;
223223
}
@@ -410,4 +410,8 @@ footer {
410410
font-size:12pt;
411411
color:#444;
412412
}
413-
}
413+
}
414+
415+
.left-screenshot { }
416+
.right-screenshot { }
417+

0 commit comments

Comments
 (0)