1+ : root {
2+ font-family : Calibri, Gill Sans, Gill Sans MT, Liberation Sans, Carlito, -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
3+
4+ --ces-dogu-starting-color : var (--ces-color-brand , # 00629E );
5+ --ces-dogu-starting-button-color-bg : var (--ces-dogu-starting-color , # 00629E );
6+ --ces-dogu-starting-button-color-text : var (--ces-color-inverted-text , # FCFCFD );
7+ --ces-dogu-starting-button-color-hover : var (--ces-color-brand-strong , # 00426B );
8+ --ces-dogu-starting-button-color-active : var (--ces-color-brand-stronger , # 003250 );
9+
10+ --ces-dogu-starting-logo : url ("../img/dogu-starting.svg" );
11+ --ces-dogu-starting-logo-width : 20rem ;
12+ --ces-dogu-starting-logo-height-mobile : 12rem ;
13+
14+ --ces-dogu-starting-docs-visibility : visible;
15+
16+ color : var (--ces-dogu-starting-color );
17+ }
18+
19+ body {
20+ margin : 0 ;
21+ }
22+
23+ .dogu-starting {
24+ margin : 2rem ;
25+ height : calc (100vh - 4rem );
26+ display : flex;
27+ flex-flow : row;
28+ justify-content : center;
29+ align-items : center;
30+ gap : 2rem ;
31+ }
32+
33+ .dogu-starting .logo {
34+ width : var (--ces-dogu-starting-logo-width );
35+ content : var (--ces-dogu-starting-logo );
36+ }
37+
38+ .dogu-starting h1 {
39+ font-size : 8.5rem ;
40+ font-weight : 400 ;
41+ line-height : 9rem ;
42+ margin : 0 ;
43+ }
44+
45+ .dogu-starting h2 {
46+ font-size : 3rem ;
47+ font-weight : 400 ;
48+ line-height : 4rem ;
49+ margin : 0 ;
50+ }
51+
52+ .dogu-starting .actions {
53+ margin : 1rem 0 ;
54+ display : flex;
55+ gap : 1rem ;
56+ align-items : center;
57+ }
58+
59+ .dogu-starting .actions .docs-link {
60+ visibility : var (--ces-dogu-starting-docs-visibility );
61+ }
62+
63+ .dogu-starting button {
64+ cursor : pointer;
65+ padding : .5rem .625rem ;
66+ border : 0 ;
67+ border-radius : 2.5rem ;
68+ background-color : var (--ces-dogu-starting-button-color-bg );
69+ color : var (--ces-dogu-starting-button-color-text );
70+ font-weight : 700 ;
71+ line-height : 1.5rem ;
72+ }
73+
74+ .dogu-starting button : hover {
75+ background-color : var (--ces-dogu-starting-button-color-hover );
76+ }
77+
78+ .dogu-starting button : active {
79+ background-color : var (--ces-dogu-starting-button-color-active );
80+ }
81+
82+ .dogu-starting button : focus-visible , a : focus-visible {
83+ outline : none;
84+ box-shadow : 0 0 0 2px var (--ces-color-default-focus-inner ), 0 0 0 4px var (--ces-color-default-focus-outer );
85+ }
86+
87+ .dogu-starting button svg {
88+ margin-left : .375rem ;
89+ vertical-align : text-bottom;
90+ }
91+
92+ .dogu-starting a , .dogu-starting a : visited {
93+ text-decoration-line : underline;
94+ text-decoration-style : dashed;
95+ text-decoration-thickness : 1px ;
96+ text-decoration-color : var (--ces-dogu-starting-color );
97+ color : var (--ces-dogu-starting-color );
98+ font-weight : 700 ;
99+ }
100+
101+ .dogu-starting a : hover {
102+ text-decoration-style : solid;
103+ }
104+
105+ @media (max-width : 767px ) {
106+ .dogu-starting {
107+ flex-flow : column;
108+ justify-content : flex-start;
109+ text-align : center;
110+ }
111+
112+ .dogu-starting .logo {
113+ width : unset;
114+ height : var (--ces-dogu-starting-logo-height-mobile );
115+ }
116+
117+ .dogu-starting h1 {
118+ font-size : 4.25rem ;
119+ line-height : 4.5rem ;
120+ }
121+
122+ .dogu-starting h2 {
123+ font-size : 1.5rem ;
124+ line-height : 2rem ;
125+ }
126+
127+ .dogu-starting .actions {
128+ flex-flow : column;
129+ align-items : center;
130+ }
131+ }
0 commit comments