dvla_internal_frontend_toolkit 1.0.7 → 2.0.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/images/examples/dialog.png +0 -0
- data/app/assets/images/examples/fixed.png +0 -0
- data/app/assets/images/examples/fluid.png +0 -0
- data/app/assets/stylesheets/elements/_data.scss +2 -0
- data/app/assets/stylesheets/elements/_filters.scss +2 -0
- data/app/assets/stylesheets/elements/_layout.scss +4 -3
- data/app/assets/stylesheets/elements/_navigation.scss +2 -0
- data/app/assets/stylesheets/styleguide/_styleguide.scss +41 -1
- data/app/views/layouts/erb/layout-dialog.html.erb +52 -42
- data/app/views/layouts/erb/layout-fixed.html.erb +59 -49
- data/app/views/layouts/erb/layout-fluid.html.erb +53 -41
- data/app/views/layouts/nunjucks/layout-dialog.html +49 -57
- data/app/views/layouts/nunjucks/layout-fixed.html +51 -59
- data/app/views/layouts/nunjucks/layout-fluid.html +50 -56
- data/lib/dvla_internal_frontend_toolkit/version.rb +1 -1
- metadata +5 -8
- data/app/views/layouts/erb/layout-fluid-tabs-left.html.erb +0 -64
- data/app/views/layouts/erb/layout-fluid-tabs-top.html.erb +0 -62
- data/app/views/layouts/erb/layout-fluid-tabs.html.erb +0 -74
- data/app/views/layouts/nunjucks/layout-fluid-tabs-left.html +0 -82
- data/app/views/layouts/nunjucks/layout-fluid-tabs-top.html +0 -79
- data/app/views/layouts/nunjucks/layout-fluid-tabs.html +0 -89
@@ -1,72 +1,64 @@
|
|
1
1
|
{% block top_of_page %}{% endblock %}
|
2
2
|
|
3
3
|
<html lang="en">
|
4
|
-
<head>
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
</head>
|
4
|
+
<head>
|
5
|
+
<title>{% block page_title %} {% endblock %}</title>
|
6
|
+
<meta name="viewport" content="width=device-width" />
|
7
|
+
<meta charset="utf-8">
|
8
|
+
{% block head %} {% endblock %}
|
9
|
+
</head>
|
10
10
|
|
11
|
-
<body class="{% block body_classes %}{% endblock %}">
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
11
|
+
<body class="{% block body_classes %}{% endblock %}">
|
12
|
+
<script>
|
13
|
+
document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');
|
14
|
+
</script>
|
15
|
+
{% block body_start %}{% endblock %}
|
16
16
|
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
17
|
+
<header role="banner" id="global-header" class="{% block header_class %}{% endblock %}">
|
18
|
+
<div id="header-wrapper">
|
19
|
+
<div id="header-contents">
|
20
|
+
<div id="header-float-left">
|
21
|
+
<div id="header-logo">
|
22
|
+
<a href="/" title="Home" id="logo" class="content">
|
23
|
+
<div id="coat-of-arms" alt=""></div>
|
24
|
+
<div class="name">DVLA</div>
|
25
|
+
</a>
|
26
|
+
<div id="header-application-title">
|
27
|
+
{% block header_application_title %}{% endblock %}
|
28
|
+
</div>
|
29
29
|
</div>
|
30
|
-
|
31
|
-
|
32
|
-
{% if show_header_search %}
|
33
|
-
<div id="header-search">
|
34
|
-
{% block header_search %}
|
35
|
-
<form>
|
36
|
-
<input type="text" placeholder="Search" />
|
37
|
-
<span class="search-btn"></span>
|
38
|
-
</form>
|
39
|
-
{% endblock %}
|
40
|
-
</div>
|
41
|
-
{% endif %}
|
42
|
-
</div>
|
43
|
-
<div id="header-float-right">
|
44
|
-
{% if show_header_user_account %}
|
45
|
-
<div id="user-account">
|
46
|
-
{% block header_user_account %}
|
47
|
-
<div id="logout">
|
48
|
-
<a href="#">Log out</a>
|
30
|
+
<div id="header-search">
|
31
|
+
{% block header_search %}{% endblock %}
|
49
32
|
</div>
|
50
|
-
|
51
|
-
|
33
|
+
</div>
|
34
|
+
<div id="header-float-right">
|
35
|
+
<div id="user-account">
|
36
|
+
{% block header_user_account %}{% endblock %}
|
52
37
|
</div>
|
53
|
-
{% endblock %}
|
54
38
|
</div>
|
55
|
-
{% endif %}
|
56
39
|
</div>
|
57
40
|
</div>
|
58
|
-
</
|
59
|
-
</header>
|
41
|
+
</header>
|
60
42
|
|
61
|
-
|
43
|
+
{% block after_header %}{% endblock %}
|
62
44
|
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
45
|
+
<main id="content">
|
46
|
+
<div class="container-dialog">
|
47
|
+
<div class="dialog">
|
48
|
+
{% block content %}{% endblock %}
|
49
|
+
</div>
|
67
50
|
</div>
|
68
|
-
</
|
69
|
-
|
70
|
-
|
51
|
+
</main>
|
52
|
+
|
53
|
+
{% block after_content %}{% endblock %}
|
54
|
+
|
55
|
+
<footer id="global-footer" class="{% block footer_class %}{% endblock %}">
|
56
|
+
{% block footer %}{% endblock %}
|
57
|
+
</footer>
|
58
|
+
|
59
|
+
{% block after_footer %}{% endblock %}
|
60
|
+
</body>
|
61
|
+
|
62
|
+
</html>
|
71
63
|
|
72
|
-
|
64
|
+
{% block bottom_of_page %}{% endblock %}
|
@@ -1,73 +1,65 @@
|
|
1
1
|
{% block top_of_page %}{% endblock %}
|
2
2
|
|
3
3
|
<html lang="en">
|
4
|
-
<head>
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
</head>
|
4
|
+
<head>
|
5
|
+
<title>{% block page_title %} {% endblock %}</title>
|
6
|
+
<meta name="viewport" content="width=device-width" />
|
7
|
+
<meta charset="utf-8">
|
8
|
+
{% block head %} {% endblock %}
|
9
|
+
</head>
|
10
10
|
|
11
|
-
<body class="{% block body_classes %}{% endblock %}">
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
11
|
+
<body class="{% block body_classes %}{% endblock %}">
|
12
|
+
<script>
|
13
|
+
document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');
|
14
|
+
</script>
|
15
|
+
{% block body_start %}{% endblock %}
|
16
16
|
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
17
|
+
<header role="banner" id="global-header" class="{% block header_class %}{% endblock %}">
|
18
|
+
<div id="header-wrapper">
|
19
|
+
<div id="header-contents">
|
20
|
+
<div id="header-float-left">
|
21
|
+
<div id="header-logo">
|
22
|
+
<a href="/" title="Home" id="logo" class="content">
|
23
|
+
<div id="coat-of-arms" alt=""></div>
|
24
|
+
<div class="name">DVLA</div>
|
25
|
+
</a>
|
26
|
+
<div id="header-application-title">
|
27
|
+
{% block header_application_title %}{% endblock %}
|
28
|
+
</div>
|
29
29
|
</div>
|
30
|
-
|
31
|
-
|
32
|
-
{% if show_header_search %}
|
33
|
-
<div id="header-search">
|
34
|
-
{% block header_search %}
|
35
|
-
<form>
|
36
|
-
<input type="text" placeholder="Search" />
|
37
|
-
<span class="search-btn"></span>
|
38
|
-
</form>
|
39
|
-
{% endblock %}
|
40
|
-
</div>
|
41
|
-
{% endif %}
|
42
|
-
</div>
|
43
|
-
<div id="header-float-right">
|
44
|
-
{% if show_header_user_account %}
|
45
|
-
<div id="user-account">
|
46
|
-
{% block header_user_account %}
|
47
|
-
<div id="logout">
|
48
|
-
<a href="#">Log out</a>
|
30
|
+
<div id="header-search">
|
31
|
+
{% block header_search %}{% endblock %}
|
49
32
|
</div>
|
50
|
-
|
51
|
-
|
33
|
+
</div>
|
34
|
+
<div id="header-float-right">
|
35
|
+
<div id="user-account">
|
36
|
+
{% block header_user_account %}{% endblock %}
|
52
37
|
</div>
|
53
|
-
{% endblock %}
|
54
38
|
</div>
|
55
|
-
{% endif %}
|
56
39
|
</div>
|
57
40
|
</div>
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
|
41
|
+
{% block global_header_bar %}
|
42
|
+
<div id="global-header-bar"></div>
|
43
|
+
{% endblock %}
|
44
|
+
</header>
|
45
|
+
|
46
|
+
{% block after_header %}{% endblock %}
|
47
|
+
|
48
|
+
<main id="content">
|
49
|
+
<div class="container">
|
50
|
+
{% block content %}{% endblock %}
|
51
|
+
</div>
|
52
|
+
</main>
|
53
|
+
|
54
|
+
{% block after_content %}{% endblock %}
|
55
|
+
|
56
|
+
<footer id="global-footer" class="{% block footer_class %}{% endblock %}">
|
57
|
+
{% block footer %}{% endblock %}
|
58
|
+
</footer>
|
63
59
|
|
64
|
-
|
60
|
+
{% block after_footer %}{% endblock %}
|
61
|
+
</body>
|
65
62
|
|
66
|
-
|
67
|
-
<div class="container">
|
68
|
-
{% block content %}{% endblock %}
|
69
|
-
</div>
|
70
|
-
</main>
|
71
|
-
</body>
|
63
|
+
</html>
|
72
64
|
|
73
|
-
|
65
|
+
{% block bottom_of_page %}{% endblock %}
|
@@ -1,70 +1,64 @@
|
|
1
1
|
{% block top_of_page %}{% endblock %}
|
2
2
|
|
3
3
|
<html lang="en">
|
4
|
-
<head>
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
</head>
|
4
|
+
<head>
|
5
|
+
<title>{% block page_title %} {% endblock %}</title>
|
6
|
+
<meta name="viewport" content="width=device-width" />
|
7
|
+
<meta charset="utf-8">
|
8
|
+
{% block head %} {% endblock %}
|
9
|
+
</head>
|
10
10
|
|
11
|
-
<body class="{% block body_classes %}{% endblock %}">
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
11
|
+
<body class="{% block body_classes %}{% endblock %}">
|
12
|
+
<script>
|
13
|
+
document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');
|
14
|
+
</script>
|
15
|
+
{% block body_start %}{% endblock %}
|
16
16
|
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
17
|
+
<header role="banner" id="global-header" class="{% block header_class %}{% endblock %}">
|
18
|
+
<div id="header-wrapper">
|
19
|
+
<div id="header-contents">
|
20
|
+
<div id="header-float-left">
|
21
|
+
<div id="header-logo">
|
22
|
+
<a href="/" title="Home" id="logo" class="content">
|
23
|
+
<div id="coat-of-arms" alt=""></div>
|
24
|
+
<div class="name">DVLA</div>
|
25
|
+
</a>
|
26
|
+
<div id="header-application-title">
|
27
|
+
{% block header_application_title %}{% endblock %}
|
28
|
+
</div>
|
29
29
|
</div>
|
30
|
-
|
31
|
-
|
32
|
-
{% if show_header_search %}
|
33
|
-
<div id="header-search">
|
34
|
-
{% block header_search %}
|
35
|
-
<form>
|
36
|
-
<input type="text" placeholder="Search" />
|
37
|
-
<span class="search-btn"></span>
|
38
|
-
</form>
|
39
|
-
{% endblock %}
|
40
|
-
</div>
|
41
|
-
{% endif %}
|
42
|
-
</div>
|
43
|
-
<div id="header-float-right">
|
44
|
-
{% if show_header_user_account %}
|
45
|
-
<div id="user-account">
|
46
|
-
{% block header_user_account %}
|
47
|
-
<div id="logout">
|
48
|
-
<a href="#">Log out</a>
|
30
|
+
<div id="header-search">
|
31
|
+
{% block header_search %}{% endblock %}
|
49
32
|
</div>
|
50
|
-
|
51
|
-
|
33
|
+
</div>
|
34
|
+
<div id="header-float-right">
|
35
|
+
<div id="user-account">
|
36
|
+
{% block header_user_account %}{% endblock %}
|
52
37
|
</div>
|
53
|
-
{% endblock %}
|
54
38
|
</div>
|
55
|
-
{% endif %}
|
56
39
|
</div>
|
57
40
|
</div>
|
58
|
-
|
59
|
-
|
41
|
+
{% block tabs_top %}{% endblock %}
|
42
|
+
</header>
|
43
|
+
|
44
|
+
{% block after_header %}{% endblock %}
|
45
|
+
|
46
|
+
<main id="content">
|
47
|
+
{% block tabs_left %}{% endblock %}
|
48
|
+
<div class="container-fluid">
|
49
|
+
{% block content %}{% endblock %}
|
50
|
+
</div>
|
51
|
+
</main>
|
52
|
+
|
53
|
+
{% block after_content %}{% endblock %}
|
54
|
+
|
55
|
+
<footer id="global-footer" class="{% block footer_class %}{% endblock %}">
|
56
|
+
{% block footer %}{% endblock %}
|
57
|
+
</footer>
|
60
58
|
|
61
|
-
|
59
|
+
{% block after_footer %}{% endblock %}
|
60
|
+
</body>
|
62
61
|
|
63
|
-
|
64
|
-
<div class="container-fluid">
|
65
|
-
{% block content %}{% endblock %}
|
66
|
-
</div>
|
67
|
-
</main>
|
68
|
-
</body>
|
62
|
+
</html>
|
69
63
|
|
70
|
-
|
64
|
+
{% block bottom_of_page %}{% endblock %}
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: dvla_internal_frontend_toolkit
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version:
|
4
|
+
version: 2.0.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Liam Betsworth
|
@@ -10,7 +10,7 @@ authors:
|
|
10
10
|
autorequire:
|
11
11
|
bindir: exe
|
12
12
|
cert_chain: []
|
13
|
-
date: 2017-11-
|
13
|
+
date: 2017-11-29 00:00:00.000000000 Z
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: railties
|
@@ -68,6 +68,9 @@ files:
|
|
68
68
|
- app/assets/fonts/Inter-UI-Regular.woff
|
69
69
|
- app/assets/fonts/dvla-icons.woff
|
70
70
|
- app/assets/images/coat-of-arms-logo.svg
|
71
|
+
- app/assets/images/examples/dialog.png
|
72
|
+
- app/assets/images/examples/fixed.png
|
73
|
+
- app/assets/images/examples/fluid.png
|
71
74
|
- app/assets/images/favicon.ico
|
72
75
|
- app/assets/images/separator.png
|
73
76
|
- app/assets/images/triangle-caret-down.svg
|
@@ -99,15 +102,9 @@ files:
|
|
99
102
|
- app/assets/stylesheets/styleguide/_styleguide.scss
|
100
103
|
- app/views/layouts/erb/layout-dialog.html.erb
|
101
104
|
- app/views/layouts/erb/layout-fixed.html.erb
|
102
|
-
- app/views/layouts/erb/layout-fluid-tabs-left.html.erb
|
103
|
-
- app/views/layouts/erb/layout-fluid-tabs-top.html.erb
|
104
|
-
- app/views/layouts/erb/layout-fluid-tabs.html.erb
|
105
105
|
- app/views/layouts/erb/layout-fluid.html.erb
|
106
106
|
- app/views/layouts/nunjucks/layout-dialog.html
|
107
107
|
- app/views/layouts/nunjucks/layout-fixed.html
|
108
|
-
- app/views/layouts/nunjucks/layout-fluid-tabs-left.html
|
109
|
-
- app/views/layouts/nunjucks/layout-fluid-tabs-top.html
|
110
|
-
- app/views/layouts/nunjucks/layout-fluid-tabs.html
|
111
108
|
- app/views/layouts/nunjucks/layout-fluid.html
|
112
109
|
- lib/dvla_internal_frontend_toolkit.rb
|
113
110
|
- lib/dvla_internal_frontend_toolkit/version.rb
|
@@ -1,64 +0,0 @@
|
|
1
|
-
<%= yield :top_of_page %>
|
2
|
-
|
3
|
-
<html lang="en">
|
4
|
-
<head>
|
5
|
-
<title><%= yield :page_title %> </title>
|
6
|
-
<meta name="viewport" content="width=device-width" />
|
7
|
-
<meta charset="utf-8">
|
8
|
-
<%= yield :head %>
|
9
|
-
</head>
|
10
|
-
|
11
|
-
<body class="<%= yield :body_classes %>">
|
12
|
-
<script>
|
13
|
-
document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');
|
14
|
-
</script>
|
15
|
-
<%= yield :body_start %>
|
16
|
-
|
17
|
-
<header role="banner" id="global-header" class="<%= yield :header_class%>">
|
18
|
-
<div id="header-wrapper">
|
19
|
-
<div id="header-contents">
|
20
|
-
<div id="header-float-left">
|
21
|
-
<div id="header-logo">
|
22
|
-
<a href="/" title="Home" id="logo" class="content">
|
23
|
-
<div id="coat-of-arms" alt=""></div>
|
24
|
-
<div class="name">DVLA</div>
|
25
|
-
</a>
|
26
|
-
<div id="header-application-title">
|
27
|
-
<%= yield :header_application_title %>
|
28
|
-
</div>
|
29
|
-
</div>
|
30
|
-
<div id="header-search">
|
31
|
-
<%= yield :header_search %>
|
32
|
-
</div>
|
33
|
-
</div>
|
34
|
-
<div id="header-float-right">
|
35
|
-
<div id="user-account">
|
36
|
-
<%= yield :header_user_account %>
|
37
|
-
</div>
|
38
|
-
</div>
|
39
|
-
</div>
|
40
|
-
</div>
|
41
|
-
</header>
|
42
|
-
|
43
|
-
<%= yield :after_header %>
|
44
|
-
|
45
|
-
<main id="content">
|
46
|
-
<div class="side-bar">
|
47
|
-
<% if content_for?(:tabs_left) %>
|
48
|
-
<%= yield :tabs_left %>
|
49
|
-
<% else %>
|
50
|
-
<ul>
|
51
|
-
<li><a href="#">Tab title one</a></li>
|
52
|
-
<li class="active"><a href="#">Tab title two</a></li>
|
53
|
-
<li><a href="#">Tab title three</a></li>
|
54
|
-
<li><a href="#">Tab title four</a></li>
|
55
|
-
</ul>
|
56
|
-
<% end %>
|
57
|
-
</div>
|
58
|
-
<div class="container-fluid">
|
59
|
-
<%= yield :content %>
|
60
|
-
</div>
|
61
|
-
</main>
|
62
|
-
</body>
|
63
|
-
|
64
|
-
</html>
|