Widget: Homepage: Difference between revisions
From LINKS Community Center
Eschmidt (talk | contribs) No edit summary |
Eschmidt (talk | contribs) No edit summary |
||
Line 3: | Line 3: | ||
#hp-wrapper { font-family: 'Open Sans'; } | #hp-wrapper { font-family: 'Open Sans'; } | ||
#hp-heading { | #hp-heading { | ||
padding: | padding: 1em; | ||
margin-bottom: 8em; | margin-bottom: 8em; | ||
background: | background: | ||
Line 14: | Line 14: | ||
} | } | ||
.loaded #hp-heading { clip-path: inset(0); } | .loaded #hp-heading { clip-path: inset(0); } | ||
#hp-heading h1 { font-family: 'Raleway'; font-size: | #hp-heading h1 { font-family: 'Raleway'; font-size: 3.7em; margin-bottom: .5em; } | ||
#hp-heading h1 span { | #hp-heading h1 span { | ||
display: block; | display: block; | ||
Line 26: | Line 26: | ||
#hp-heading h1 span:nth-child(2) { font-weight: 500; transition-delay: 400ms; } | #hp-heading h1 span:nth-child(2) { font-weight: 500; transition-delay: 400ms; } | ||
#hp-heading h1 span:nth-child(3) { font-weight: 100; transition-delay: 500ms; } | #hp-heading h1 span:nth-child(3) { font-weight: 100; transition-delay: 500ms; } | ||
#hp-heading .hp-lead { font-size: | #hp-heading .hp-lead { font-size: 1.4em; font-weight: 300; margin-bottom: 2em; opacity: 0; transition: all 500ms ease-in-out 1000ms; } | ||
.loaded #hp-heading .hp-lead { opacity: .95; } | .loaded #hp-heading .hp-lead { opacity: .95; } | ||
.hp-large-button { | .hp-large-button { | ||
display: inline-block; | display: inline-block; | ||
font-weight: 600; | font-weight: 600; | ||
font-size: 1. | font-size: 1.3em; | ||
padding: .5em; | padding: .5em; | ||
border: 1px solid rgba(0, 0, 0, .9); | border: 1px solid rgba(0, 0, 0, .9); | ||
Line 72: | Line 72: | ||
@media screen and (min-width: 992px) { | @media screen and (min-width: 992px) { | ||
#hp-heading { padding: 3em; } | #hp-heading { padding: 3em; } | ||
#hp-heading .hp-lead { max-width: 50%; } | #hp-heading h1 { font-size: 5em; } | ||
#hp-heading .hp-lead { max-width: 50%; font-size: 2em; } | |||
.hp-large-button { font-size: 1.6em; } | |||
} | } | ||
</style> | </style> |
Revision as of 13:57, 24 May 2022
Development verstion of the DCT Homepage.
Not ready for production!