Skip to content

Commit 1781f53

Browse files
rjsparksrjsparks
committed
De-bootstrapped the page - simplified the styling.
 - Legacy-Id: 18865
1 parent ae4c2d1 commit 1781f53

2 files changed

Lines changed: 118 additions & 143 deletions

File tree

‎ietf/templates/doc/document_html.html‎

Lines changed: 10 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -24,14 +24,6 @@
2424
.bgcyan { background-color: #4DD; }
2525
.bggreen { background-color: #4F4; }
2626

27-
.colorbar {
28-
height: 6px;
29-
position: absolute;
30-
width: 80ex;
31-
margin-left:-0.5em;
32-
margin-bottom:0;
33-
}
34-
3527
.draftcontent { margin-top:0px !important;}
3628

3729
{% endblock %}
@@ -44,41 +36,40 @@
4436
{% endif %}
4537
{% endblock %}
4638

47-
{% block bodyAttrs %}style="padding-top: 0;"{% endblock %}
39+
{% block bodyAttrs %}onload="addHeaderTags()" style="padding-top: 0;"{% endblock %}
4840

4941
{% block content %}
5042
{% origin %}
5143

52-
<div class="col-md-6 rfcmarkup">
53-
<div class="row" style="height: 0px; margin-top:0;">
44+
<div class="rfcmarkup">
45+
<div class="noprint" style="height: 6px;">
5446
<div onmouseover="this.style.cursor='pointer';"
5547
onclick="showElem('legend');"
5648
onmouseout="hideElem('legend')"
57-
style="height: 6px; position: absolute; margin-top:0; "
58-
class="colorbar {{doccolor}}"
59-
title="Click for colour legend." ></div>
49+
style="height: 6px; min-height: 6px; width: 96ex; position: absolute; margin-top:0; "
50+
class="meta-info {{doccolor}}"
51+
title="Click for colour legend." >&nbsp;</div>
6052
<div id="legend"
61-
class="docinfo noprint pre legend"
53+
class="meta-info noprint pre legend"
6254
style="position:absolute; top: 4px; left: 4ex; visibility:hidden; background-color: white; padding: 4px 9px 5px 7px; border: solid #345 1px; "
6355
onmouseover="showElem('legend');"
6456
onmouseout="hideElem('legend');">
6557
</div>
6658
</div>
6759

6860
{% if doc.meta %}
69-
<div class="row hidden-print" style="margin-top:6px;">
70-
<pre class="meta-info">{{ doc.supermeta|safe }}
61+
<div class="noprint">
62+
<pre class="pre meta-info">{{ doc.supermeta|safe }}
7163

7264
{{ doc.meta|safe }}</pre>
7365
</div>
7466
{% endif %}
7567

76-
<div class="row draftcontent">
68+
<div class="draftcontent">
7769
{{ doc.htmlized|default:"Generation of htmlized text failed"|safe }}
7870
</div>
7971

8072
</div>
81-
<div class="col-md-6"></div>
8273

8374
{% endblock %}
8475

‎ietf/templates/doc/htmlized_base.html‎

Lines changed: 108 additions & 124 deletions
Original file line numberDiff line numberDiff line change
@@ -1,127 +1,124 @@
11
<!DOCTYPE html> {% load ietf_filters static %}
22
{# Copyright The IETF Trust 2021, All Rights Reserved #}
33
{% load origin %}{% origin %}
4-
{% load bootstrap3 %}
54
<html lang="en">
65
<head>
76
<meta charset="utf-8">
87
<meta http-equiv="X-UA-Compatible" content="IE=edge">
98
<title>{% block title %}No title{% endblock %}</title>
109
<meta name="viewport" content="width=device-width, initial-scale=1">
11-
12-
<link href="{% static 'ptmono/stylesheet.css' %}" rel='stylesheet' type='text/css'>
13-
<link href="{% static 'ptsans/stylesheet.css' %}" rel='stylesheet' type='text/css'>
14-
<link href="{% static 'ptserif/stylesheet.css' %}" rel='stylesheet' type='text/css'>
15-
<link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.min.css' %}">
16-
<link rel="stylesheet" href="{% static 'ietf/font-datatracker/css/font-datatracker.css' %}">
17-
<link rel="stylesheet" href="{% static 'ietf/bootstrap/css/bootstrap.min.css' %}">
18-
<link rel="stylesheet" href="{% static 'ietf/bootstrap/css/bootstrap-theme.min.css' %}">
19-
<!-- <link rel="stylesheet" href="{% static 'ietf/css/ietf.css' %}"> -->
20-
{% if debug %}
21-
<link rel="stylesheet" href="{% static 'jquery.tablesorter/css/theme.bootstrap.min.css' %}">
22-
{% endif %}
2310
<style>
24-
.rfcmarkup div {
25-
margin-top: 1em;
26-
}
27-
.rfcmarkup pre {
28-
font-size: 10pt;
29-
border: 0;
30-
margin: 0;
31-
padding: 0;
32-
padding-bottom: 1em;
33-
background-color: white;
34-
line-height: 1.12;
35-
font-family: monospace;
36-
overflow: visible;
37-
}
38-
39-
.rfcmarkup pre span.h1,
40-
.rfcmarkup pre span.h2,
41-
.rfcmarkup pre span.h3,
42-
.rfcmarkup pre span.h4,
43-
.rfcmarkup pre span.h5,
44-
.rfcmarkup pre span.h6 {
45-
font-weight: bold;
46-
line-height: 0pt;
47-
display: inline;
48-
white-space: pre;
49-
font-family: monospace;
50-
font-size: 1em;
51-
font-weight: bold;
52-
53-
}
54-
.rfcmarkup pre span.invisible {
55-
text-decoration: none;
56-
color: white;
57-
}
58-
59-
.rfcmarkup pre a { text-decoration: underline; }
60-
61-
.rfcmarkup pre .grey,
62-
.rfcmarkup pre .grey a:link,
63-
.rfcmarkup pre .grey a:visited {
64-
color: #777;
65-
}
66-
67-
.rfcmarkup pre.meta-info {
68-
padding: 0.5em;
69-
margin-left: -0.5em;
70-
background-color: #f8f8f8;
71-
border: 1px solid #e0e0e0;
72-
width: 98.5ex;
73-
padding-top: 0;
74-
}
75-
76-
.rfcmarkup hr {
77-
margin: 0;
78-
width: 80ex;
79-
}
8011

81-
.rfcmarkup .text-warning,
82-
.rfcmarkup a.text-warning,
83-
.rfcmarkup a.text-warning:focus,
84-
.rfcmarkup a.text-warning:active,
85-
.rfcmarkup a.text-warning:visited,
86-
.rfcmarkup a.text-warning:hover
87-
{
88-
color: #d9534f; /* brand-danger colour */
89-
}
90-
91-
@media screen {
92-
body { margin-left:3em; }
93-
}
94-
95-
@media print {
96-
body { margin-top:5em; }
97-
98-
.rfcmarkup .noprint { display: none; }
99-
.rfcmarkup a,
100-
.rfcmarkup a:visited,
101-
.rfcmarkup pre a,
102-
.rfcmarkup pre a:visited {
103-
text-decoration: none;
12+
@media only screen
13+
and (min-width: 992px)
14+
and (max-width: 1199px) {
15+
body { font-size: 14pt; }
16+
div.content { width: 96ex; margin: 0 auto; }
17+
}
18+
@media only screen
19+
and (min-width: 768px)
20+
and (max-width: 991px) {
21+
body { font-size: 14pt; }
22+
div.content { width: 96ex; margin: 0 auto; }
23+
}
24+
@media only screen
25+
and (min-width: 480px)
26+
and (max-width: 767px) {
27+
body { font-size: 11pt; }
28+
div.content { width: 96ex; margin: 0 auto; }
29+
}
30+
@media only screen
31+
and (max-width: 479px) {
32+
body { font-size: 8pt; }
33+
div.content { width: 96ex; margin: 0 auto; }
34+
}
35+
@media only screen
36+
and (min-device-width : 375px)
37+
and (max-device-width : 667px) {
38+
body { font-size: 9.5pt; }
39+
div.content { width: 96ex; margin: 0; }
40+
}
41+
@media only screen
42+
and (min-device-width: 1200px) {
43+
body { font-size: 10pt; margin: 0 4em; }
44+
div.content { width: 96ex; margin: 0; }
45+
}
46+
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
47+
font-weight: bold;
48+
/* line-height: 0pt; */
49+
display: inline;
50+
white-space: pre;
51+
font-family: monospace;
52+
font-size: 1em;
53+
font-weight: bold;
54+
}
55+
pre {
56+
font-size: 1em;
57+
margin-top: 0px;
58+
margin-bottom: 0px;
59+
}
60+
.pre {
61+
white-space: pre;
62+
font-family: monospace;
10463
}
105-
.rfcmarkup a[href]:after {
106-
content: "";
64+
.header{
65+
font-weight: bold;
10766
}
108-
.rfcmarkup abbr[title]:after {
109-
content: "";
67+
.newpage {
68+
page-break-before: always;
69+
}
70+
.invisible {
71+
text-decoration: none;
72+
color: white;
73+
}
74+
@media print {
75+
body {
76+
margin-top: 5em;
77+
font-family: monospace;
78+
font-size: 10.5pt;
79+
}
80+
h1, h2, h3, h4, h5, h6 {
81+
font-size: 1em;
82+
}
83+
84+
a:link, a:visited {
85+
color: inherit;
86+
text-decoration: none;
87+
}
88+
.noprint {
89+
display: none;
90+
}
91+
}
92+
@media screen {
93+
.grey, .grey a:link, .grey a:visited {
94+
color: #777;
95+
}
96+
.meta-info {
97+
background-color: #EEE;
98+
}
99+
.top {
100+
border-top: 7px solid #EEE;
101+
}
102+
.pad {
103+
padding-top: 7px;
104+
line-height: 24px;
105+
padding-bottom: 4px;
106+
}
107+
.bgwhite { background-color: white; }
108+
.bgred { background-color: #F44; }
109+
.bggrey { background-color: #666; }
110+
.bgbrown { background-color: #840; }
111+
.bgorange { background-color: #FA0; }
112+
.bgyellow { background-color: #EE0; }
113+
.bgmagenta{ background-color: #F4F; }
114+
.bgblue { background-color: #66F; }
115+
.bgcyan { background-color: #4DD; }
116+
.bggreen { background-color: #4F4; }
117+
118+
.legend { font-size: 90%; }
119+
.cplate { font-size: 70%; border: solid grey 1px; }
110120
}
111-
.rfcmarkup pre {
112-
font-size: 10.5pt;
113-
114-
margin-top: 0;
115-
margin-bottom: 0;
116-
margin-left: auto;
117-
margin-right: auto;
118121

119-
120-
}
121-
.rfcmarkup .newpage {
122-
page-break-before: always;
123-
}
124-
}
125122
{% block morecss %}{% endblock %}
126123
</style>
127124

@@ -141,12 +138,7 @@
141138

142139
<body {% block bodyAttrs %}{%endblock%}>
143140

144-
<div class="container-fluid-narrow">
145-
{% comment %} {% bootstrap_messages %} {% endcomment %}
146-
{% for message in messages %}
147-
<div class="alert{% if message.level_tag %} alert-{% if message.level_tag == 'error' %}danger{% else %}{{ message.level_tag }}{% endif %}{% endif %}{% if message.extra_tags %} {{message.extra_tags}}{% endif %} alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&#215;</button>{{ message }}</div>
148-
{% endfor %}
149-
<div class="col-md-12 col-sm-12" id="content">
141+
<div class="content" id="content">
150142
{% block content %}{{ content|safe }}{% endblock %}
151143
{% block content_end %}{% endblock %}
152144
</div>
@@ -155,23 +147,15 @@
155147

156148
{% endblock %}
157149

158-
</div>
159-
160-
{% include "debug.html" %}
150+
</div>
161151

162-
<script src="{% static 'jquery/jquery.min.js' %}"></script>
163152
{% comment %}
164153
<!-- Remove the *-nojs attributes if we are running js. This depends on jQuery's removeClass(): -->
165154
<!-- Do this as early as possible (after loading the page and jQuery) to avoid rendering changes -->
166155
{% endcomment %}
167156
<script>$(".visible-nojs").removeClass("visible-nojs");</script>
168157
<script>$(".hidden-nojs").removeClass("hidden-nojs");</script>
169-
<script src="{% static 'js-cookie/src/js.cookie.js' %}"></script>
170-
<script src="{% static 'ietf/bootstrap/js/bootstrap.min.js' %}"></script>
171158
{% block js %}{% endblock %}
172-
{% if debug %}
173-
<script src="{% static 'jquery.tablesorter/js/jquery.tablesorter.combined.min.js' %}"></script>
174-
{% endif %}
175159
</body>
176160
</html>
177161

0 commit comments

Comments
 (0)