#348 Update fedora theme
Merged 3 years ago by ngompa. Opened 3 years ago by ryanlerch.
ryanlerch/ipsilon fedora-theme  into  master

file modified
+2
@@ -77,6 +77,8 @@ 

                   glob('themes/Fedora/templates/openid/*.html')),

                  (DATA+'themes/Fedora/templates/openid',

                   glob('themes/Fedora/templates/openid/*.xml')),

+                 (DATA+'themes/Fedora/templates/openidc',

+                  glob('themes/Fedora/templates/openidc/*.html')),

                  (DATA+'themes/Fedora/templates/persona',

                   glob('themes/Fedora/templates/persona/*.html')),

                  (DATA+'themes/openSUSE/res',

file modified
+13 -6
@@ -1,7 +1,14 @@ 

- html, body, .bodycontent {

-   height: 100vh;

-   max-width: 100vw;

-   margin: 0;

-   display: flex;

-   flex-flow: column;

+ .masthead{

+   border-bottom: 1px solid #ccc;

+   box-shadow: 0 0 10px 2px #ddd;

+   position: relative;

+ }

+ 

+ .min-height-50{

+   min-height: 50vh;

+ }

+ 

+ .footer a{

+   color:rgba(255,255,255,0.5);

+   border-bottom: 1px dotted rgba(255,255,255,0.2)

  }

empty or binary file added
@@ -0,0 +1,10 @@ 

+ {% extends "layout.html" %}

+ {% block maincontent %}

+ <h1 class="text-center"><strong>400 - Bad Request</strong></h1>

+ {% if message: %}

+   <p class="text-center">{{ message }}</p>

+ {% else %}

+   <p class="text-center">Your client made a request that could not be understood.</p>

+ {% endif %}

+ <p class="text-center">If the error persists and if you think this is an error, contact <a href="https://pagure.io/fedora-infrastructure/issues">Fedora Infra</a> to resolve the problem.</p>

+ {% endblock %}

@@ -1,7 +1,11 @@ 

  {% extends "layout.html" %}

- {% block maintitle %}

- Federated Open Authentication

- {% endblock %}

- {% block main %}

- You will be redirected to this application whenever another application requires you to authenticate.

+ {% block maincontent %}

+ <h1 class="text-center"><strong>Nothing to Authenticate</strong></h1>

+ <p class="text-center">

+     You will be redirected to this service when an application requires authentication against your Fedora Account

+ </p>

+ <p class="text-center">

+     Visit <a href="https://accounts.fedoraproject.org">Fedora Accounts</a> to create or modify your Fedora Account

+ </p>

  {% endblock %}

+ 

@@ -1,15 +1,12 @@ 

  {% extends "layout.html" %}

- {% block maintitle %}

- 500 - Internal Server Error

- {% endblock %}

- {% block main %}

+ {% block maincontent %}

+   <h1 class="text-center"><strong>500 - Internal Server Error</strong></h1>

    {% if message: %}

-     <p>{{ message }}</p>

+     <p class="text-center">{{ message }}</p>

    {% else %}

-     <p>Ipsilon encountered an unexpected internal error while trying to

+     <p class="text-center">The Fedora Accounts Ipsilon encountered an unexpected internal error while trying to

         fulfill your request.</p>

    {% endif %}

-   <p>Please retry again.</p>

-   <p>If the error persists, contact the server administrator to resolve

-      the problem.</p>

+   <p class="text-center">Please retry again.</p>

+   <p class="text-center">If the error persists, contact <a href="https://pagure.io/fedora-infrastructure/issues">Fedora Infra</a> to resolve the problem.</p>

  {% endblock %}

@@ -8,7 +8,7 @@ 

              href="//fedoraproject.org/static/images/favicon.ico"/>

  

          <link href="https://apps.fedoraproject.org/global/fedora-bootstrap-1.5.0/fedora-bootstrap.min.css" rel="stylesheet">

-         <link href='/ui/res/login.css' rel='stylesheet' type='text/css'>

+         <link href='{{ basepath }}/ui/res/login.css' rel='stylesheet' type='text/css'>

          <meta name="generator" content="Ipsilon">

  

  
@@ -22,31 +22,91 @@ 

      </head>

      <body>

          <div class="navbar navbar-light masthead">

-             <div class="container justify-content-center">

-                 <img alt="logo" src="{{ basepath }}/ui/res/fedora-authn-logo-white.png?v=dcabcce440f62c6282cfffb82f2f5614" height=40px />

+             <div class="container justify-content-between">

+                 <img alt="logo" src="{{ basepath }}/ui/res/fedora-authn-logo-white.png" height=40px />

+                 <div>

+                 {% if user.name %}

+                     <a href="{{ basepath }}/logout" class="btn btn-sm btn-outline-primary">Log Out</a>

+                 {% endif %}

+                 </div>

              </div>

          </div>

-         <div class="bodycontent">

-             <div class="container m-auto">

+         <div class="bodycontent py-5 min-height-50">

+             <div class="container">

+             {% if error %}

+             <div class="row mb-3">

+                 <div class="col">

+                     <div class="alert alert-danger"><strong>{{error}}</strong></div>

+                 </div>

+             </div>

+             {% endif %}

+              {% block maincontent %}{% endblock %}

+             </div>

+         </div>

+ 

+             

+             {#<div class="container py-5">

                  <div class="m-auto {% block cardwidths %}{% endblock %}">

                      {% block toptext %}{% endblock %}

                      <div class="card">

+                         {% if self.maintitle() %}

                          <div class="card-header">

                              {% block maintitle %}{% endblock %}

                          </div>

+                         {% endif %}

                          <div class="card-body">

                              {% block main %}{% endblock %}

                          </div>

                      </div>

                      {% block after_card %}{% endblock %}

                  </div>

-             </div>

-         </div>

+             </div>#}

  

-         <div class="footer py-3 text-white text-center">

-             <div class="container">

-                 Fedora FAS Login uses OpenID powered by <a href="https://ipsilon-project.org/" target="_blank">Ipsilon</a>

-             </div>

+         <div class="footer py-5 text-white">

+             <div class="container py-4">

+                     <div class="row footerlinks justify-content-center">

+                        <div class="col-sm-3 col-4 mt-3">

+                           <div>

+                              <dl>

+                                 <dt class="text-uppercase h4"><strong>About</strong></dt>

+                                 <dd><a href="https://getfedora.org/">Get Fedora Linux</a></dd>

+                                 <dd><a href="/en/sponsors/">Sponsors</a></dd>

+                                 <dd><a href="https://fedoramagazine.org">Fedora Magazine</a></dd>

+                                 <dd><a href="https://fedoraproject.org/wiki/Legal:Main#Legal">Legal</a></dd>

+                              </dl>

+                           </div>

+                        </div>

+                        <div class="col-sm-3 col-4 mt-3">

+                           <div>

+                              <dl>

+                                 <dt class="text-uppercase h4"><strong>Support</strong></dt>

+                                 <dd><a href="https://fedoraproject.org/wiki/Communicating_and_getting_help">Get Help</a></dd>

+                                 <dd><a href="https://ask.fedoraproject.org/">Ask Fedora</a></dd>

+                                 <dd><a href="https://fedoraproject.org/wiki/Common_F33_bugs">Common Bugs</a></dd>

+                                 <dd><a href="https://developer.fedoraproject.org/">Fedora Developer Portal</a></dd>

+                              </dl>

+                           </div>

+                        </div>

+                        <div class="col-sm-3 col-4 mt-3">

+                           <div>

+                              <dl>

+                                 <dt class="text-uppercase h4"><strong>Community</strong></dt>

+                                 <dd><a href="https://fedoraproject.org/wiki/Join">Join Fedora</a></dd>

+                                 <dd><a href="https://fedoraproject.org/wiki/Overview">About Fedora</a></dd>

+                                 <dd><a href="http://fedoraplanet.org">Planet Fedora</a></dd>

+                                 <dd><a href="https://admin.fedoraproject.org/accounts/">Fedora Accounts</a></dd>

+                              </dl>

+                           </div>

+                        </div>

+                     </div>

+                     <div class="row footerlinks">

+                        <div class="col-12 text-center">

+                           <p> Fedora is sponsored by Red Hat. <a href="https://www.redhat.com/en/technologies/linux-platforms/articles/relationship-between-fedora-and-rhel">Learn more about the relationship between Red Hat and Fedora »</a> </p>

+                           <div class="py-3"> <a href="https://www.redhat.com/"><img class="rh-logo" src="{{ basepath }}/ui/res/redhat.png" alt="Red Hat Logo"></a> </div>

+                           <p> © 2021 Red Hat, Inc. and others. </p>

+                        </div>

+                     </div>

+                  </div>

          </div>

      </body>

  </html>

@@ -1,32 +1,39 @@ 

  {% extends "layout.html" %}

- {% block title %}Login{% endblock %}

- {% block toptext %}

+ {% block maincontent %}

+ <div class="row mb-3">

+     <div class="col text-center">

+         <p class="h3"><strong>{{ login_target }}</strong> wants to use your Fedora Account</p>

+         <p>enter your Fedora Account credentials below to authorise <strong>{{ login_target }}</strong></p>

+     </div>

+ </div>

+ <div class="row justify-content-around">

+     <div class="col-5">

+         <form method="post" action="{{ action }}" enctype="application/x-www-form-urlencoded">

+             <input type="hidden" name="ipsilon_transaction_id" id="ipsilon_transaction_id" value="{{ ipsilon_transaction_id}}"/>

  

- <div class="mb-2"><strong>{{ login_target }}</strong> wants to use your Fedora Account System (FAS) credentials</div>

- {% endblock %}

- {% block cardwidths %}col-md-6 col-sm-8{% endblock %}

- {% block maintitle %}

-     Log in with FAS

- {% endblock %}

- {% block main %}

-                 {% if error %}<p>{{error}}</p>{% endif %}

-                 <form method="post" action="{{ action }}" enctype="application/x-www-form-urlencoded">

-                     <input type="hidden" name="ipsilon_transaction_id" id="ipsilon_transaction_id" value="{{ ipsilon_transaction_id}}"/>

+             <div class="card">

+                 <div class="alert alert-info text-center mb-0">

+                     <div>By using a Fedora account, you agree to follow the <a href='https://docs.fedoraproject.org/en-US/project/code-of-conduct/'>Fedora&nbsp;Code&nbsp;of&nbsp;Conduct</a>.</div>

+                 </div>

+                 <div class="card-body">

                      <div class="form-group">

                          <input class="form-control" id="username" name="login_name" placeholder="Username" autofocus value="{{ username | e }}" />

                      </div>

                      <div class="form-group mb-0">

-                         <input class="form-control" id="password" name="login_password" type="password" placeholder="Password" />

-                         <a target="_blank" href="https://admin.fedoraproject.org/accounts/user/resetpass">Forgot password?</a>

+                         <input class="form-control" id="password" name="login_password" type="password" placeholder="Password or Password + One-Time-Password" />

                      </div>

-                     <div class="d-flex justify-content-end">

-                         <input class="btn btn-primary" type="submit" id="loginbutton" value="Log in" />

-                     </div>

-                 </form>

- {% endblock %}

- 

- {% block after_card %}

- 

- <div class="mt-2">Don't have a FAS account? <a target="_blank" href="https://admin.fedoraproject.org/accounts/user/new">Sign up now</a>.</div>

- 

+                 </div>

+                 <div class="card-footer d-flex justify-content-between">

+                     <a target="_blank" class="btn btn-link pl-0" href="https://accounts.fedoraproject.org/forgot-password/ask">Forgot password?</a>

+                     <input class="btn btn-primary" type="submit" id="loginbutton" value="Log in" />

+                 </div>

+             </div>

+         </form>

+     </div>

+ </div>

+ <div class="row mt-5">

+     <div class="col">

+         <div class="text-center">Don't have a Fedora Account? <a target="_blank" href="https://accounts.fedoraproject.org/">Sign up now</a>.</div>

+     </div>

+ </div>

  {% endblock %}

@@ -1,11 +1,6 @@ 

  {% extends "layout.html" %}

- {% block title %}Login{% endblock %}

- {% block toptext %}

- {{ login_target }} is asking to authenticate using Ipsilon

- {% endblock %}

- {% block main %}

-     <div>

-       Redirecting... {{ redirect }}

-     </div>

+ {% block maincontent %}

+ <p class="h3"><strong>{{ login_target }}</strong> wants to use your Fedora Account</p>

+ <p>Redirecting... {{ redirect }}</p>

  {% endblock %}

  

@@ -1,13 +1,11 @@ 

  {% extends "layout.html" %}

- {% block maintitle %}

- Logged out

- {% endblock %}

- {% block main %}

+ {% block maincontent %}

+ <div class="text-center">

  {% if user.name %}

-     <p>Something prevented a successful logout</p>

+     <p class="h3">Something prevented a successful logout</p>

      <p>You are still logged in as {{ user.fullname }}</p>

  {% else %}

-     <p>Successfully logged out.</p>

-     <p>Return to <a href="{{ basepath }}/">Home</a> page</p>

+     <p class="h3">Successfully logged out.</p>

  {% endif %}

+ </div>

  {% endblock %}

@@ -1,13 +1,10 @@ 

  {% extends "layout.html" %}

- {% block maintitle %}

- 404 - Not Found

- {% endblock %}

- {% block main %}

+ {% block maincontent %}

+   <h1 class="text-center"><strong>404 - Not Found</strong></h1>

    {% if message: %}

-     <p>{{ message }}</p>

+     <p class="text-center">{{ message }}</p>

    {% else %}

-     <p>This page does not exist.</p>

+     <p class="text-center">This page does not exist.</p>

    {% endif %}

-   <p>If you think this is an error, contact the server administrator to resolve

-      the problem.</p>

+   <p class="text-center">If you think this is an error, contact <a href="https://pagure.io/fedora-infrastructure/issues">Fedora Infra</a> to resolve the problem.</p>

  {% endblock %}

@@ -1,37 +1,55 @@ 

  {% extends "layout.html" %}

- {% block toptext %}

- <p><strong>{{trustroot}}</strong> requests to use the following details from your FAS Account</p>

- {% endblock %}

- {% block cardwidths %}col-md-10 col-md-offset-1{% endblock %}

- {% block maintitle %}Review the authorization details{% endblock %}

- {% block main %}

-     <div>

-         <form method="post" action="{{action}}" enctype="application/x-www-form-urlencoded">

-             <input type="hidden" name="ipsilon_transaction_id" id="ipsilon_transaction_id" value="{{ ipsilon_transaction_id }}" />

-                     {% for entry in authz_details|dictsort %}

-                         <div class="row">

-                             <div class="col"><strong>{{ entry[0] }}</strong></div>

-                             {%- if entry[1] is iterable and not entry[1] is string -%}

-                             <div class="col-auto">{{ entry[1] | join(', ') }}</div>

-                             {%- else -%}

-                             <div class="col-auto">{{ entry[1] }}</div>

-                             {%- endif -%}

+ {% block maincontent %}

+ <div class="row mb-3">

+     <div class="col text-center">

+             <p class="h4"><strong>{{trustroot}}</strong> requests to use the following details from your Fedora Account</p>

+     </div>

+ </div>

+ <div class="row justify-content-around">

+     <div class="col-10">

+             <form method="post" action="{{action}}" enctype="application/x-www-form-urlencoded">

+                 <input type="hidden" name="ipsilon_transaction_id" id="ipsilon_transaction_id" value="{{ ipsilon_transaction_id }}" />

+                 <div class="card">

+                     <div class="card-body p-0">

+                         <div class="list-group list-group-flush">

+                         {% for entry in authz_details|dictsort %}

+                             <div class="list-group-item">

+                                 <div class="row align-items-center">

+                                     <div class="col"><strong>{{ entry[0] }}</strong></div>

+                                     {%- if entry[1] is iterable and not entry[1] is string -%}

+                                     <div class="col-auto">{{ entry[1] | join(', ') }}</div>

+                                     {%- else -%}

+                                     <div class="col-auto">{{ entry[1] }}</div>

+                                     {%- endif -%}

+                                 </div>

+                             </div>

+                         {% endfor %}

+                             <div class="list-group-item">

+                                 <div class="row align-items-center">

+                                     <div class="col"><strong>Remember&nbsp;approval</strong></div>

+                                     <div class="col-auto">

+                                         <select name="remember_for_days" class="custom-select custom-select-sm">

+                                         <option value="0">never</option>

+                                         <option value="3">3 days</option>

+                                         <option value="7">7 days</option>

+                                         </select>

+                                     </div>

+                                 </div>

+                             </div>

                          </div>

-                     {% endfor %}

- 

-                     <div class="row">

-                         <div class="col"><strong>Remember&nbsp;approval</strong></div>

-                         <div class="col-auto"><select name="remember_for_days" class="custom-select">

-                                 <option value="0">never</option>

-                                 <option value="3">3 days</option>

-                                 <option value="7">7 days</option>

-                             </select>

+                     </div>

+                     <div class="card-footer">

+                         <div class="d-flex justify-content-end">

+                             <input class="btn btn-sm btn-outline-danger mr-1" name="decided_deny" type="submit" value="Reject" />

+                             <input class="btn btn-sm btn-primary" name="decided_allow" type="submit" value="Approve" />

                          </div>

                      </div>

-             <div class="d-flex justify-content-end">

-                 <input class="btn btn-primary" name="decided_allow" type="submit" value="Approve" />

-                 <input class="btn btn-link" name="decided_deny" type="submit" value="Reject" />

-             </p>

-         </form>

+                 </div>

+                         

+     

+                         

+ 

+             </form>

      </div>

+ </div>

  {% endblock %}

@@ -1,7 +1,7 @@ 

  {% extends "layout.html" %}

  {% block toptext %}

- This is the OpenID page for {{username}}.

  {% endblock %}

- {% block main %}

- This page is primarily used internally

+ {% block maincontent %}

+ <h1 class="text-center"><strong>This is the OpenID page for {{username}}.</strong></h1>

+ <p>This page is primarily used internally</p>

  {% endblock %}

@@ -0,0 +1,73 @@ 

+ {% extends "layout.html" %}

+ {% block maincontent %}

+ <div class="row mb-3">

+     <div class="col text-center">

+             <p class="h4"> 

+                 <strong>

+                     {% if client['homepage'] %}

+                         <a href="{{ client['homepage'] }}">{{ client['name'] }}</a>

+                     {% else %}

+                       {{ client['name'] }}

+                     {% endif %}

+                 </strong> 

+                 is asking Fedora Accounts to authorize access for <strong>{{ username }}</strong>.

+             </p>

+             {%- if client['policy'] %}

+               <p><a href="{{ client['policy'] }}">Client privacy policy</a></p>

+             {% endif %}

+             {%- if client['tos'] %}

+               <p><a href="{{ client['tos'] }}">Client terms of service</a></p>

+             {%- endif %}

+     </div>

+ </div>

+ <div class="row justify-content-around">

+     <div class="col-10">

+       <form class="form-horizontal" role="form" id="consent_form" action="{{ action }}" method="post" enctype="application/x-www-form-urlencoded">

+ 

+         <div class="card">

+           <div class="card-body p-0">

+               <input type="hidden" name="ipsilon_transaction_id" id="ipsilon_transaction_id" value="{{ ipsilon_transaction_id }}">

+               <h4 class="p-3 font-weight-bold border-bottom text-muted mb-0">Authorization Details</h4>

+               <div class="list-group list-group-flush">

+           {%- for item in claim_requests|dictsort %}

+                   <div class="list-group-item">

+                       <div class="row align-items-center">

+                           <div class="col"><strong>{{ item[1]['display_name'] }}</strong></div>

+                           {%- if item[1]['value'] is iterable and not item[1]['value'] is string -%}

+                           <div class="col-auto">{{ item[1]['value'] | join(', ') }}</div>

+                           {%- else -%}

+                           <div class="col-auto">{{ item[1]['value'] }}</div>

+                           {%- endif -%}

+                       </div>

+                   </div>

+           {%- endfor %}

+                 </div>

+           {% if scopes %}

+           <h4 class="p-3 font-weight-bold border-bottom text-muted mb-0">Scopes</h4>

+           <div class="list-group list-group-flush">

+           {%- for item in scopes|dictsort %}

+               <div class="list-group-item">

+                   <div class="row align-items-center">

+                       <div class="col"><strong>{{ item[0] }}</strong></div>

+                       <div class="col-auto">

+                       {%- for i in item[1]|dictsort %}

+                         {{ i[1] }}{{ ", " if not loop.last else "" }}

+                       {%- endfor %}

+                       </div>

+                   </div>

+               </div>

+           {%- endfor %}

+           </div>

+           {% endif %}

+           </div>

+           <div class="card-footer">

+               <div class="d-flex justify-content-end">

+                   <input class="btn btn-outline-danger mr-1" name="decided_deny" type="submit" value="Reject" />

+                   <input class="btn btn-primary" name="decided_allow" type="submit" value="Approve" />

+               </div>

+           </div>

+         </div>

+       </form>

+     </div>

+ </div>

+ {% endblock %}

@@ -0,0 +1,22 @@ 

+ {% extends "layout.html" %}

+ {% block maincontent %}

+ <div class="col-sm-12">

+   <p>If you are not redirected automatically, please click Continue.</p>

+ </div>

+ 

+ <div class="col-sm-7 col-md-6 col-lg-5 login">

+ 

+   <div class="form-group">

+     <form id="openidc_response_form" method="POST" action="{{ redirect_url }}">

+ {%- for item in response_info|dictsort %}

+       <input type="hidden" name="{{ item[0] }}" value="{{ item[1] }}">

+ {%- endfor %}

+       <button type="submit" value="Continue" class="btn btn-primary btn-lg" tabindex="1">Continue</button>

+     </form>

+   </div>

+ </div>

+ 

+ <script type="text/javascript">

+   document.getElementById('openidc_response_form').submit();

+ </script>

+ {% endblock %}

@@ -1,12 +1,10 @@ 

  {% extends "layout.html" %}

- {% block maintitle %}

- 401 - Unauthorized

- {% endblock %}

- {% block main %}

+ {% block maincontent %}

+   <h1 class="text-center"><strong>401 - Unauthorized</strong></h1>

    {% if message: %}

-     <p>{{ message }}</p>

+     <p class="text-center">{{ message }}</p>

    {% else %}

-     <p>Authentication was not succesful</p>

+     <p class="text-center">Authentication was not succesful</p>

    {% endif %}

-   <p><a href="{{ basepath }}/login" title="Login">Try to login again</a></p>

+   <p class="text-center"><a href="{{ basepath }}/login" title="Login">Try to login again</a></p>

  {% endblock %}