navbar, login refinements

This commit is contained in:
2024-03-15 08:39:22 -05:00
parent 61b6dc8a35
commit 58c870ce7c
6 changed files with 131 additions and 138 deletions

View File

@@ -4,6 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="manifest" href="/manifest.json">
<link rel="stylesheet" href="/css/application.css">
{{#if style}}<link rel="stylesheet" href="/css/{{style}}">{{/if}}
<title>{{#if title}}{{title}}{{else}}BenchCoach{{/if}}</title>
@@ -19,13 +20,13 @@
</script>
</head>
<body class="bg-light">
<header class="Header">
<body>
<header>
{{> navbar }}
{{{_sections.header}}}
</header>
<div class="u-padSidesMd u-xs-padSidesLg">
<div class="u-max1200 u-flexExpandSides u-xs-size5of6 u-sm-size2of3 u-md-sizeFull u-padBottomMd u-xs-padEndsLg u-sm-padEndsXl">
<div class="u-max1200 u-flexExpandSides u-xs-size5of6 u-sm-size2of3 u-md-sizeFull u-padEndsLg u-sm-padEndsXl">
{{{ body }}}
</div>
</div>

View File

@@ -1,27 +1,10 @@
<div class="Grid Grid--fit Grid--withGutter u-max1200 u-flexExpandSides u-xs-size5of6 u-sm-size2of3 u-md-sizeFull u-padBottomMd u-xs-padEndsLg u-sm-padEndsXl">
<div class="Grid-cell u-size5of12">
<div class="Panel u-padLg u-spaceSidesAuto">
<h1 class="u-spaceSidesAuto u-spaceBottomLg">Sign in</h1>
<div>
<a class="Button Button--large Button--orange u-spaceSidesAuto" href="/login/federated/teamsnap">
{{{embeddedSvgFromPath "/media/teamsnap_star.svg"}}}
<span>TeamSnap</span>
</a>
</div>
</div>
</div>
<div class="Grid-cell u-size7of12 u-textCenter">
<h1>
<img src="/media/benchcoach.svg" style="width: 2.5em;">
</h1>
<h1>
<strong>
Welcome to
<span class="text-nowrap">BenchCoach</span>
</strong>
</h1>
<div class="lead fst-italic fw-light">
An assistant coach for TeamSnap
</div>
</div>
</div>
<div class="Panel u-maxWidthXs u-padLg u-spaceSidesAuto">
<h1 class="u-textCenter">Sign in</h1>
<p class="u-spaceEndsMd">Sign into BenchCoach using your TeamSnap account</p>
<a class="Button Button--large Button--orange u-spaceSidesAuto btn--Full" href="/login/federated/teamsnap">
{{{embeddedSvgFromPath "/media/teamsnap_star.svg"}}}
<span>TeamSnap</span>
</a>
</div>

View File

@@ -1,40 +1,39 @@
<div class="Header-container Grid u-flexAlignItemsCenter">
<div class="Grid-cell u-sizeFill">
<div class="Header-banner Grid u-flexAlignItemsCenter">
<a href="/" class="Grid-cell u-sizeFit u-flexInline u-flexAlignItemsCenter u-textDecorationNone">
<div class="Header-bannerLogo">
<img class="logo" src="/media/benchcoach.svg" alt="BenchCoach Logo">
</div>
</a>
<div class="Grid-cell u-flexInline u-flexJustifyEnd u-sizeFill u-padSidesSm">
{{#if user}}
<div class="Popup">
<div class="Button Button--small Popup-toggle" onclick="this.closest('.Popup').querySelector('.Popup-container').classList.toggle('is-open')">
Account
</div>
<div class="Popup-container Popup-container--down Popup-container--right u-sizeFit">
<div class="Popup-content u-padXs u-sizeFit u-fontSizeSm">
<h6 class="h6 title u-textNoWrap u-fontSizeSm u-textSemiBold">{{user.first_name}} {{user.last_name}}</h6>
<div class="u-textNoWrap u-fontSizeSm">{{user.email}}</div>
<hr class="Divider u-spaceEndsNone">
<div class="u-padBottomSm u-padTopSm">
<a href="/user/{{user.id}}/teams" class="u-spaceBottomSm Button Button--small">
<span>{{{embeddedSvgFromPath "/teamsnap-ui/assets/icons/team.svg"}}}</span>
Teams
</a>
<form method="post" action="/logout">
<button type="submit" name="logout" class="u-spaceBottomSm Button Button--small">
Logout
</button>
</form>
</div>
</div>
</div>
</div>
{{/if}}
<div class="Header-banner">
<a href="/" class="">
<div class="Header-bannerLogo">
<img class="logo" src="/media/benchcoach.svg" alt="BenchCoach Logo">
</div>
<div class="Header-bannerTitle">
BenchCoach
</div>
</a>
{{#if user}}
<div class="filler"></div>
<div class="u-padSidesSm u-spaceAuto">
<div class="Popup">
<div class="Button Button--small Popup-toggle" onclick="this.closest('.Popup').querySelector('.Popup-container').classList.toggle('is-open')">
Account
</div>
<div class="Popup-container Popup-container--down Popup-container--right u-sizeFit">
<div class="Popup-content u-padXs u-sizeFit u-fontSizeSm">
<h6 class="h6 title u-textNoWrap u-fontSizeSm u-textSemiBold">{{user.first_name}} {{user.last_name}}</h6>
<div class="u-textNoWrap u-fontSizeSm">{{user.email}}</div>
<hr class="Divider u-spaceEndsNone">
<div class="u-padBottomSm u-padTopSm">
<a href="/user/{{user.id}}/teams" class="u-spaceBottomSm Button Button--small">
<span>{{{embeddedSvgFromPath "/teamsnap-ui/assets/icons/team.svg"}}}</span>
Teams
</a>
<form method="post" action="/logout">
<button type="submit" name="logout" class="u-spaceBottomSm Button Button--small">
Logout
</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
{{/if}}
</div>