modified the contact form
[theme-danix.xyz.git] / assets / sass / layout / _contact.scss
CommitLineData
748286b5 1///\r
2/// Forty by HTML5 UP\r
3/// html5up.net | @ajlkn\r
4/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)\r
5///\r
6\r
7/* Contact */\r
8\r
9 #contact {\r
cb4379e1 10 border-bottom: solid 1px _palette_light(border);\r
748286b5 11 overflow-x: hidden;\r
cb4379e1 12 @media screen and (prefers-color-scheme: dark) {\r
3a494925 13 border-bottom: solid 1px _palette_dark(fg-light);\r
cb4379e1 14 }\r
748286b5 15\r
16 > .inner {\r
17 @include vendor('display', 'flex');\r
18 padding: 0 !important;\r
19\r
20 > :nth-child(2n - 1) {\r
21 @include padding(4em, 0, (0, 3em, 0, 0));\r
cb4379e1 22 border-right: solid 1px _palette_light(border);\r
748286b5 23 width: 60%;\r
cb4379e1 24 @media screen and (prefers-color-scheme: dark) {\r
3a494925 25 border-right: solid 1px _palette_dark(fg-light);\r
cb4379e1 26 }\r
748286b5 27 }\r
28\r
29 > :nth-child(2n) {\r
30 padding-left: 3em;\r
31 width: 40%;\r
32 }\r
33\r
34 > .split {\r
35 padding: 0;\r
36\r
37 > * {\r
38 @include padding(3em, 0, (0, 0, 0, 3em));\r
39 position: relative;\r
40\r
41 &:before {\r
cb4379e1 42 border-top: solid 1px _palette_light(border);\r
748286b5 43 content: '';\r
44 display: block;\r
45 margin-left: -3em;\r
46 position: absolute;\r
47 top: 0;\r
48 width: calc(100vw + 3em);\r
cb4379e1 49 @media screen and (prefers-color-scheme: dark) {\r
3a494925 50 border-top: solid 1px _palette_dark(fg-light);\r
cb4379e1 51 }\r
748286b5 52 }\r
53 }\r
54\r
55 > :first-child {\r
56 &:before {\r
57 display: none;\r
58 }\r
59 }\r
60 }\r
61 }\r
62\r
63 @include breakpoint('<=medium') {\r
64 > .inner {\r
65 display: block;\r
66\r
67 > :nth-child(2n - 1) {\r
68 @include padding(4em, 0, (0, 0, 0, 0));\r
69 border-right: 0;\r
70 width: 100%;\r
71 }\r
72\r
73 > :nth-child(2n) {\r
74 padding-left: 0;\r
75 width: 100%;\r
76 }\r
77\r
78 > .split {\r
79 > * {\r
80 @include padding(3em, 0, (0, 0, 0, 0));\r
81\r
82 &:before {\r
83 }\r
84 }\r
85\r
86 > :first-child {\r
87 &:before {\r
88 display: block;\r
89 }\r
90 }\r
91 }\r
92 }\r
93 }\r
94\r
95 @include breakpoint('<=small') {\r
96 > .inner {\r
97 > :nth-child(2n - 1) {\r
98 @include padding(3em, 0, (0, 0, 0, 0));\r
99 }\r
100 }\r
101 }\r
102 }