X-Git-Url: https://vcs.fsf.org/?a=blobdiff_plain;ds=sidebyside;f=css%2Fstyle.css;h=f76df7ee24112793c03816bf833ac67023bf2246;hb=4f6bd63cd78ae63c433d0da55c4444e979394c8b;hp=f32be95ab3708cb35337d1799454d0e58aae66a4;hpb=8499d9cd397b32ed2a6164cdeeb87dedc2e82059;p=ryf-theme.git diff --git a/css/style.css b/css/style.css index f32be95..f76df7e 100644 --- a/css/style.css +++ b/css/style.css @@ -3,10 +3,61 @@ * your custom CSS modifications here. */ -body { margin: 0; min-width: 320px; } +body { + font-family: "FreeSans", Helvetica, Arial, sans-serif; + margin: 0; + min-width: 320px; +} a { transition: 0.3s; } +section { position: relative; } + +/* etcetera */ + +.region-content { min-height: 300px; } + +h2.block-title { + background: #000; + color: #FFF; + padding: 0.5em; +} + +.feed-icons a { + background: url('../images/rss.svg') top left no-repeat; + background-size: contain; + height: 20px; + overflow: hidden; + display: block; + text-indent: 25px; + font-size: 1em; + width: fit-content; + margin: auto; + margin-top: 1em; +} + +.view-display-id-news_page .feed-icons a { + margin-top: -30px; +} + +.more-link { + border: 1px solid #ddd; + border-radius: .5em; + padding: .5em; + text-align: center; + width: 50%; + margin: 0 auto; + font-weight: bold; +} + +.more-link:hover { border: 1px solid #000; } + +.block-views { + margin-top: 20px; +} + +/* Navbar */ + .navbar-default { background: #000; color: #FFF; @@ -14,7 +65,6 @@ a { transition: 0.3s; } border-radius: 0px; box-sizing: content-box; align-items: center; - margin-bottom: 100px; min-height: 100px; } @@ -38,9 +88,13 @@ a { transition: 0.3s; } #block-ryf-main-menu .navbar-nav { margin-left: 180px; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > li > a { +.navbar-default .navbar-nav > li > a:focus { + outline: none; +} + +.navbar-default .navbar-nav > li > a, +.navbar-default .navbar-nav > li > a:link, +.navbar-default .navbar-nav > li > a:visited { color: #FFF; background: #000; border-bottom: 2px solid transparent; @@ -48,11 +102,18 @@ a { transition: 0.3s; } margin-bottom: 5px; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > li > a:hover { - color: #edd400; - border-bottom: 2px solid #edd400; +.navbar-default .navbar-nav > li.active > a:hover, +.navbar-default .navbar-nav > li > a:hover { + color: #337AB7; + background: #000; + border-bottom: 2px solid #337AB7; + padding-bottom: 5px; + margin-bottom: 10px; +} + +.navbar-default .navbar-nav > li > a.is-active { + border-bottom: 2px solid #FFF; + background: #000; padding-bottom: 5px; margin-bottom: 10px; } @@ -67,24 +128,51 @@ a { transition: 0.3s; } float: right; } -@media screen and (min-width: 520px) and (max-width: 599px) { - .logo img { margin-left: 50px; } - #block-ryf-main-menu .navbar-nav { margin-left: 230px; } -} - -@media screen and (min-width: 600px) and (max-width: 767px) { - .logo img { margin-left: 100px; } - #block-ryf-main-menu .navbar-nav { margin-left: 280px; } -} - -@media screen and (max-width: 767px) { - .logo img { height: 150px; margin-top: 25px; } - .navbar-default { min-height: 230px; margin-bottom: 30px; } - #block-ryf-main-menu .navbar-nav { max-width: 130px; } -} - +nav .search-block-form { + position: absolute; + width: 300px; + right: 10%; + top: 30px; +} + +/* + * @media screen and (min-width: 520px) and (max-width: 599px) { + * .logo img { margin-left: 50px; } + * #block-ryf-main-menu .navbar-nav { margin-left: 230px; } + * } + * + * @media screen and (min-width: 600px) and (max-width: 767px) { + * .logo img { margin-left: 100px; } + * #block-ryf-main-menu .navbar-nav { margin-left: 280px; } + * } + * + * @media screen and (max-width: 767px) { + * .logo img { height: 150px; margin-top: 25px; } + * .navbar-default { min-height: 230px; margin-bottom: 30px; } + * #block-ryf-main-menu .navbar-nav { max-width: 130px; } + * } + * + */ + @media screen and (min-width: 768px) { - .navbar-nav { margin-top: 40px; } + + .navbar-default { + margin-bottom: 100px; + } + .navbar-nav { + margin-top: 40px; + } + .region-header .breadcrumb { + position: absolute; + top: -70px; + left: 200px; + background: none; + } + .region-navigation-collapsible .search-block-form { + float: right; + padding-top: 30px; + width: 210px; + } } @@ -104,7 +192,7 @@ a { transition: 0.3s; } /* RYF List */ -.ryf-list-row ul { +.ryf-list-row { padding: 0; margin: 0 auto; overflow: auto; @@ -114,7 +202,7 @@ a { transition: 0.3s; } float: left; margin: 0; padding: 0.5em; - position:relative; + position: relative; list-style: none; } @@ -140,11 +228,13 @@ a { transition: 0.3s; } } .ryf-list .field--name-field-image { - margin: 0 auto; + margin: 0 auto 10px auto; } .ryf-list img { max-width: 150px; + max-height: 150px; + object-fit: contain; overflow: hidden; } @@ -163,7 +253,7 @@ a { transition: 0.3s; } } .ryf-list a { - color: #118991; + color: #337AB7; text-decoration: none; } @@ -187,13 +277,8 @@ a { transition: 0.3s; } text-align: right; } -.feed-icons { - margin-top: 15px; - clear: both; -} - @media screen and (min-width: 450px) and (max-width: 659px) { - .ryf-list-row ul { + .ryf-list-row { max-width: 600px; } .ryf-list { @@ -203,7 +288,7 @@ a { transition: 0.3s; } } } @media screen and (min-width: 660px) and (max-width: 767px) { - .ryf-list-row ul { + .ryf-list-row { max-width: 600px; } .ryf-list-row { @@ -214,13 +299,14 @@ a { transition: 0.3s; } max-width: 300px; float: left; } + .auto-clear .col-xs-12:nth-child(odd){clear:left;} } /* Vendors list */ -.vendors-list-row ul { +.vendors-list-row { padding: 10px; margin: 0 auto; overflow: auto; @@ -320,8 +406,13 @@ a { transition: 0.3s; } clear: left; } +.view-taxonomy-term .view-header .field--name-field-vendor-support-link, +.view-taxonomy-term .view-header .field--name-field-vendor-support-email { + margin-top: 15px; +} + @media screen and (max-width: 559px) { - .view-taxonomy-term .view-header { + .view-taxonomy-term.view-display-id-taxonomy_term_vendor .view-header { margin: 0 auto 40px auto; overflow: auto; @@ -332,16 +423,18 @@ a { transition: 0.3s; } width: 220px; } - .view-taxonomy-term .view-header .field--name-description { + .view-taxonomy-term .view-header .field--name-description, + .view-taxonomy-term .view-header .field--name-field-vendor-support-link, + .view-taxonomy-term .view-header .field--name-field-vendor-support-email { max-width: 360px; - margin: 0 auto; + margin: 15px auto 0 auto; padding: 0 10px; } } @media screen and (min-width: 560px) { - .view-taxonomy-term .view-header { + .view-taxonomy-term.view-display-id-taxonomy_term_vendor .view-header { margin: 0 0 40px 0; overflow: auto; @@ -353,7 +446,9 @@ a { transition: 0.3s; } float: left; } - .view-taxonomy-term .view-header .field--name-description { + .view-taxonomy-term .view-header .field--name-description, + .view-taxonomy-term .view-header .field--name-field-vendor-support-link, + .view-taxonomy-term .view-header .field--name-field-vendor-support-email { margin-left: 260px; } @@ -393,13 +488,14 @@ a { transition: 0.3s; } .page-node-type-product .product .field--name-field-image { padding: 10px; - display: flex; - align-items: center; - border: 1px solid #888; border-radius: 10px; } +.page-node-type-product .product .field--name-field-image img { + margin: 0 auto; +} + .page-node-type-product .product .field--name-field-extra-images { padding: 5px; @@ -463,10 +559,12 @@ a { transition: 0.3s; } .page-node-type-product .product .field--name-field-categories, .page-node-type-product .product .field--name-field-vendor { + margin-bottom: 0px; float: left; } .page-node-type-product .product .field--name-body { + padding-top: 20px; clear: both; } } @@ -511,12 +609,16 @@ a { transition: 0.3s; } .page-node-type-product-announcement .page-header, +.page-node-type-product-announcement .tabs--primary, .page-node-type-product-announcement .region-content, .page-node-type-general-news-item .page-header, +.page-node-type-general-news-item .tabs--primary, .page-node-type-general-news-item .region-content, .page-node-type-page .page-header, +.page-node-type-page .tabs--primary, .page-node-type-page .region-content, .path-news .page-header, +.path-news .tabs--primary, .path-news .region-content { max-width: 800px; margin: 0 auto; @@ -524,6 +626,7 @@ a { transition: 0.3s; } /* don't apply above max-width rule to main page */ .path-frontpage .page-header, +.path-frontpage .tabs--primary, .path-frontpage .region-content { max-width: 2000px; /* high number beyond the max */ } @@ -532,7 +635,8 @@ a { transition: 0.3s; } margin-bottom: 20px; } -.path-news h2 { +.path-news h2, +.block-views-blocknews-news-block article h2 { font-size: 25px; } @@ -558,6 +662,61 @@ a { transition: 0.3s; } } +/* Search Results */ + + +@media screen and (max-width: 600px) { + .path-search .region-content > ol { + width: 300px; + } +} +@media screen and (min-width: 601px) and (max-width 1000px) { + .path-search .region-content > ol { + width: 560px; + } +} +@media screen and (min-width: 1001px) { + .path-search .region-content > ol { + width: 900px; + } +} + +.path-search .region-content > ol { + margin: 0 auto; + padding-left: 0; + overflow: auto; +} + +.path-search .region-content > ol li { + width: 280px; + height: 280px; + margin: 0px auto; + padding: 10px; + + float: left; + + list-style: none; + overflow: hidden; +} + +.path-search .region-content > ol li h3 { + text-align: center; +} + +.path-search .region-content > ol li .search-image { + width: 100px; + height: 100px; + + margin: 0 auto; + + display: flex; + align-items: center; +} + +.path-search .region-content > ol li img { +} + + /* Footer */ @@ -571,7 +730,7 @@ a { transition: 0.3s; } width: 100%; } -.footer a { color: #edd400; } +.footer a { color: #337AB7; } .footer a:hover { color: #FFF; }