Skip to content

Commit a3c8c10

Browse files
committed
splitting css apart
1 parent ad7679e commit a3c8c10

File tree

12 files changed

+78
-101
lines changed

12 files changed

+78
-101
lines changed

content/pages/02-development-environments/02-text-editors-ides.markdown

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ expanded into a full Python IDE using configuration files and plugins.
1919

2020
<div class="well see-also">Text editors and IDEs are a concept implemented by <a href="/vim.html">Vim</a>, <a href="/emacs.html">Emacs</a>, <a href="/sublime-text.html">Sublime Text</a>, <a href="/jupyter-notebook.html">Jupyter Notebook</a> and several other applications. Learn how the parts fit together in the <a href="/development-environments.html">development environments</a> chapter or view <a href="/table-of-contents.html">all topics</a>.</div>
2121

22+
2223
## Why is a text editor or IDE necessary?
2324
Where will you write your code if you do not have a text editor? Your
2425
[development environment](/development-environments.html) must include

theme/templates/article.html

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,9 @@
1515

1616
{% block title %}{% if article %}{{ article.title }} - {% endif %}{% endblock %}
1717

18-
{% block css %}
19-
{% include "css.html" %}
20-
{% endblock %}
18+
{% block css %}{% include "css.html" %}{% include "css/panel.html" %}{% endblock %}
2119

22-
{% block banner %}
23-
{% include "banner.html" %}
24-
{% endblock %}
20+
{% block banner %}{% include "banner.html" %}{% endblock %}
2521

2622

2723
{% block content %}

theme/templates/css.html

Lines changed: 6 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,25 @@
11
{% raw %}
2-
<style>hr,img{border:0}*,:after,:before{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-size:18px;background:#fefefe}body{margin:0;font:18px Georgia,serif;line-height:1.4;color:#222;padding:0}img{vertical-align:middle}hr{height:0;box-sizing:content-box;margin:21px 0;border-top:1px solid #eee}h1,h2,h3,h4,h5,h6{font-family:"Helvetica Neue",sans-serif;font-weight:500;line-height:1.1;color:#000}h1,h2,h3{margin:32px 0 6px}h1{font-size:40px}h2{font-size:28px}h3{font-size:22px}h4,h5,h6{margin:11px 0;font-size:18px}p{margin:0 0 12px}ol,ul{margin:0 0 10px}code,pre{font:"Courier New",monospace;border-radius:4px;background-color:#f4f9ff;font-size:13px}code{padding:2px 4px;white-space:nowrap}pre{white-space:pre-wrap;display:block;padding:10px;margin:0 0 11px;line-height:1.4;word-break:break-all;word-wrap:break-word;border:1px solid #ccc}.cn{padding:0 15px 0 15px;margin-right:auto;margin-left:auto}.cn:before,.cn:after{display:table;content:" "}.cn:after{clear:both}.row:before,.row:after{display:table;content:" "}.row:after{clear:both}.c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12{position:relative;min-height:1px;padding:0 15px 0 15px}a{background:transparent;text-decoration:none;border-bottom:1px dotted;color:#444}a:hover{text-decoration:none;color:#000}.ft{padding:0 0 24px;float:right}.sns{font-family:"Helvetica Neue",sans-serif}.sps{font-size:14px}
2+
<style>hr,img{border:0}*,:after,:before{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-size:18px;background:#fefefe}body{margin:0;font:18px Georgia,serif;line-height:1.4;color:#222;padding:0}img{vertical-align:middle}hr{height:0;box-sizing:content-box;margin:21px 0;border-top:1px solid #eee}h1,h2,h3,h4,h5,h6{font-family:"Helvetica Neue",sans-serif;font-weight:500;line-height:1.1;color:#000}h1,h2,h3{margin:32px 0 6px}h1{font-size:40px}h2{font-size:28px}h3{font-size:22px}h4,h5,h6{margin:11px 0;font-size:18px}p{margin:0 0 12px}ol,ul{margin:0 0 10px}code,pre{font:"Courier New",monospace;border-radius:4px;background-color:#f4f9ff;font-size:13px}code{padding:2px 4px;white-space:nowrap}pre{white-space:pre-wrap;display:block;padding:10px;margin:0 0 11px;line-height:1.4;word-break:break-all;word-wrap:break-word;border:1px solid #ccc}.cn{padding:0 15px 0 15px;margin-right:auto;margin-left:auto}.cn:before,.cn:after{display:table;content:" "}.cn:after{clear:both}.row:before,.row:after{display:table;content:" "}.row:after{clear:both}.c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12{position:relative;min-height:1px;padding:0 15px 0 15px}a{background:transparent;text-decoration:none;border-bottom:1px dotted;color:#444}a:hover{text-decoration:none;color:#000}.ft{padding:0 0 24px;float:right}.sns{font-family:"Helvetica Neue",sans-serif}.sps{font-size:14px}.hd{margin:20px 0 15px 0}.hd>a{border-bottom:none}img.hdr{vertical-align:middle;border:none;height:52px;width:52px;padding:1px}.hdt a,.hdt a:hover{font:72px "Helvetica Neue",sans-serif;font-weight:normal;letter-spacing:.03em;vertical-align:middle;margin-left:5px;color:#000;text-decoration:none;border-bottom:none;line-height:.9em}
33
.lg{padding-left:0;margin-bottom:20px}.lgi{position:relative;display:block;padding:10px 15px;margin-bottom:-1px;background-color:#fff;border:1px solid #ddd}.lgi:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.lgi:last-child{margin-bottom:0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}a.lgi{color:#333}a.lgi:hover,a.lgi:focus{background:#ddd}a.lgi.active{z-index:2;background:#444;color:#fff;border:1px solid #222}
4-
.pn{margin:0 0 21px;background:#fff;border:1px solid transparent;border-radius:4px;border-color:#22b24c}
5-
.pnb{padding:15px}
6-
.pnb:before,.pnb:after{display:table;content:" "}
7-
.pnb:after{clear:both}
8-
.pn>.lg{margin-bottom:0}
9-
.pn>.lg .lgi{border-width:1px 0;font:14px 'Helvetica Neue',sans-serif;padding:5px 0 5px 10px}
10-
.pn>.lg .lgi:first-child{border-top-right-radius:0;border-top-left-radius:0}
11-
.pn>.lg .lgi:last-child{border-bottom:0;background-color:#22b24c;color:#fff}
12-
.pnh+.lg .lgi:first-child{border-top-width:0}
13-
.pnh{padding:10px 15px;border-bottom:1px solid transparent;border-top-right-radius:3px;border-top-left-radius:3px;color:#468847;background-color:#22b24c;border-color:#22b24c}
14-
.pn>.pnh>h3{margin:5px 0 0 0;color:#fff}
15-
.pn>.pnh>h3>a{color:#fff}
16-
.pn>.lg a.lgi.sbc{padding-left:27px}
17-
.pn>.lg a.lgi.sbc2{padding-left:35px}
18-
.well{min-height:20px;padding:19px;margin:0 0 20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;box-shadow:inset 0 1px 1px rgba(0,0,0,0.05)}
19-
.logo-title a,.logo-title a:hover{font:72px "Helvetica Neue",sans-serif;font-weight:normal;letter-spacing:.03em;vertical-align:middle;margin-left:5px;color:#000;text-decoration:none;border-bottom:none;line-height:.9em}
20-
.logo-image{vertical-align:middle;border:none;height:52px;width:52px;padding:1px}
21-
.logo-header-section{margin:20px 0 15px 0}
22-
#sb{margin-top:40px}
234
.btn-full{width:100%;box-shadow:1px 2px 1px #222;padding-bottom:4px}
245
p.under-btn{text-align:left;margin-top:20px}
25-
.see-also{margin-top:20px;background:#22B24C;color:#eee;font-family:"Helvetica Neue",sans-serif}
26-
.see-also a{color: #fff}
276
p.banner{font-weight:500;line-height:1.1;color:#fff;font-size:22px;margin:14px 0 18px 0}
287
th{text-align:left;font-family:"Helvetica Neue",sans-serif}
298
td{padding-right:20px}
309
img.bordered{border:1px solid #ccc}
3110
blockquote{border-left:4px solid #aaa;padding-left:10px;font-family:"Helvetica Neue"}
11+
.well{min-height:20px;padding:19px;margin:0 0 20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;box-shadow:inset 0 1px 1px rgba(0,0,0,0.05)}
12+
.see-also{margin-top:20px;background:#22B24C;color:#eee;font-family:"Helvetica Neue",sans-serif}
13+
.see-also a{color: #fff}
3214
.highlight{background:#ffff00}
3315
.form-control{display:block;width:100%;height:39px;padding:8px 12px;font-size:14px;color:#777;vertical-align:middle;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}
3416
.form-control:focus{border-color:#66afe9;outline:0;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6)}
3517
.btn{display:inline-block;padding:8px 12px;margin-bottom:0;font-size:15px;line-height:1.4;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;border:1px solid transparent;border-radius:4px;color:#fff;background-color:#22b24c;border-color:#22b24c}
3618
.btn:active,.btn.active{background-image:none;outline:0;box-shadow:inset 0 3px 5px rgba(0,0,0,0.125)}
37-
@media (max-width:1200px){h3.pnh{font-size:22px}}@media (max-width:750px){.smaller-item{font-size:1em;padding:15px 0 15px 10px}}@media (max-width:720px){.logo-header-section{margin:20px 40px 0 0}}
19+
@media (max-width:1200px){h3.pnh{font-size:22px}}@media (max-width:750px){.smaller-item{font-size:1em;padding:15px 0 15px 10px}}@media (max-width:720px){.hd{margin:20px 40px 0 0}}
3820
@media (min-width:750px){.cn{width:730px}}@media (min-width:768px){.cn{width:750px}}@media (min-width:940px){.cn{width:920px}}@media (min-width:1140px){.cn{width:1120px}}.row{margin-right:-15px;margin-left:-15px}
3921
@media (min-width:768px){#full-toc{display:block;} #mobile-toc{display:none;} .c3,.c4,.c6,.c8,.c9,.c12{float:left} .c12{width:100%} .c9{width:75%} .c6{width:50%} .c8{width:66.66666666666666%} .c4{width:33.33333333333333%} .c3{width:25%} .co1{margin-left:8.333333333333332%} .select-next{min-height:300px}}
40-
@media (max-width:767px){#full-toc{display:none;} .logo-header-section{padding:8px 0 10px; margin:0} .logo-title a,.logo-title a:hover{font-size:34px} h1{font-size:28px} h2{font-size:24px} .logo-image{height:26px;width:26px} pre{font-size:50%}}
22+
@media (max-width:767px){#full-toc{display:none;} .hd{padding:8px 0 10px; margin:0} .logo-title a,.logo-title a:hover{font-size:34px} h1{font-size:28px} h2{font-size:24px} img.hdr{height:26px;width:26px} pre{font-size:50%}}
4123
@media (min-width:1140px){.select-next{min-height:220px}}
4224
</style>
4325
{% endraw %}

theme/templates/css/panel.html

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{% raw %}
2+
<style>
3+
.pn{margin:0 0 21px;background:#fff;border:1px solid transparent;border-radius:4px;border-color:#22b24c}.pnb{padding:15px}.pnb:before,.pnb:after{display:table;content:" "}.pnb:after{clear:both}.pn>.lg{margin-bottom:0}.pn>.lg .lgi{border-width:1px 0;font:14px 'Helvetica Neue',sans-serif;padding:5px 0 5px 10px}.pn>.lg .lgi:first-child{border-top-right-radius:0;border-top-left-radius:0}.pn>.lg .lgi:last-child{border-bottom:0;background-color:#22b24c;color:#fff}.pnh+.lg .lgi:first-child{border-top-width:0}.pnh{padding:10px 15px;border-bottom:1px solid transparent;border-top-right-radius:3px;border-top-left-radius:3px;color:#468847;background-color:#22b24c;border-color:#22b24c}.pn>.pnh>h3{margin:5px 0 0 0;color:#fff}.pn>.pnh>h3>a{color:#fff}.pn>.lg a.lgi.sbc{padding-left:27px}.pn>.lg a.lgi.sbc2{padding-left:35px}#sb{margin-top:40px}
4+
</style>
5+
{% endraw %}
Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
1-
<div class="panel">
2-
<div class="panel-heading">
3-
<h3 class="panel-head">Email Updates</h3>
4-
</div>
5-
<div class="panel-body">
6-
<div id="mc_embed_signup">
7-
<form action="//mattmakai.us2.list-manage.com/subscribe/post?u=b7e774f0c4f05dcebbfee183d&amp;id=b22335388d" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
8-
<div id="mc_embed_signup_scroll">
9-
<h5>Sign up to get an email twice per month with Python tutorials and major updates to this site.</h5>
10-
<input type="email" value="" name="EMAIL" class="email form-control" id="mce-EMAIL" placeholder="email address" required>
11-
<div style="position: absolute; left: -5000px;"><input type="text" name="b_b7e774f0c4f05dcebbfee183d_b22335388d" tabindex="-1" value=""></div>
12-
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn btn-success" style="font-family: 'Helvetica Neue'; margin: 5px 0 6px 0;">
13-
</div>
14-
</form>
1+
<div class="pn">
2+
<div class="pnh">
3+
<h3>Email Updates</h3>
4+
</div>
5+
<div class="pnb">
6+
<div id="mc_embed_signup">
7+
<form action="//mattmakai.us2.list-manage.com/subscribe/post?u=b7e774f0c4f05dcebbfee183d&amp;id=b22335388d" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
8+
<div id="mc_embed_signup_scroll">
9+
<h5>Sign up to get an email twice per month with Python tutorials and major updates to this site.</h5>
10+
<input type="email" value="" name="EMAIL" class="email form-control" id="mce-EMAIL" placeholder="email address" required>
11+
<div style="position: absolute; left: -5000px;"><input type="text" name="b_b7e774f0c4f05dcebbfee183d_b22335388d" tabindex="-1" value=""></div>
12+
<input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn btn-success" style="font-family: 'Helvetica Neue'; margin: 5px 0 6px 0;">
1513
</div>
14+
</form>
1615
</div>
16+
</div>
1717
</div>

theme/templates/email.html

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,7 @@
22

33
{% block title %}Email sign up - {% endblock %}
44

5-
{% block css %}
6-
{% include "css.html" %}
7-
{% endblock %}
5+
{% block css %}{% include "css.html" %}{% include "css/panel.html" %}{% endblock %}
86

97
{% block content %}
108
<div class="row">

theme/templates/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta name="description" content="Full Stack Python explains programming concepts in plain language and provides links to the best tutorials for those topics.">
55
{% endblock %}
66

7-
{% block css %}{% include "css.html" %}{% endblock %}
7+
{% block css %}{% include "css.html" %}{% include "css/panel.html" %}{% endblock %}
88

99
{% block banner %}
1010
{% endblock %}

theme/templates/nav.html

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
11
<div class="row">
22
<div class="c12">
3-
<div class="logo-header-section">
4-
<a href="/" style="text-decoration: none; border: none;"><img src="/img/logos/f.png" class="logo-image" alt="Full Stack Python logo"></a>
5-
<span class="logo-title"><a href="/">Full Stack Python</a></span>
3+
<div class="hd"><a href="/"><img src="/img/logos/f.png" class="hdr" alt="Full Stack Python logo"></a>
4+
<span class="hdt"><a href="/">Full Stack Python</a></span>
65
</div>
76
{% include "subnav.html" %}
87
</div>

theme/templates/page.html

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,21 +6,17 @@
66

77
{% block title %}{{ page.title }} - {% endblock %}
88

9-
{% block css %}
10-
{% include "css.html" %}
11-
{% endblock %}
9+
{% block css %}{% include "css.html" %}{% include "css/panel.html" %}{% endblock %}
1210

13-
{% block banner %}
14-
{% include "banner.html" %}
15-
{% endblock %}
11+
{% block banner %}{% include "banner.html" %}{% endblock %}
1612

1713
{% block content %}
1814
<div class="row">
1915
<div class="c8">
2016
{% if page.slug == 'about-author' %}
2117
<div class="row">
2218
<div class="c6">
23-
<img src="/img/visuals/matt-makai-2017.jpg" class="technical-diagram" width="100%" style="border-radius:6px;padding-top:30px">
19+
<img src="/img/visuals/matt-makai-2017.jpg" width="100%" style="border-radius:6px;padding-top:30px">
2420
</div>
2521
<div class="c6">
2622
{{ page.content }}

theme/templates/rp-advert.html

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
<div class="panel">
2-
<div class="panel-heading">
3-
<h3 class="panel-head">Sponsored By</h3>
4-
</div>
5-
<div class="panel-body">
6-
<a href="https://realpython.com/?utm_source=fsp&amp;utm_medium=promo&amp;utm_campaign=frontpage"><img src="/img/logos/realpython.jpg" alt="Real Python logo" width="100%"></a>
7-
<p style="font-size: .8em;">If you're searching for step-by-step Python
8-
web development tutorials then I highly recommend
9-
<a href="https://realpython.com/?utm_source=fsp&amp;utm_medium=promo&amp;utm_campaign=frontpage" onclick="trackOutboundLink('https://realpython.com/?utm_source=fsp&amp;utm_medium=promo&amp;utm_campaign=frontpage'); return false;">checking out Real Python</a>.
10-
</p>
11-
</div>
1+
<div class="pn">
2+
<div class="pnh">
3+
<h3>Sponsored By</h3>
4+
</div>
5+
<div class="pnb">
6+
<a href="https://realpython.com/?utm_source=fsp&amp;utm_medium=promo&amp;utm_campaign=frontpage"><img src="/img/logos/realpython.jpg" alt="Real Python logo" width="100%"></a>
7+
<p style="font-size: .8em;">If you're searching for step-by-step Python
8+
web development tutorials then I highly recommend
9+
<a href="https://realpython.com/?utm_source=fsp&amp;utm_medium=promo&amp;utm_campaign=frontpage">checking out Real Python</a>.
10+
</p>
11+
</div>
1212
</div>

0 commit comments

Comments
 (0)