X-Git-Url: https://vcs.fsf.org/?p=ryf-theme.git;a=blobdiff_plain;f=css%2Fstyle.css;h=7018a398468d9d5b876c2c9fbec5c0fe35009f15;hp=b8c3d450be58e1c557f127a56e86190c37a8863a;hb=dbd9476ae5e8a4792e4a14063c5309c326577cee;hpb=21d9e444c80888b12154fc7bfa9c02399fc0b07f diff --git a/css/style.css b/css/style.css index b8c3d45..7018a39 100644 --- a/css/style.css +++ b/css/style.css @@ -121,6 +121,7 @@ a { transition: 0.3s; } .ryf-list .field--type-image { width: 100%; + height: 150px; background: #fff; border-radius: 10px; display: flex; @@ -129,7 +130,6 @@ a { transition: 0.3s; } .ryf-list img { max-width: 150px; - min-height: 150px; overflow: hidden; } @@ -173,6 +173,77 @@ a { transition: 0.3s; } } +/* Vendors list */ + +@media screen and (max-width: 767px) { + .vendors-list-row { + margin: 0px auto; + } + + .vendors-list { + margin-bottom: 40px; + list-style: none; + } + + .vendors-list .views-field-field-icon { + width: 220px; + + margin: 0px auto 20px auto; + } + + .vendors-list .views-field-field-icon img { + margin: 0 auto; + } + + .vendors-list .views-field-name, .vendors-list .views-field-description__value { + max-width: 300px; + margin: 0 auto 10px auto; + } + + .vendors-list .views-field-name { + font-weight: bold; + font-size: 18px; + text-align: center; + } + +} + +@media screen and (min-width: 768px) { + .vendors-list-row { + width: 600px; + margin: 0px auto; + } + + .vendors-list { + list-style: none; + clear: left; + } + + .vendors-list .views-field-field-icon { + width: 220px; + height: 220px; + + margin-bottom: 40px; + + float: left; + } + + .vendors-list .views-field-field-icon img { + margin: 0 auto; + } + + .vendors-list .views-field-name, .vendors-list .views-field-description__value { + margin-left: 300px; + } + + .vendors-list .views-field-name { + margin-bottom: 10px; + font-weight: bold; + font-size: 18px; + } +} + + /* Sidebars */ @@ -183,6 +254,13 @@ a { transition: 0.3s; } /* Product */ +@media screen and (max-width: 767px) { + .page-node-type-product .product { + max-width: 382px; + margin: 0 auto; + } +} + @media screen and (min-width: 768px) and (max-width: 991px) { .page-node-type-product .product { width: 700px; @@ -197,37 +275,42 @@ a { transition: 0.3s; } } } -@media screen and (max-width: 767px) { - .page-node-type-product .product { - max-width: 382px; - margin: 0 auto; - } +.page-node-type-product .product .field--name-field-image { + padding: 10px; - .page-node-type-product .product .field--name-field-image { - padding: 10px; + display: flex; + align-items: center; - display: flex; - align-items: center; + border: 1px solid #888; + border-radius: 10px; +} - border: 1px solid #888; - border-radius: 10px; - } +.page-node-type-product .product .field--name-field-extra-images { + padding: 5px; - .page-node-type-product .product .field--name-field-extra-images { - margin: 10px auto 0px auto; - padding: 5px; + display: flex; + align-items: center; - display: flex; - align-items: center; + border: 1px solid #888; + border-radius: 10px; +} - border: 1px solid #888; - border-radius: 10px; - } +.page-node-type-product .product .field--name-field-extra-images .field--item { + display: inline-block; + margin: auto; + padding: 5px; +} + +.page-node-type-product .product .field--name-field-categories, .page-node-type-product .product .field--name-field-vendor { + margin: 10px 10px 20px 0px; + padding: 10px; + border: 1px solid #888; + border-radius: 10px; +} - .page-node-type-product .product .field--name-field-extra-images .field--item { - display: inline-block; - margin: auto; - padding: 5px; +@media screen and (max-width: 767px) { + .page-node-type-product .product .field--name-field-extra-images { + margin: 10px auto 0px auto; } .page-node-type-product .product .field--name-body, .page-node-type-product .product .field--name-field-vendor-product-link, .page-node-type-product .product .field--name-field-certification-details, .page-node-type-product .product .field--name-field-certification-date, .page-node-type-product .product .field--name-field-source-code-links { @@ -236,10 +319,6 @@ a { transition: 0.3s; } .page-node-type-product .product .field--name-field-categories, .page-node-type-product .product .field--name-field-vendor { float: left; - margin: 10px 10px 20px 0px; - padding: 10px; - border: 1px solid #888; - border-radius: 10px; } .page-node-type-product .product .field--name-body { @@ -251,15 +330,7 @@ a { transition: 0.3s; } @media screen and (min-width: 768px) { .page-node-type-product .product .field--name-field-image { width: 382px; - padding: 10px; - - display: flex; - align-items: center; - float: left; - - border: 1px solid #888; - border-radius: 10px; } .page-node-type-product .product .field--name-field-extra-images { @@ -267,20 +338,7 @@ a { transition: 0.3s; } clear: left; width: 382px; - padding: 5px; margin-top: 10px; - - display: flex; - align-items: center; - - border: 1px solid #888; - border-radius: 10px; - } - - .page-node-type-product .product .field--name-field-extra-images .field--item { - display: inline-block; - margin: auto; - padding: 5px; } .page-node-type-product .product .field--name-body, .page-node-type-product .product .field--name-field-vendor-product-link, .page-node-type-product .product .field--name-field-certification-details, .page-node-type-product .product .field--name-field-certification-date, .page-node-type-product .product .field--name-field-source-code-links { @@ -297,12 +355,6 @@ a { transition: 0.3s; } float: left; } - .page-node-type-product .product .field--name-field-categories, .page-node-type-product .product .field--name-field-vendor { - margin: 10px 10px 20px 0px; - padding: 10px; - border: 1px solid #888; - border-radius: 10px; - } }