1+ {{--
2+
3+
4+ |--------------------------------------------------------------------------
5+ | Custom assets
6+ |--------------------------------------------------------------------------
7+
8+ Custom assets are stored in the 'custom-assets' directory found inside the 'extra' folder.
9+ Custom assets can be any file you would like to use in your theme.
10+ For example: JS, CSS or image files.
11+
12+ You can load these custom assets with a built-in function, 'themeAsset()'.
13+ Add the file you want to add to your 'custom-assets' folder, and include the name with the file extension in the function.
14+
15+ Down below, you can find a few examples using this function:
16+
17+
18+
19+ --}}
20+
21+ <style >
22+ @font -face{font-family :' sottitle' ;src :url (' {{ themeAsset (' windlass.ttf' )} }' )}
23+ @font -face{font-family :' sottext' ;src :url (' {{ themeAsset (' pragroman.ttf' )} }' )}
24+
25+ @media (max - width : 400 px ) {
26+ .button ,
27+ button {
28+ display : inline-block ;
29+ text-decoration : none ;
30+ text-align : center ;
31+ vertical-align : middle ;
32+ font-size : 14px !important ;
33+ color : #fff !important ;
34+ height : 48px ;
35+ width : 100% ;
36+ font-weight : 100 ;
37+ line-height : 48px ;
38+ letter-spacing : 0.1px ;
39+ white-space : wrap ;
40+ cursor : pointer ;
41+ font-family : " sottext" , sans-serif !important ;
42+ text-transform : uppercase ;
43+ background : url ({{ themeAsset (' ../../turquoise-button-sprite.svg#off' )} } ) 0 0 /100% 100% no-repeat !important ;
44+ }
45+ }
46+
47+ @media (max - width : 550 px ) {
48+ .button ,
49+ button {
50+ display : inline-block ;
51+ text-decoration : none ;
52+ text-align : center ;
53+ vertical-align : middle ;
54+ font-size : 14px !important ;
55+ color : #fff !important ;
56+ height : 48px ;
57+ width : 80% ;
58+ font-weight : 100 ;
59+ line-height : 48px ;
60+ letter-spacing : 0.1px ;
61+ white-space : wrap ;
62+ cursor : pointer ;
63+ font-family : " sottext" , sans-serif !important ;
64+ text-transform : uppercase ;
65+ background : url ({{ themeAsset (' ../../turquoise-button-sprite.svg#off' )} } ) 0 0 /100% 100% no-repeat !important ;
66+ }
67+ }
68+
69+ @media (min - width : 551 px ) {
70+ .button ,
71+ button {
72+ display : inline-block ;
73+ text-decoration : none ;
74+ text-align : center ;
75+ vertical-align : middle ;
76+ font-size : 14px !important ;
77+ color : #fff !important ;
78+ height : 60px ;
79+ width : 400px ;
80+ font-weight : 100 ;
81+ line-height : 60px ;
82+ letter-spacing : 0.1px ;
83+ white-space : wrap ;
84+ cursor : pointer ;
85+ font-family : " sottext" , sans-serif !important ;
86+ text-transform : uppercase ;
87+ background : url ({{ themeAsset (' ../../turquoise-button-sprite.svg#off' )} } ) 0 0 /100% 100% no-repeat !important ;
88+ }
89+ }
90+
91+ .sharebutton ,
92+ sharebutton {
93+ display : inline-block ;
94+ text-decoration : none ;
95+ height : 48px ;
96+ text-align : center ;
97+ vertical-align : middle ;
98+ font-size : 14px ;
99+ width : 48px ;
100+ font-weight : 100 ;
101+ line-height : 48px ;
102+ letter-spacing : 0.1px ;
103+ white-space : wrap ;
104+ border-radius : 8px ;
105+ cursor : pointer ;
106+ color : #fff !important ;
107+ background : url ({{ themeAsset (' ../../green-button-sprite.svg#off' )} } ) 0 0 /100% 100% no-repeat !important ;
108+ }
109+ @media screen and (min-width : 600px) {
110+ .sharebutton ,
111+ sharebutton {
112+ display : inline-block ;
113+ text-decoration : none ;
114+ height : 48px ;
115+ text-align : center ;
116+ vertical-align : middle ;
117+ font-size : 14px ;
118+ width : 150px ;
119+ font-weight : 100 ;
120+ line-height : 48px ;
121+ letter-spacing : 0.1px ;
122+ white-space : wrap ;
123+ border-radius : 8px ;
124+ cursor : pointer ;
125+ color : #fff !important ;
126+ background : url ({{ themeAsset (' ../../green-button-sprite.svg#off' )} } ) 0 0 /100% 100% no-repeat !important ;
127+ }
128+ }
129+ html {
130+ font-size : 100% ; }
131+ body {
132+ font-size : 18px ;
133+ line-height : 24px ;
134+ font-weight : 400 ;
135+ color : #F1F1F1 !important ;
136+ font-family : " sottext" , sans-serif ;
137+ text-transform : uppercase ;
138+ background :
139+ linear-gradient (
140+ rgba (0 , 0 , 0 , 0.7 ),
141+ rgba (0 , 0 , 0 , 0.7 )
142+ ),
143+ url ({{ themeAsset (' ../../background.jpg' )} } );
144+ background-size : cover ;
145+ color : #222 ; }
146+ </style >
0 commit comments