@angelscmf/front 1.0.14 → 1.0.15

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.
Files changed (4) hide show
  1. package/package.json +1 -1
  2. package/sass/_AngelsHTMLElements.scss +36 -6
  3. package/sass/_AngelsPageLayout.scss +66 -5
  4. package/sass/_AngelsTheme.scss +2 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@angelscmf/front",
3
- "version": "1.0.14",
3
+ "version": "1.0.15",
4
4
  "description": "",
5
5
  "license": "ISC",
6
6
  "author": "",
package/sass/_AngelsHTMLElements.scss CHANGED
@@ -92,52 +92,82 @@ button[type=submit] {
92
92
  }
93
93
  }
94
94
 
95
+ :root {
96
+ --a-header1-margin: 0;
97
+ --a-header1-size: #{AngelsVariables.$a-font-size + 6};
98
+ }
99
+
95
100
  h1,
96
101
  h1.a-h1 {
97
102
  color: var(--a-header-color);
98
103
  font-size: var(--a-header1-size);
99
- margin: 0 0 12px 0;
104
+ margin: var(--a-header1-margin);
100
105
  padding: 0;
101
106
  }
102
107
 
108
+ :root {
109
+ --a-header2-margin: 0;
110
+ --a-header2-size: #{AngelsVariables.$a-font-size + 5};
111
+ }
112
+
103
113
  h2,
104
114
  h2.a-h2 {
105
115
  color: var(--a-header-color);
106
116
  font-size: var(--a-header2-size);
107
117
  font-weight: normal;
108
118
  letter-spacing: 2px;
109
- margin: 0 0 12px 0;
119
+ margin: var(--a-header2-margin);
110
120
  padding: 0;
111
121
  }
112
122
 
123
+ :root {
124
+ --a-header3-margin: 0;
125
+ --a-header3-size: #{AngelsVariables.$a-font-size + 4};
126
+ }
127
+
113
128
  h3,
114
129
  h3.a-h3 {
115
130
  color: var(--a-header-color);
116
131
  font-size: var(--a-header3-size);
117
132
  font-weight: normal;
118
133
  letter-spacing: 2px;
119
- margin: 0 0 8px 0;
134
+ margin: var(--a-header3-margin);
120
135
  padding: 0;
121
136
  }
122
137
 
138
+ :root {
139
+ --a-header4-margin: 0;
140
+ --a-header4-size: #{AngelsVariables.$a-font-size + 3};
141
+ }
142
+
123
143
  h4,
124
144
  h4.a-h4 {
125
145
  font-size: var(--a-header4-size);
126
- margin: 0 0 8px 0;
146
+ margin: var(--a-header4-margin);
127
147
  padding: 0;
128
148
  }
129
149
 
150
+ :root {
151
+ --a-header5-margin: 0;
152
+ --a-header5-size: #{AngelsVariables.$a-font-size + 2};
153
+ }
154
+
130
155
  h5,
131
156
  h5.a-h5 {
132
157
  font-size: var(--a-header5-size);
133
- margin: 0 0 4px 0;
158
+ margin: var(--a-header5-margin);
134
159
  padding: 0;
135
160
  }
136
161
 
162
+ :root {
163
+ --a-header6-margin: 0;
164
+ --a-header6-size: #{AngelsVariables.$a-font-size + 1};
165
+ }
166
+
137
167
  h6,
138
168
  h6.a-h6 {
139
169
  font-size: var(--a-header6-size);
140
- margin: 0 0 4px 0;
170
+ margin: var(--a-header6-margin);
141
171
  padding: 0;
142
172
  }
143
173
 
package/sass/_AngelsPageLayout.scss CHANGED
@@ -63,25 +63,32 @@ a-page-header {
63
63
  }
64
64
  }
65
65
 
66
+ :root {
67
+ --a-page-body-gap: var(--a-4x-size);
68
+ --a-page-body-padding: var(--a-4x-size) var(--a-size);
69
+ }
70
+
66
71
  a-page-body {
67
72
  display: flex;
68
73
  flex-direction: column;
69
74
  flex-grow: 1;
70
- gap: 1em;
71
- padding: 1em;
75
+ gap: var(--a-page-body-gap);
76
+ padding: var(--a-page-body-padding);
72
77
  }
73
78
 
74
79
  :root {
75
80
  --a-page-footer-background-color: #{AngelsVariables.$a-second-background-color};
81
+ --a-page-footer-padding: var(--a-size);
82
+ --a-page-footer-gap: var(--a-double-size);
76
83
  --a-page-footer-text-color: #{AngelsVariables.$a-second-text-color};
77
- --a-page-footer-padding: 1rem;
78
84
  }
79
85
 
80
86
  a-page-footer {
81
87
  background-color: var(--a-page-footer-background-color);
82
88
  color: var(--a-page-footer-text-color);
83
- display: flex;
89
+ display: grid;
84
90
  font-family: monospace;
91
+ gap: var(--a-page-footer-gap);
85
92
  padding: var(--a-page-footer-padding);
86
93
 
87
94
  &:empty {
@@ -101,4 +108,58 @@ a-block-body {
101
108
  gap: var(--a-double-size);
102
109
  }
103
110
 
104
- a-block-footer {}
111
+ a-block-footer {}
112
+
113
+ a-infra {
114
+ color: steelblue;
115
+ display: flex;
116
+ gap: var(--a-double-size);
117
+ flex-wrap: wrap;
118
+ align-items: flex-start;
119
+ justify-content: center;
120
+
121
+ address {
122
+ font-style: normal;
123
+ }
124
+ }
125
+
126
+ a-infral {
127
+ display: grid;
128
+ gap: var(--a-size);
129
+ min-width: 200px;
130
+
131
+ >header {}
132
+
133
+ >nav {
134
+ display: grid;
135
+
136
+ >a {
137
+ width: fit-content;
138
+ }
139
+ }
140
+ }
141
+
142
+ a-law {
143
+ font-family: monospace;
144
+
145
+ display: grid;
146
+ gap: var(--a-size);
147
+ }
148
+
149
+
150
+ a-properties {
151
+ display: grid;
152
+ }
153
+
154
+ a-property {
155
+
156
+ &strong {
157
+
158
+ &::after {
159
+ content: ':';
160
+ display: inline-block;
161
+ }
162
+ }
163
+
164
+ &span {}
165
+ }
package/sass/_AngelsTheme.scss CHANGED
@@ -19,6 +19,8 @@
19
19
  --a-size: 16px;
20
20
  // 2em = 32px;
21
21
  --a-double-size: 32px;
22
+ // 4em = 64px;
23
+ --a-4x-size: 64px;
22
24
  }
23
25
 
24
26
  :root {
@@ -27,12 +29,6 @@
27
29
  --a-font-family: Verdana, Arial, Helvetica, sans-serif;
28
30
  --a-font-size: 16px;
29
31
  --a-header-color: orangered;
30
- --a-header1-size: #{AngelsVariables.$a-font-size + 6};
31
- --a-header2-size: #{AngelsVariables.$a-font-size + 5};
32
- --a-header3-size: #{AngelsVariables.$a-font-size + 4};
33
- --a-header4-size: #{AngelsVariables.$a-font-size + 3};
34
- --a-header5-size: #{AngelsVariables.$a-font-size + 2};
35
- --a-header6-size: #{AngelsVariables.$a-font-size + 1};
36
32
  --a-line-height: 24px;
37
33
  --a-note-color: palevioletred;
38
34
  --a-text-color: #4B2E2E;