Thanks for importing Broadcast \ud83d\ude42<\/p>\n\n\n\n
Broadcast is constructed primarily using GP\u2019s awesome built-in features with some CSS to provide custom styles.<\/p>\n\n\n\n
The sections below provides a quick overview on how the site was built and some potential modifications. All the CSS mentioned below can be found in the Additional CSS<\/a> field in the customizer.<\/p>\n\n\n\n The header\/navigation is simply created using the customizer options. You can modify them in Site Identity<\/a>, Primary Navigation<\/a> and Sticky Navigation<\/a> sections in the customizer.<\/p>\n\n\n\n The section below the primary navigation is created using the Header Element<\/a> module. You can find 4 header elements in CSS is used to provide a unique container width, gradient background and styles for the This site is an excellent resource to tweak the gradient to your liking: https:\/\/cssgradient.io\/<\/a>.<\/p>\n\n\n\n The following CSS is used to style the main container, include merging with the header element above.<\/p>\n\n\n\n The home page posts list can be modified using our Blog<\/a> module.<\/p>\n\n\n\n Here is the CSS used to style them:<\/p>\n\n\n\n The plugin Recent Posts Widget With Thumbnails<\/a> is used in the left sidebar widgets area to show recent posts in single posts<\/a>.<\/p>\n\n\n\n The first sidebar widget is colored with this CSS below:<\/p>\n\n\n\n Thanks for importing Broadcast \ud83d\ude42 Broadcast is constructed primarily using GP\u2019s awesome built-in features with … <\/p>\nHeader\/Navigation<\/h2>\n\n\n\n
Header Element\/Page Hero<\/h2>\n\n\n\n
Appearance > Elements: Pages hero<\/em>, Archives hero<\/em>, Posts hero<\/em> and Home hero<\/em>.<\/p>\n\n\n\n<h2><\/code> and <p><\/code> elements:<\/p>\n\n\n\n\/* Page hero styles *\/\n.page-hero.gradient {\n background-image: linear-gradient( 145deg, transparent 0%, rgba(255,255,255, 0.5) 100%);\n max-width: 1440px;\n margin: auto;\n}\n.inside-page-hero h2 {\n font-size: 40px;\n}\n.inside-page-hero p {\n font-size: 20px;\n}<\/code><\/pre>\n\n\n\nGeneral Container<\/h2>\n\n\n\n
\/* Main container styles *\/\n.separate-containers .page-hero + #page .site-main {\n margin-top: -80px !important;\n}\n@media (max-width: 768px) {\n body .site.grid-container {\n margin-left: 20px;\n margin-right: 20px;\n }\n}\n.site-content .inside-article, .sidebar .widget, .comments-area {\n box-shadow: 0px 0px 0px 1px rgba(214,218,222,1);\n}<\/code><\/pre>\n\n\n\nPosts List<\/h2>\n\n\n\n
\/* Posts grid styles *\/\n@media (min-width: 769px) {\n .generate-columns .inside-article {\n transition: all 0.2s ease-in;\n transform: scale(1);\n }\n .generate-columns .inside-article:hover {\n transform: scale(1.01);\n box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);\n }\n p.read-more-container {\n opacity: 0;\n transition: all 0.3s ease-in-out;\n }\n .generate-columns .inside-article:hover p.read-more-container {\n opacity: 1;\n }\n}\n.generate-columns .inside-article {\n display: flex;\n flex-direction: column;\n border-radius: 3px;\n}\n.generate-columns .inside-article .entry-summary {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n}\n.entry-summary p:not(.read-more-container) {\n display: none;\n}\n.read-more-container {\n margin-top: auto;\n text-align: center;\n}\nbutton, html input[type=\"button\"], input[type=\"reset\"], input[type=\"submit\"], a.button, a.button:visited {\n border-width: 1px;\n border-style: solid;\n border-color: inherit;\n border-radius: 3px;\n}\n.blog footer.entry-meta, .archive footer.entry-meta {\n margin-top: 0;\n}<\/code><\/pre>\n\n\n\nSidebar<\/h2>\n\n\n\n
\/* Sidebar styles *\/\n.sidebar .widget:first-child {\n background-image: linear-gradient( 145deg, rgb(164,218,216) 0%, rgb(228,243,242) 100%);\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"