#674 Scroll on X axis removed
Closed 2 years ago by robyduck. Opened 2 years ago by richzendy.
richzendy/fedora-websites master  into  master

@@ -59,87 +59,90 @@ 

    </py:choose>

  

     <header id="head">

-       <div id="product-logo-row">

-         <div class="col-sm-4 col-xs-12 productitem workstation">

-           <div class="edition-logo">

-           <a href="../${lang}/workstation">

-             <img src="${path}/static/images/ws-logo.png" />

-             <h3>${_('Workstation')}</h3>

-           </a>

-           <a href="../${lang}/workstation/download">${_('Download Now')}</a>

- 

+       <div id="product-logo-row" class="container-fluid">

+         <div class="row">

+           <div class="col-sm-4 col-xs-12 productitem workstation">

+             <div class="edition-logo">

+             <a href="../${lang}/workstation">

+               <img src="${path}/static/images/ws-logo.png" />

+               <h3>${_('Workstation')}</h3>

+             </a>

+             <a href="../${lang}/workstation/download">${_('Download Now')}</a>

+           

+             </div>

            </div>

-         </div>

-         <div class="col-xs-12 h-caption top-margin liveusb productdesc workstation visible-xs">

-             <h4>${_('Fedora Workstation is a polished, easy to use operating system for laptop and desktop computers, with a complete set of tools for developers and makers of all kinds.')}</h4>

-             <p class="text-center uppercase">

-               <a role="button" href="../${lang}/workstation/download" class="btn btn-edition">${_('Download now')}</a>

-             </p>

-         </div>

-         <div class="col-sm-4 col-xs-12 productitem server">

-           <div class="edition-logo">

-           <a href="../${lang}/server">

-             <img src="${path}/static/images/server-logo-next.png" />

-             <h3>${_('Server')}</h3>

-           </a>

-           <a href="../${lang}/server/download">${_('Download Now')}</a>

+           <div class="col-xs-12 h-caption top-margin liveusb productdesc workstation visible-xs">

+               <h4>${_('Fedora Workstation is a polished, easy to use operating system for laptop and desktop computers, with a complete set of tools for developers and makers of all kinds.')}</h4>

+               <p class="text-center uppercase">

+                 <a role="button" href="../${lang}/workstation/download" class="btn btn-edition">${_('Download now')}</a>

+               </p>

            </div>

-         </div>

-         <div class="col-xs-12 h-caption top-margin liveusb productdesc server visible-xs">

-             <h4>${_('Fedora Server is a powerful, flexible operating system that includes the best and latest datacenter technologies. It puts you in control of all your infrastructure and services.')}</h4>

-             <p class="text-center uppercase">

-               <a role="button" href="../${lang}/server/download" class="btn btn-edition">${_('Download now')}</a>

-             </p>

-         </div>

-         <div class="col-sm-4 col-xs-12 productitem atomic">

-           <div class="edition-logo">

-           <a href="../${lang}/atomic">

-             <img src="${path}/static/images/atomic-logo.png" />

-             <h3>${_('Atomic')}</h3>

-           </a>

-           <a href="../${lang}/atomic/download">${_('Download Now')}</a>

+           <div class="col-sm-4 col-xs-12 productitem server">

+             <div class="edition-logo">

+             <a href="../${lang}/server">

+               <img src="${path}/static/images/server-logo-next.png" />

+               <h3>${_('Server')}</h3>

+             </a>

+             <a href="../${lang}/server/download">${_('Download Now')}</a>

+             </div>

+           </div>

+           <div class="col-xs-12 h-caption top-margin liveusb productdesc server visible-xs">

+               <h4>${_('Fedora Server is a powerful, flexible operating system that includes the best and latest datacenter technologies. It puts you in control of all your infrastructure and services.')}</h4>

+               <p class="text-center uppercase">

+                 <a role="button" href="../${lang}/server/download" class="btn btn-edition">${_('Download now')}</a>

+               </p>

+           </div>

+           <div class="col-sm-4 col-xs-12 productitem atomic">

+             <div class="edition-logo">

+             <a href="../${lang}/atomic">

+               <img src="${path}/static/images/atomic-logo.png" />

+               <h3>${_('Atomic')}</h3>

+             </a>

+             <a href="../${lang}/atomic/download">${_('Download Now')}</a>

+             </div>

+           </div>

+           <div class="col-xs-12 h-caption top-margin productdesc cloud visible-xs">

+               <h4>${_('Fedora Atomic provides the best platform for your Linux-Docker-Kubernetes (LDK) application stack.')}</h4>

+               <p class="text-center uppercase bottom-space">

+                 <a role="button" href="../${lang}/atomic/download" class="btn btn-edition">${_('Download now')}</a>

+               </p>

            </div>

-         </div>

-         <div class="col-xs-12 h-caption top-margin productdesc cloud visible-xs">

-             <h4>${_('Fedora Atomic provides the best platform for your Linux-Docker-Kubernetes (LDK) application stack.')}</h4>

-             <p class="text-center uppercase bottom-space">

-               <a role="button" href="../${lang}/atomic/download" class="btn btn-edition">${_('Download now')}</a>

-             </p>

          </div>

        </div>

  

        <div class="visible-xs col-xs-12 blue-pattern-box"></div>

- 

-       <div class="row hidden-xs">

- 	    <div class="col-xs-12 col-sm-4 productdesc-spacer">

- 	       <hr />

- 	    </div>

- 	    <div class="col-xs-12 col-sm-4 productdesc-spacer">

- 		   <hr />

- 	    </div>

- 	    <div class="col-xs-12 col-sm-4 productdesc-spacer">

- 		   <hr />

- 	    </div>

-       </div>

-       <div class="row hidden-xs">

-         <div class="col-sm-4 col-xs-12 productdesc workstation">

-           <div class="h-body liveusb">

-             <h4>${_('Fedora Workstation is a polished, easy to use operating system for laptop and desktop computers, with a complete set of tools for developers and makers of all kinds.')}</h4>

+       <div class="container-fluid">

+         <div class="row hidden-xs">

+           <div class="col-xs-12 col-sm-4 productdesc-spacer">

+              <hr />

            </div>

-         </div>

-         <div class="col-sm-4 col-xs-12 productdesc server">

-           <div class="h-body liveusb">

-             <h4>${_('Fedora Server is a powerful, flexible operating system that includes the best and latest datacenter technologies. It puts you in control of all your infrastructure and services.')}</h4>

+           <div class="col-xs-12 col-sm-4 productdesc-spacer">

+              <hr />

+           </div>

+           <div class="col-xs-12 col-sm-4 productdesc-spacer">

+              <hr />

            </div>

          </div>

-         <div class="col-sm-4 col-xs-12 productdesc cloud">

-           <div class="h-body">

-             <h4>${_('Fedora Atomic provides the best platform for your Linux-Docker-Kubernetes (LDK) application stack.')}</h4>

+         <div class="row hidden-xs">

+           <div class="col-sm-4 col-xs-12 productdesc workstation">

+             <div class="h-body liveusb">

+               <h4>${_('Fedora Workstation is a polished, easy to use operating system for laptop and desktop computers, with a complete set of tools for developers and makers of all kinds.')}</h4>

+             </div>

+           </div>

+           <div class="col-sm-4 col-xs-12 productdesc server">

+             <div class="h-body liveusb">

+               <h4>${_('Fedora Server is a powerful, flexible operating system that includes the best and latest datacenter technologies. It puts you in control of all your infrastructure and services.')}</h4>

+             </div>

+           </div>

+           <div class="col-sm-4 col-xs-12 productdesc cloud">

+             <div class="h-body">

+               <h4>${_('Fedora Atomic provides the best platform for your Linux-Docker-Kubernetes (LDK) application stack.')}</h4>

+             </div>

            </div>

          </div>

-       </div>

- 

-     </header>

+   

+       </div> 

+    </header>

  

      <div class="text-center grey-pattern-box top-margin">

        <div class="container">

The site have a little scroll on X axis, that because container-fluid and row classes are missing

Hi Edwind,
that's a huge work you did, but we don't use container-fluid classes. There were just two row class mistakes. I fixed them for you and authored the commit to you.
See rev 1cca888.

Pull-Request has been closed by robyduck

2 years ago
Metadata