dvla_internal_frontend_toolkit 1.0.7 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- 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>
|