Widget: Homepage: Difference between revisions

From LINKS Community Center
Jump to: navigation, search
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: .5em;
             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: 5em; margin-bottom: .5em; }
         #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: 2em; font-weight: 300; margin-bottom: 2em; opacity: 0; transition: all 500ms ease-in-out 1000ms; }
         #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.6em;
             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!