diff --git a/web/static/img/bitbucket-icon.svg b/web/static/img/bitbucket-icon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..72f4eb104a1a65ccb8c4e4c37e283aa71d44b408
--- /dev/null
+++ b/web/static/img/bitbucket-icon.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" height="1000" width="785.714">
+ <path d="M454.77 479.386q4.464 35.154 -28.179 56.358t-62.217 3.348q-21.762 -9.486 -29.853 -32.364t-.279 -45.756 29.016 -32.364q20.088 -10.044 40.455 -6.696t35.712 19.809 15.345 37.665zm61.938 -11.718q-7.812 -59.706 -63.054 -91.512t-109.926 -7.254q-35.154 15.624 -56.079 49.383t-19.251 72.261q2.232 50.778 43.245 86.49t92.349 31.248q50.778 -4.464 84.816 -46.872t27.9 -93.744zm133.362 -302.436q-11.16 -15.066 -31.248 -24.831t-32.364 -12.276 -39.618 -6.975q-162.378 -26.226 -315.828 1.116 -23.994 3.906 -36.828 6.696t-30.69 12.276 -27.9 23.994q16.74 15.624 42.408 25.389t41.013 12.276 48.825 6.417q127.224 16.182 249.984 .558 35.154 -4.464 49.941 -6.696t40.455 -11.997 41.85 -25.947zm31.806 577.53q-4.464 14.508 -8.649 42.687t-7.812 46.872 -15.903 39.06 -32.364 31.527q-47.988 26.784 -105.741 39.897t-112.716 12.276 -112.437 -10.323q-25.668 -4.464 -45.477 -10.044t-42.687 -15.066 -40.734 -24.273 -29.016 -34.317q-13.95 -53.568 -31.806 -162.936l3.348 -8.928 10.044 -5.022q124.434 82.584 282.627 82.584t283.185 -82.584q11.718 3.348 13.392 12.834t-2.79 25.11 -4.464 20.646zm100.998 -536.238q-14.508 93.186 -61.938 365.49 -2.79 16.74 -15.066 31.248t-24.273 22.32 -30.411 17.298q-140.616 70.308 -340.38 49.104 -138.384 -15.066 -219.852 -77.562 -8.37 -6.696 -14.229 -14.787t-9.486 -19.53 -5.022 -18.972 -3.348 -22.041 -3.069 -19.53q-5.022 -27.9 -14.787 -83.7t-15.624 -90.117 -13.113 -82.305 -12.276 -88.164q1.674 -14.508 9.765 -27.063t17.577 -20.925 25.11 -16.74 25.668 -12.555 26.784 -10.323q69.75 -25.668 174.654 -35.712 211.482 -20.646 377.208 27.9 86.49 25.668 119.97 68.076 8.928 11.16 9.207 28.458t-3.069 30.132z" fill="#FFFFFF"/>
+</svg>
diff --git a/web/static/img/coreos-icon.svg b/web/static/img/coreos-icon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..f9958a502ebd1106b25ddd03b8ba13a76ef159eb
--- /dev/null
+++ b/web/static/img/coreos-icon.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" fill="#666" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 215 215" xml:space="preserve">
+ <g>
+ <g>
+ <path d="M107.479,1.075c-58.677,0-106.404,47.73-106.404,106.398c0,58.672,47.727,106.399,106.404,106.399
+ c58.659,0,106.39-47.727,106.39-106.399C213.869,48.805,166.138,1.075,107.479,1.075z M147.449,134.627
+ c-0.88,0.128-1.749,0.251-2.632,0.364c-8.03,1.038-16.602,1.743-25.561,2.078c-3.856,0.144-7.793,0.231-11.776,0.231
+ c-3.995,0-7.92-0.086-11.788-0.231c-8.948-0.335-17.526-1.04-25.549-2.078c-0.716-5.987-1.201-12.216-1.443-18.623
+ c-0.116-2.926-0.173-5.896-0.173-8.895c0-3.002,0.057-5.966,0.173-8.898c0.243-6.408,0.728-12.633,1.443-18.62
+ c0.144-1.246,0.306-2.485,0.473-3.709c5.241-38.04,19.752-65.408,36.863-65.408c53.364,0,96.632,43.262,96.633,96.635
+ C204.112,119.547,180.866,129.934,147.449,134.627z"/>
+ <path d="M147.448,80.316c-0.969-1.414-2.009-2.768-3.117-4.069c-8.866-10.451-22.074-17.092-36.852-17.092
+ c-4.791,0-9.057,7.333-11.788,18.72c-1.085,4.54-1.928,9.721-2.47,15.343c-0.428,4.505-0.658,9.297-0.658,14.255
+ s0.231,9.751,0.658,14.252c4.508,0.428,9.293,0.657,14.258,0.657c4.959,0,9.744-0.23,14.252-0.657
+ c9.911-0.94,18.466-2.846,24.527-5.357c5.986-2.476,9.528-5.559,9.528-8.895C155.786,97.407,152.712,88.057,147.448,80.316z"/>
+ </g>
+ </g>
+</svg>
diff --git a/web/static/img/email-icon.svg b/web/static/img/email-icon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..20cf793eb097d4132aac806e8824b5912d64a7fd
--- /dev/null
+++ b/web/static/img/email-icon.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
+ xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 43 43"
+ style="enable-background:new 0 0 43 43;" xml:space="preserve">
+ <rect id="Rectangle-290" fill="#84B6F0" width="43" height="43"/>
+ <path fill="#FFF" d="M8.5,11.3v20.3h26V11.3H8.5z M31,13.3l-9.6,9.3L12,13.3H31z M10.5,29.7v-15l11,10.7l11-10.7v15H10.5z"/>
+</svg>
diff --git a/web/static/img/github-icon.svg b/web/static/img/github-icon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5d6072823c43e06a4e0ceec9035caca00da90d91
--- /dev/null
+++ b/web/static/img/github-icon.svg
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16">
+ <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59 0.4 0.07 0.55-0.17 0.55-0.38 0-0.19-0.01-0.82-0.01-1.49-2.01 0.37-2.53-0.49-2.69-0.94-0.09-0.23-0.48-0.94-0.82-1.13-0.28-0.15-0.68-0.52-0.01-0.53 0.63-0.01 1.08 0.58 1.23 0.82 0.72 1.21 1.87 0.87 2.33 0.66 0.07-0.52 0.28-0.87 0.51-1.07-1.78-0.2-3.64-0.89-3.64-3.95 0-0.87 0.31-1.59 0.82-2.15-0.08-0.2-0.36-1.02 0.08-2.12 0 0 0.67-0.21 2.2 0.82 0.64-0.18 1.32-0.27 2-0.27 0.68 0 1.36 0.09 2 0.27 1.53-1.04 2.2-0.82 2.2-0.82 0.44 1.1 0.16 1.92 0.08 2.12 0.51 0.56 0.82 1.27 0.82 2.15 0 3.07-1.87 3.75-3.65 3.95 0.29 0.25 0.54 0.73 0.54 1.48 0 1.07-0.01 1.93-0.01 2.2 0 0.21 0.15 0.46 0.55 0.38C13.71 14.53 16 11.53 16 8 16 3.58 12.42 0 8 0z" />
+</svg>
diff --git a/web/static/img/google-icon.svg b/web/static/img/google-icon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..a5714f0d1553baa497677a98732a0f76243231d3
--- /dev/null
+++ b/web/static/img/google-icon.svg
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="36px" height="37px" viewBox="0 0 36 37" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+ <defs>
+ <linearGradient x1="3.84931507%" y1="34.473262%" x2="92.2854795%" y2="70.223262%" id="linearGradient-1">
+ <stop stop-color="#3E2723" stop-opacity="0.2" offset="0%"></stop>
+ <stop stop-color="#3E2723" stop-opacity="0.02" offset="100%"></stop>
+ </linearGradient>
+ </defs>
+ <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+ <g id="A.1-Verify-Email-Screen_login-" sketch:type="MSArtboardGroup" transform="translate(-407.000000, -272.000000)">
+ <g id="Shape-+-g+" sketch:type="MSLayerGroup" transform="translate(407.000000, 272.000000)">
+ <path d="M35.9639881,15.3236905 L18.7923214,0.75202381 L10.7579762,0.75202381 C5.14494048,0.75202381 2.39345238,4.16386905 2.39345238,8.01595238 C2.39345238,10.9875595 4.8147619,14.2893452 8.88696429,14.2893452 L9.8775,14.2893452 C9.65738095,14.6195238 9.54732143,15.279881 9.54732143,15.720119 C9.54732143,16.8207143 9.98755952,17.3710119 10.6479167,18.031369 C8.88696429,18.1414286 5.58517857,18.4716071 3.16386905,20.0124405 C0.852619048,21.3331548 0.192261905,23.3142262 0.192261905,24.745 C0.192261905,25.9556548 0.6325,27.05625 1.62303571,28.0467857 L15.4905357,36.9142857 L35.9639881,36.9142857 L35.9639881,15.3236905 Z" id="Shape" fill="url(#linearGradient-1)" sketch:type="MSShapeGroup"></path>
+ <g id="g+" transform="translate(0.192262, 1.192262)" sketch:type="MSShapeGroup">
+ <path d="M18.6000595,-0.110059524 L18.6000595,-0.440238095 L10.5657143,-0.110059524 C4.95267857,-0.110059524 2.20119048,3.30178571 2.20119048,7.15386905 C2.20119048,10.1254762 4.6225,13.4272619 8.69470238,13.4272619 L9.6852381,13.4272619 C9.46511905,13.7574405 9.35505952,14.4177976 9.35505952,14.9680952 C9.35505952,16.0686905 9.79529762,16.6189881 10.4556548,17.2793452 C8.69470238,17.3894048 5.39291667,17.7195833 2.97160714,19.2604167 C0.660357143,20.581131 0,22.5622024 0,23.9929762 C0,26.8545238 2.7514881,29.4959524 8.36452381,29.4959524 C15.0781548,29.4959524 18.6000595,25.8639881 18.6000595,22.2320238 C18.6000595,19.4805357 17.0592262,18.1598214 15.2982738,16.7290476 L13.8675,15.6284524 C13.4272619,15.2982738 12.9870238,14.8580357 12.9870238,13.9775595 C12.9870238,13.0970833 13.5373214,12.4367262 14.087619,12.1065476 C15.7385119,10.7858333 17.3894048,9.46511905 17.3894048,6.4935119 C17.3894048,3.74202381 15.7385119,2.31125 14.7479762,1.54083333 L16.9491667,1.54083333 L18.6000595,-0.110059524 L18.6000595,-0.110059524 Z M16.0686905,23.6627976 C16.0686905,25.8639881 14.087619,27.8450595 10.3455952,27.8450595 C6.16333333,27.8450595 3.52190476,25.7539286 3.52190476,23.1125 C3.52190476,20.3610119 6.05327381,19.3704762 6.82369048,19.0402976 C8.47458333,18.49 10.5657143,18.3799405 10.8958929,18.3799405 L11.776369,18.3799405 C14.7479762,20.581131 16.0686905,21.6817262 16.0686905,23.6627976 L16.0686905,23.6627976 Z M10.5657143,12.1065476 C7.26392857,12.1065476 5.50297619,8.25446429 5.50297619,5.28285714 C5.50297619,2.53136905 7.26392857,1.21065476 9.13494048,1.21065476 C12.6568452,1.21065476 14.4177976,5.61303571 14.4177976,8.25446429 C14.3077381,11.4461905 11.55625,12.1065476 10.5657143,12.1065476 L10.5657143,12.1065476 Z M26.4142857,12.9870238 L26.4142857,8.03434524 L24.7633929,8.03434524 L24.7633929,12.9870238 L19.8107143,12.9870238 L19.8107143,14.6379167 L24.7633929,14.6379167 L24.7633929,19.5905952 L26.4142857,19.5905952 L26.4142857,14.6379167 L31.3669643,14.6379167 L31.3669643,12.9870238 L26.4142857,12.9870238 L26.4142857,12.9870238 Z" id="Shape" opacity="0.16" fill="#3E2723"></path>
+ <path d="M18.6000595,-0.440238095 L10.5657143,-0.440238095 C4.95267857,-0.440238095 2.20119048,2.97160714 2.20119048,6.82369048 C2.20119048,9.79529762 4.6225,13.0970833 8.69470238,13.0970833 L9.6852381,13.0970833 C9.46511905,13.4272619 9.35505952,14.087619 9.35505952,14.5278571 C9.35505952,15.6284524 9.79529762,16.17875 10.4556548,16.8391071 C8.69470238,16.9491667 5.39291667,17.2793452 2.97160714,18.8201786 C0.660357143,20.1408929 0,22.1219643 0,23.5527381 C0,26.4142857 2.7514881,29.0557143 8.36452381,29.0557143 C15.0781548,29.0557143 18.6000595,25.42375 18.6000595,21.7917857 C18.6000595,19.0402976 17.0592262,17.7195833 15.2982738,16.2888095 L13.8675,15.1882143 C13.4272619,14.8580357 12.9870238,14.4177976 12.9870238,13.5373214 C12.9870238,12.6568452 13.5373214,11.9964881 14.087619,11.6663095 C15.7385119,10.3455952 17.3894048,9.02488095 17.3894048,6.05327381 C17.3894048,3.30178571 15.7385119,1.8710119 14.7479762,1.10059524 L16.9491667,1.10059524 L18.6000595,-0.440238095 L18.6000595,-0.440238095 Z M16.0686905,23.332619 C16.0686905,25.5338095 14.087619,27.514881 10.3455952,27.514881 C6.16333333,27.514881 3.52190476,25.42375 3.52190476,22.7823214 C3.52190476,20.0308333 6.05327381,19.0402976 6.82369048,18.710119 C8.47458333,18.1598214 10.5657143,18.0497619 10.8958929,18.0497619 L11.776369,18.0497619 C14.7479762,20.2509524 16.0686905,21.3515476 16.0686905,23.332619 L16.0686905,23.332619 Z M10.5657143,11.8864286 C7.26392857,11.8864286 5.50297619,8.03434524 5.50297619,5.0627381 C5.50297619,2.31125 7.26392857,0.990535714 9.13494048,0.990535714 C12.6568452,0.990535714 14.4177976,5.39291667 14.4177976,8.03434524 C14.3077381,11.2260714 11.55625,11.8864286 10.5657143,11.8864286 L10.5657143,11.8864286 Z M26.4142857,12.6568452 L26.4142857,7.70416667 L24.7633929,7.70416667 L24.7633929,12.6568452 L19.8107143,12.6568452 L19.8107143,14.3077381 L24.7633929,14.3077381 L24.7633929,19.2604167 L26.4142857,19.2604167 L26.4142857,14.3077381 L31.3669643,14.3077381 L31.3669643,12.6568452 L26.4142857,12.6568452 L26.4142857,12.6568452 Z" id="Shape" fill="#F1F1F1"></path>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
+
diff --git a/web/static/main.css b/web/static/main.css
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..f33b15ac9a1988e2f777935dce916d7e293a964a 100644
--- a/web/static/main.css
+++ b/web/static/main.css
@@ -0,0 +1,105 @@
+* {
+ box-sizing: border-box;
+}
+
+body {
+ margin: 0;
+}
+
+.dex-container {
+ color: #333;
+ margin: 45px auto;
+ max-width: 500px;
+ min-width: 320px;
+ text-align: center;
+}
+
+.dex-btn {
+ border-radius: 4px;
+ border: 0;
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.25);
+ cursor: pointer;
+ font-size: 16px;
+ padding: 0;
+}
+
+.dex-btn:focus {
+ outline: none;
+}
+
+.dex-btn:active {
+ box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
+ outline: none;
+}
+
+.dex-btn-icon {
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: 24px;
+ border-radius: 4px 0 0 4px;
+ float: left;
+ height: 36px;
+ margin-right: 5px;
+ width: 36px;
+}
+
+.dex-btn-icon--google {
+ background-color: #DB4437;
+ background-image: url(../static/img/google-icon.svg);;
+}
+.dex-btn-icon--local {
+ background-color: #84B6EF;
+ background-image: url(../static/img/email-icon.svg);
+}
+
+.dex-btn-icon--coreos {
+ /* B&W CoreOS SVG logo */
+ background-image: url(../static/img/coreos-icon.svg);
+}
+
+.dex-btn-icon--github {
+ background-color: #F5F5F5;
+ background-image: url(../static/img/github-icon.svg);
+}
+
+.dex-btn-icon--bitbucket {
+ background-color: #205081;
+ background-image: url(../static/img/bitbucket-icon.svg);
+}
+
+.dex-btn-text {
+ font-weight: 600;
+ line-height: 36px;
+ padding: 6px 12px;
+ text-align: center;
+}
+
+.dex-subtle-text {
+ color: #999;
+ font-size: 12px;
+}
+
+.dex-seperator {
+ color: #999;
+}
+
+.dex-list {
+ color: #999;
+ display: inline-block;
+ font-size: 12px;
+ list-style: circle;
+ text-align: left;
+}
+
+.dex-error-box {
+ background-color: #DD1327;
+ color: #fff;
+ font-size: 14px;
+ font-weight: normal;
+ max-width: 320px;
+ padding: 4px 0;
+}
+
+.dex-error-box {
+ margin: 20px auto;
+}
diff --git a/web/templates/approval.html b/web/templates/approval.html
index 076049c0b2a57d94d8961ee813f8a21c76788d61..2fa7bf211659812396bb5680a21cbf4967b6c084 100644
--- a/web/templates/approval.html
+++ b/web/templates/approval.html
@@ -1,37 +1,35 @@
{{ template "header.html" . }}
-<div class="panel">
- <h2 class="heading">Grant Access</h2>
+<div class="theme-panel">
+ <h2 class="theme-heading">Grant Access</h2>
- <hr>
- <div class="list-with-title">
- <div class="subtle-text">{{ .Client }} would like to:</div>
+ <hr class="dex-separator">
+ <div>
+ <div class="dex-subtle-text">{{ .Client }} would like to:</div>
+ <ul class="dex-list">
{{ range $scope := .Scopes }}
- <li class="bullet-point">
- <div class="subtle-text">
- {{ $scope }}
- </div>
- </li>
+ <li>{{ $scope }}</li>
{{ end }}
+ </ul>
</div>
- <hr>
+ <hr class="dex-separator">
<div>
- <div class="form-row">
+ <div class="theme-form-row">
<form method="post">
<input type="hidden" name="req" value="{{ .AuthReqID }}"/>
<input type="hidden" name="approval" value="approve">
- <button type="submit" class="btn btn-success">
- <span class="btn-text">Grant Access</span>
+ <button type="submit" class="dex-btn theme-btn--success">
+ <span class="dex-btn-text">Grant Access</span>
</button>
</form>
</div>
- <div class="form-row">
+ <div class="theme-form-row">
<form method="post">
<input type="hidden" name="req" value="{{ .AuthReqID }}"/>
<input type="hidden" name="approval" value="rejected">
- <button type="submit" class="btn btn-provider">
- <span class="btn-text">Cancel</span>
+ <button type="submit" class="dex-btn theme-btn-provider">
+ <span class="dex-btn-text">Cancel</span>
</button>
</form>
</div>
diff --git a/web/templates/header.html b/web/templates/header.html
index 79438ec44e2a0927282ee56adfe8be002f7e20bf..53803311882162cf5c3c34bed47bfad567a22a46 100644
--- a/web/templates/header.html
+++ b/web/templates/header.html
@@ -6,237 +6,15 @@
<title>{{ issuer }}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="{{ url "static/main.css" }}" rel="stylesheet">
- <link href="{{ url "theme/style.css" }}" rel="stylesheet">
- <style>
- * {
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- }
-
- html,
- body {
- margin: 0;
- background-color: #efefef;
- font-family: 'Source Sans Pro', Helvetica, sans-serif;
- color: #333;
- }
- a {
- color: #428BCA;
- text-decoration: none;
- }
- a:active, a:hover, a:visited {
- color: #2A6596;
- text-decoration: underline;
- }
- #navbar {
- background-color: #fff;
- color: #333;
- height: 46px;
- box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
- font-size: 13px;
- font-weight: 100;
- overflow: hidden;
- padding: 0 10px;
- }
- #navbar-logo-wrap {
- width: 300px;
- height: 100%;
- display: inline-block;
- overflow: hidden;
- padding: 10px 15px;
- }
- #navbar-logo {
- height: 100%;
- max-height: 25px;
- }
- #container {
- margin: 45px auto;
- text-align: center;
- max-width: 500px;
- min-width: 320px;
- }
- .heading {
- font-size: 20px;
- font-weight: 500;
- margin-top: 0;
- margin-bottom: 10px;
- }
- .footer {
- margin: 30px;
- }
- .input-label-right {
- position: absolute;
- right: 0;
- bottom: 0;
- }
- .input-desc {
- width: 250px;
- margin: 4px auto;
- text-align: left;
- position: relative;
- }
- .subtle-text {
- color: #999;
- font-size: 12px;
- }
- .panel {
- background-color: #fff;
- padding: 30px;
- box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.5);
- }
- .explain {
- font-size: 13px;
- color: #666;
- }
-
- .btn {
- box-shadow: inset 0 1px 0px rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.25), 0 0px 1px rgba(0, 0, 0, 0.25);
- padding: 0;
- font-size: 14px;
- border-radius: 4px;
- border: none;
- cursor: pointer;
- font-size: 16px;
- }
- .btn:focus {
- outline: none;
- }
- .btn:active {
- outline: none;
- box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
- }
- .btn-primary {
- color: #fff;
- background-color: #333;
- padding: 6px 12px;
- min-width: 200px;
- border: none;
- }
- .btn-primary:hover {
- background-color: #666;
- color: #fff;
- }
- .btn-provider {
- background-color: #fff;
- color: #333;
- width: 250px;
- }
- .btn-provider:hover {
- color: #999;
- }
- .btn-success {
- background-color: #2FC98E;
- color: #fff;
- width: 250px;
- }
- .btn-success:hover {
- background-color: #49E3A8;
- }
- .btn-icon {
- width: 36px;
- height: 36px;
- float: left;
- margin-right: 5px;
- background-repeat: no-repeat;
- background-position: center;
- background-size: 24px;
- }
- .btn-icon-google {
- background-color: #DB4437;
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjM2cHgiIGhlaWdodD0iMzdweCIgdmlld0JveD0iMCAwIDM2IDM3IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggMy4zLjIgKDEyMDQzKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5TaGFwZSArIGcrPC90aXRsZT4KICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPgogICAgPGRlZnM+CiAgICAgICAgPGxpbmVhckdyYWRpZW50IHgxPSIzLjg0OTMxNTA3JSIgeTE9IjM0LjQ3MzI2MiUiIHgyPSI5Mi4yODU0Nzk1JSIgeTI9IjcwLjIyMzI2MiUiIGlkPSJsaW5lYXJHcmFkaWVudC0xIj4KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzNFMjcyMyIgc3RvcC1vcGFjaXR5PSIwLjIiIG9mZnNldD0iMCUiPjwvc3RvcD4KICAgICAgICAgICAgPHN0b3Agc3RvcC1jb2xvcj0iIzNFMjcyMyIgc3RvcC1vcGFjaXR5PSIwLjAyIiBvZmZzZXQ9IjEwMCUiPjwvc3RvcD4KICAgICAgICA8L2xpbmVhckdyYWRpZW50PgogICAgPC9kZWZzPgogICAgPGcgaWQ9IlBhZ2UtMSIgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc2tldGNoOnR5cGU9Ik1TUGFnZSI+CiAgICAgICAgPGcgaWQ9IkEuMS1WZXJpZnktRW1haWwtU2NyZWVuX2xvZ2luLSIgc2tldGNoOnR5cGU9Ik1TQXJ0Ym9hcmRHcm91cCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQwNy4wMDAwMDAsIC0yNzIuMDAwMDAwKSI+CiAgICAgICAgICAgIDxnIGlkPSJTaGFwZS0rLWcrIiBza2V0Y2g6dHlwZT0iTVNMYXllckdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg0MDcuMDAwMDAwLCAyNzIuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMzUuOTYzOTg4MSwxNS4zMjM2OTA1IEwxOC43OTIzMjE0LDAuNzUyMDIzODEgTDEwLjc1Nzk3NjIsMC43NTIwMjM4MSBDNS4xNDQ5NDA0OCwwLjc1MjAyMzgxIDIuMzkzNDUyMzgsNC4xNjM4NjkwNSAyLjM5MzQ1MjM4LDguMDE1OTUyMzggQzIuMzkzNDUyMzgsMTAuOTg3NTU5NSA0LjgxNDc2MTksMTQuMjg5MzQ1MiA4Ljg4Njk2NDI5LDE0LjI4OTM0NTIgTDkuODc3NSwxNC4yODkzNDUyIEM5LjY1NzM4MDk1LDE0LjYxOTUyMzggOS41NDczMjE0MywxNS4yNzk4ODEgOS41NDczMjE0MywxNS43MjAxMTkgQzkuNTQ3MzIxNDMsMTYuODIwNzE0MyA5Ljk4NzU1OTUyLDE3LjM3MTAxMTkgMTAuNjQ3OTE2NywxOC4wMzEzNjkgQzguODg2OTY0MjksMTguMTQxNDI4NiA1LjU4NTE3ODU3LDE4LjQ3MTYwNzEgMy4xNjM4NjkwNSwyMC4wMTI0NDA1IEMwLjg1MjYxOTA0OCwyMS4zMzMxNTQ4IDAuMTkyMjYxOTA1LDIzLjMxNDIyNjIgMC4xOTIyNjE5MDUsMjQuNzQ1IEMwLjE5MjI2MTkwNSwyNS45NTU2NTQ4IDAuNjMyNSwyNy4wNTYyNSAxLjYyMzAzNTcxLDI4LjA0Njc4NTcgTDE1LjQ5MDUzNTcsMzYuOTE0Mjg1NyBMMzUuOTYzOTg4MSwzNi45MTQyODU3IEwzNS45NjM5ODgxLDE1LjMyMzY5MDUgWiIgaWQ9IlNoYXBlIiBmaWxsPSJ1cmwoI2xpbmVhckdyYWRpZW50LTEpIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj48L3BhdGg+CiAgICAgICAgICAgICAgICA8ZyBpZD0iZysiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAuMTkyMjYyLCAxLjE5MjI2MikiIHNrZXRjaDp0eXBlPSJNU1NoYXBlR3JvdXAiPgogICAgICAgICAgICAgICAgICAgIDxwYXRoIGQ9Ik0xOC42MDAwNTk1LC0wLjExMDA1OTUyNCBMMTguNjAwMDU5NSwtMC40NDAyMzgwOTUgTDEwLjU2NTcxNDMsLTAuMTEwMDU5NTI0IEM0Ljk1MjY3ODU3LC0wLjExMDA1OTUyNCAyLjIwMTE5MDQ4LDMuMzAxNzg1NzEgMi4yMDExOTA0OCw3LjE1Mzg2OTA1IEMyLjIwMTE5MDQ4LDEwLjEyNTQ3NjIgNC42MjI1LDEzLjQyNzI2MTkgOC42OTQ3MDIzOCwxMy40MjcyNjE5IEw5LjY4NTIzODEsMTMuNDI3MjYxOSBDOS40NjUxMTkwNSwxMy43NTc0NDA1IDkuMzU1MDU5NTIsMTQuNDE3Nzk3NiA5LjM1NTA1OTUyLDE0Ljk2ODA5NTIgQzkuMzU1MDU5NTIsMTYuMDY4NjkwNSA5Ljc5NTI5NzYyLDE2LjYxODk4ODEgMTAuNDU1NjU0OCwxNy4yNzkzNDUyIEM4LjY5NDcwMjM4LDE3LjM4OTQwNDggNS4zOTI5MTY2NywxNy43MTk1ODMzIDIuOTcxNjA3MTQsMTkuMjYwNDE2NyBDMC42NjAzNTcxNDMsMjAuNTgxMTMxIDAsMjIuNTYyMjAyNCAwLDIzLjk5Mjk3NjIgQzAsMjYuODU0NTIzOCAyLjc1MTQ4ODEsMjkuNDk1OTUyNCA4LjM2NDUyMzgxLDI5LjQ5NTk1MjQgQzE1LjA3ODE1NDgsMjkuNDk1OTUyNCAxOC42MDAwNTk1LDI1Ljg2Mzk4ODEgMTguNjAwMDU5NSwyMi4yMzIwMjM4IEMxOC42MDAwNTk1LDE5LjQ4MDUzNTcgMTcuMDU5MjI2MiwxOC4xNTk4MjE0IDE1LjI5ODI3MzgsMTYuNzI5MDQ3NiBMMTMuODY3NSwxNS42Mjg0NTI0IEMxMy40MjcyNjE5LDE1LjI5ODI3MzggMTIuOTg3MDIzOCwxNC44NTgwMzU3IDEyLjk4NzAyMzgsMTMuOTc3NTU5NSBDMTIuOTg3MDIzOCwxMy4wOTcwODMzIDEzLjUzNzMyMTQsMTIuNDM2NzI2MiAxNC4wODc2MTksMTIuMTA2NTQ3NiBDMTUuNzM4NTExOSwxMC43ODU4MzMzIDE3LjM4OTQwNDgsOS40NjUxMTkwNSAxNy4zODk0MDQ4LDYuNDkzNTExOSBDMTcuMzg5NDA0OCwzLjc0MjAyMzgxIDE1LjczODUxMTksMi4zMTEyNSAxNC43NDc5NzYyLDEuNTQwODMzMzMgTDE2Ljk0OTE2NjcsMS41NDA4MzMzMyBMMTguNjAwMDU5NSwtMC4xMTAwNTk1MjQgTDE4LjYwMDA1OTUsLTAuMTEwMDU5NTI0IFogTTE2LjA2ODY5MDUsMjMuNjYyNzk3NiBDMTYuMDY4NjkwNSwyNS44NjM5ODgxIDE0LjA4NzYxOSwyNy44NDUwNTk1IDEwLjM0NTU5NTIsMjcuODQ1MDU5NSBDNi4xNjMzMzMzMywyNy44NDUwNTk1IDMuNTIxOTA0NzYsMjUuNzUzOTI4NiAzLjUyMTkwNDc2LDIzLjExMjUgQzMuNTIxOTA0NzYsMjAuMzYxMDExOSA2LjA1MzI3MzgxLDE5LjM3MDQ3NjIgNi44MjM2OTA0OCwxOS4wNDAyOTc2IEM4LjQ3NDU4MzMzLDE4LjQ5IDEwLjU2NTcxNDMsMTguMzc5OTQwNSAxMC44OTU4OTI5LDE4LjM3OTk0MDUgTDExLjc3NjM2OSwxOC4zNzk5NDA1IEMxNC43NDc5NzYyLDIwLjU4MTEzMSAxNi4wNjg2OTA1LDIxLjY4MTcyNjIgMTYuMDY4NjkwNSwyMy42NjI3OTc2IEwxNi4wNjg2OTA1LDIzLjY2Mjc5NzYgWiBNMTAuNTY1NzE0MywxMi4xMDY1NDc2IEM3LjI2MzkyODU3LDEyLjEwNjU0NzYgNS41MDI5NzYxOSw4LjI1NDQ2NDI5IDUuNTAyOTc2MTksNS4yODI4NTcxNCBDNS41MDI5NzYxOSwyLjUzMTM2OTA1IDcuMjYzOTI4NTcsMS4yMTA2NTQ3NiA5LjEzNDk0MDQ4LDEuMjEwNjU0NzYgQzEyLjY1Njg0NTIsMS4yMTA2NTQ3NiAxNC40MTc3OTc2LDUuNjEzMDM1NzEgMTQuNDE3Nzk3Niw4LjI1NDQ2NDI5IEMxNC4zMDc3MzgxLDExLjQ0NjE5MDUgMTEuNTU2MjUsMTIuMTA2NTQ3NiAxMC41NjU3MTQzLDEyLjEwNjU0NzYgTDEwLjU2NTcxNDMsMTIuMTA2NTQ3NiBaIE0yNi40MTQyODU3LDEyLjk4NzAyMzggTDI2LjQxNDI4NTcsOC4wMzQzNDUyNCBMMjQuNzYzMzkyOSw4LjAzNDM0NTI0IEwyNC43NjMzOTI5LDEyLjk4NzAyMzggTDE5LjgxMDcxNDMsMTIuOTg3MDIzOCBMMTkuODEwNzE0MywxNC42Mzc5MTY3IEwyNC43NjMzOTI5LDE0LjYzNzkxNjcgTDI0Ljc2MzM5MjksMTkuNTkwNTk1MiBMMjYuNDE0Mjg1NywxOS41OTA1OTUyIEwyNi40MTQyODU3LDE0LjYzNzkxNjcgTDMxLjM2Njk2NDMsMTQuNjM3OTE2NyBMMzEuMzY2OTY0MywxMi45ODcwMjM4IEwyNi40MTQyODU3LDEyLjk4NzAyMzggTDI2LjQxNDI4NTcsMTIuOTg3MDIzOCBaIiBpZD0iU2hhcGUiIG9wYWNpdHk9IjAuMTYiIGZpbGw9IiMzRTI3MjMiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICA8cGF0aCBkPSJNMTguNjAwMDU5NSwtMC40NDAyMzgwOTUgTDEwLjU2NTcxNDMsLTAuNDQwMjM4MDk1IEM0Ljk1MjY3ODU3LC0wLjQ0MDIzODA5NSAyLjIwMTE5MDQ4LDIuOTcxNjA3MTQgMi4yMDExOTA0OCw2LjgyMzY5MDQ4IEMyLjIwMTE5MDQ4LDkuNzk1Mjk3NjIgNC42MjI1LDEzLjA5NzA4MzMgOC42OTQ3MDIzOCwxMy4wOTcwODMzIEw5LjY4NTIzODEsMTMuMDk3MDgzMyBDOS40NjUxMTkwNSwxMy40MjcyNjE5IDkuMzU1MDU5NTIsMTQuMDg3NjE5IDkuMzU1MDU5NTIsMTQuNTI3ODU3MSBDOS4zNTUwNTk1MiwxNS42Mjg0NTI0IDkuNzk1Mjk3NjIsMTYuMTc4NzUgMTAuNDU1NjU0OCwxNi44MzkxMDcxIEM4LjY5NDcwMjM4LDE2Ljk0OTE2NjcgNS4zOTI5MTY2NywxNy4yNzkzNDUyIDIuOTcxNjA3MTQsMTguODIwMTc4NiBDMC42NjAzNTcxNDMsMjAuMTQwODkyOSAwLDIyLjEyMTk2NDMgMCwyMy41NTI3MzgxIEMwLDI2LjQxNDI4NTcgMi43NTE0ODgxLDI5LjA1NTcxNDMgOC4zNjQ1MjM4MSwyOS4wNTU3MTQzIEMxNS4wNzgxNTQ4LDI5LjA1NTcxNDMgMTguNjAwMDU5NSwyNS40MjM3NSAxOC42MDAwNTk1LDIxLjc5MTc4NTcgQzE4LjYwMDA1OTUsMTkuMDQwMjk3NiAxNy4wNTkyMjYyLDE3LjcxOTU4MzMgMTUuMjk4MjczOCwxNi4yODg4MDk1IEwxMy44Njc1LDE1LjE4ODIxNDMgQzEzLjQyNzI2MTksMTQuODU4MDM1NyAxMi45ODcwMjM4LDE0LjQxNzc5NzYgMTIuOTg3MDIzOCwxMy41MzczMjE0IEMxMi45ODcwMjM4LDEyLjY1Njg0NTIgMTMuNTM3MzIxNCwxMS45OTY0ODgxIDE0LjA4NzYxOSwxMS42NjYzMDk1IEMxNS43Mzg1MTE5LDEwLjM0NTU5NTIgMTcuMzg5NDA0OCw5LjAyNDg4MDk1IDE3LjM4OTQwNDgsNi4wNTMyNzM4MSBDMTcuMzg5NDA0OCwzLjMwMTc4NTcxIDE1LjczODUxMTksMS44NzEwMTE5IDE0Ljc0Nzk3NjIsMS4xMDA1OTUyNCBMMTYuOTQ5MTY2NywxLjEwMDU5NTI0IEwxOC42MDAwNTk1LC0wLjQ0MDIzODA5NSBMMTguNjAwMDU5NSwtMC40NDAyMzgwOTUgWiBNMTYuMDY4NjkwNSwyMy4zMzI2MTkgQzE2LjA2ODY5MDUsMjUuNTMzODA5NSAxNC4wODc2MTksMjcuNTE0ODgxIDEwLjM0NTU5NTIsMjcuNTE0ODgxIEM2LjE2MzMzMzMzLDI3LjUxNDg4MSAzLjUyMTkwNDc2LDI1LjQyMzc1IDMuNTIxOTA0NzYsMjIuNzgyMzIxNCBDMy41MjE5MDQ3NiwyMC4wMzA4MzMzIDYuMDUzMjczODEsMTkuMDQwMjk3NiA2LjgyMzY5MDQ4LDE4LjcxMDExOSBDOC40NzQ1ODMzMywxOC4xNTk4MjE0IDEwLjU2NTcxNDMsMTguMDQ5NzYxOSAxMC44OTU4OTI5LDE4LjA0OTc2MTkgTDExLjc3NjM2OSwxOC4wNDk3NjE5IEMxNC43NDc5NzYyLDIwLjI1MDk1MjQgMTYuMDY4NjkwNSwyMS4zNTE1NDc2IDE2LjA2ODY5MDUsMjMuMzMyNjE5IEwxNi4wNjg2OTA1LDIzLjMzMjYxOSBaIE0xMC41NjU3MTQzLDExLjg4NjQyODYgQzcuMjYzOTI4NTcsMTEuODg2NDI4NiA1LjUwMjk3NjE5LDguMDM0MzQ1MjQgNS41MDI5NzYxOSw1LjA2MjczODEgQzUuNTAyOTc2MTksMi4zMTEyNSA3LjI2MzkyODU3LDAuOTkwNTM1NzE0IDkuMTM0OTQwNDgsMC45OTA1MzU3MTQgQzEyLjY1Njg0NTIsMC45OTA1MzU3MTQgMTQuNDE3Nzk3Niw1LjM5MjkxNjY3IDE0LjQxNzc5NzYsOC4wMzQzNDUyNCBDMTQuMzA3NzM4MSwxMS4yMjYwNzE0IDExLjU1NjI1LDExLjg4NjQyODYgMTAuNTY1NzE0MywxMS44ODY0Mjg2IEwxMC41NjU3MTQzLDExLjg4NjQyODYgWiBNMjYuNDE0Mjg1NywxMi42NTY4NDUyIEwyNi40MTQyODU3LDcuNzA0MTY2NjcgTDI0Ljc2MzM5MjksNy43MDQxNjY2NyBMMjQuNzYzMzkyOSwxMi42NTY4NDUyIEwxOS44MTA3MTQzLDEyLjY1Njg0NTIgTDE5LjgxMDcxNDMsMTQuMzA3NzM4MSBMMjQuNzYzMzkyOSwxNC4zMDc3MzgxIEwyNC43NjMzOTI5LDE5LjI2MDQxNjcgTDI2LjQxNDI4NTcsMTkuMjYwNDE2NyBMMjYuNDE0Mjg1NywxNC4zMDc3MzgxIEwzMS4zNjY5NjQzLDE0LjMwNzczODEgTDMxLjM2Njk2NDMsMTIuNjU2ODQ1MiBMMjYuNDE0Mjg1NywxMi42NTY4NDUyIEwyNi40MTQyODU3LDEyLjY1Njg0NTIgWiIgaWQ9IlNoYXBlIiBmaWxsPSIjRjFGMUYxIj48L3BhdGg+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTkuNzk1Mjk3NjIsMTMuMzE3MjAyNCBMOS43OTUyOTc2MiwxMy4wOTcwODMzIEM5LjU3NTE3ODU3LDEzLjQyNzI2MTkgOS40NjUxMTkwNSwxNC4wODc2MTkgOS40NjUxMTkwNSwxNC41Mjc4NTcxIEw5LjQ2NTExOTA1LDE0LjYzNzkxNjcgQzkuNDY1MTE5MDUsMTQuMTk3Njc4NiA5LjU3NTE3ODU3LDEzLjY0NzM4MSA5Ljc5NTI5NzYyLDEzLjMxNzIwMjQgTDkuNzk1Mjk3NjIsMTMuMzE3MjAyNCBaIE0xMC40NTU2NTQ4LDE2Ljk0OTE2NjcgQzguNjk0NzAyMzgsMTcuMDU5MjI2MiA1LjM5MjkxNjY3LDE3LjM4OTQwNDggMi45NzE2MDcxNCwxOC45MzAyMzgxIEMwLjY2MDM1NzE0MywyMC4yNTA5NTI0IDAsMjIuMjMyMDIzOCAwLDIzLjY2Mjc5NzYgTDAsMjMuNzcyODU3MSBDMC4xMTAwNTk1MjQsMjIuMzQyMDgzMyAwLjc3MDQxNjY2NywyMC40NzEwNzE0IDIuOTcxNjA3MTQsMTkuMTUwMzU3MSBDNS4zOTI5MTY2NywxNy43MTk1ODMzIDguNjk0NzAyMzgsMTcuMjc5MzQ1MiAxMC40NTU2NTQ4LDE3LjE2OTI4NTcgTDEwLjQ1NTY1NDgsMTYuOTQ5MTY2NyBMMTAuNDU1NjU0OCwxNi45NDkxNjY3IFogTTEwLjM0NTU5NTIsMjcuNTE0ODgxIEM2LjI3MzM5Mjg2LDI3LjUxNDg4MSAzLjYzMTk2NDI5LDI1LjUzMzgwOTUgMy41MjE5MDQ3NiwyMi44OTIzODEgTDMuNTIxOTA0NzYsMjMuMDAyNDQwNSBDMy41MjE5MDQ3NiwyNS42NDM4NjkgNi4xNjMzMzMzMywyNy43MzUgMTAuMzQ1NTk1MiwyNy43MzUgQzE0LjA4NzYxOSwyNy43MzUgMTYuMDY4NjkwNSwyNS43NTM5Mjg2IDE2LjA2ODY5MDUsMjMuNTUyNzM4MSBMMTYuMDY4NjkwNSwyMy40NDI2Nzg2IEMxNS45NTg2MzEsMjUuNjQzODY5IDEzLjk3NzU1OTUsMjcuNTE0ODgxIDEwLjM0NTU5NTIsMjcuNTE0ODgxIEwxMC4zNDU1OTUyLDI3LjUxNDg4MSBaIE0xNC4zMDc3MzgxLDguMjU0NDY0MjkgTDE0LjMwNzczODEsOC4xNDQ0MDQ3NiBDMTQuMTk3Njc4NiwxMS4zMzYxMzEgMTEuNTU2MjUsMTEuODg2NDI4NiAxMC40NTU2NTQ4LDExLjg4NjQyODYgQzcuMjYzOTI4NTcsMTEuODg2NDI4NiA1LjM5MjkxNjY3LDguMTQ0NDA0NzYgNS4zOTI5MTY2Nyw1LjE3Mjc5NzYyIEw1LjM5MjkxNjY3LDUuMjgyODU3MTQgQzUuMzkyOTE2NjcsOC4yNTQ0NjQyOSA3LjE1Mzg2OTA1LDEyLjEwNjU0NzYgMTAuNDU1NjU0OCwxMi4xMDY1NDc2IEMxMS41NTYyNSwxMi4xMDY1NDc2IDE0LjMwNzczODEsMTEuNDQ2MTkwNSAxNC4zMDc3MzgxLDguMjU0NDY0MjkgTDE0LjMwNzczODEsOC4yNTQ0NjQyOSBaIE0xNS40MDgzMzMzLDE2LjI4ODgwOTUgTDEzLjk3NzU1OTUsMTUuMTg4MjE0MyBDMTMuNTM3MzIxNCwxNC44NTgwMzU3IDEzLjIwNzE0MjksMTQuNDE3Nzk3NiAxMy4wOTcwODMzLDEzLjY0NzM4MSBMMTMuMDk3MDgzMywxMy43NTc0NDA1IEMxMy4wOTcwODMzLDE0LjYzNzkxNjcgMTMuNTM3MzIxNCwxNS4wNzgxNTQ4IDEzLjk3NzU1OTUsMTUuNDA4MzMzMyBMMTUuNDA4MzMzMywxNi41MDg5Mjg2IEMxNy4wNTkyMjYyLDE3LjkzOTcwMjQgMTguNjAwMDU5NSwxOS4yNjA0MTY3IDE4LjcxMDExOSwyMS43OTE3ODU3IEwxOC43MTAxMTksMjEuNjgxNzI2MiBDMTguNjAwMDU5NSwxOS4wNDAyOTc2IDE3LjA1OTIyNjIsMTcuODI5NjQyOSAxNS40MDgzMzMzLDE2LjI4ODgwOTUgTDE1LjQwODMzMzMsMTYuMjg4ODA5NSBaIE0yNi40MTQyODU3LDEyLjY1Njg0NTIgTDI2LjQxNDI4NTcsMTIuODc2OTY0MyBMMzEuMzY2OTY0MywxMi44NzY5NjQzIEwzMS4zNjY5NjQzLDEyLjY1Njg0NTIgTDI2LjQxNDI4NTcsMTIuNjU2ODQ1MiBMMjYuNDE0Mjg1NywxMi42NTY4NDUyIFogTTE3LjQ5OTQ2NDMsNi4yNzMzOTI4NiBMMTcuNDk5NDY0Myw2LjE2MzMzMzMzIEMxNy40OTk0NjQzLDMuNDExODQ1MjQgMTUuODQ4NTcxNCwxLjk4MTA3MTQzIDE0Ljg1ODAzNTcsMS4yMTA2NTQ3NiBMMTQuODU4MDM1NywxLjU0MDgzMzMzIEMxNS44NDg1NzE0LDIuMjAxMTkwNDggMTcuNDk5NDY0MywzLjYzMTk2NDI5IDE3LjQ5OTQ2NDMsNi4yNzMzOTI4NiBMMTcuNDk5NDY0Myw2LjI3MzM5Mjg2IFogTTI2LjQxNDI4NTcsNy43MDQxNjY2NyBMMjQuNzYzMzkyOSw3LjcwNDE2NjY3IEwyNC43NjMzOTI5LDcuOTI0Mjg1NzEgTDI2LjQxNDI4NTcsNy45MjQyODU3MSBMMjYuNDE0Mjg1Nyw3LjcwNDE2NjY3IEwyNi40MTQyODU3LDcuNzA0MTY2NjcgWiBNMi4zMTEyNSw2LjgyMzY5MDQ4IEwyLjMxMTI1LDYuOTMzNzUgQzIuNDIxMzA5NTIsMy4wODE2NjY2NyA1LjA2MjczODEsLTAuMTEwMDU5NTI0IDEwLjU2NTcxNDMsLTAuMTEwMDU5NTI0IEwxOC4zNzk5NDA1LC0wLjExMDA1OTUyNCBMMTguNzEwMTE5LC0wLjQ0MDIzODA5NSBMMTAuNjc1NzczOCwtMC40NDAyMzgwOTUgQzQuOTUyNjc4NTcsLTAuNDQwMjM4MDk1IDIuMzExMjUsMi45NzE2MDcxNCAyLjMxMTI1LDYuODIzNjkwNDggTDIuMzExMjUsNi44MjM2OTA0OCBaIE0xOS44MTA3MTQzLDEyLjk4NzAyMzggTDI0Ljc2MzM5MjksMTIuOTg3MDIzOCBMMjQuNzYzMzkyOSwxMi43NjY5MDQ4IEwxOS44MTA3MTQzLDEyLjc2NjkwNDggTDE5LjgxMDcxNDMsMTIuOTg3MDIzOCBMMTkuODEwNzE0MywxMi45ODcwMjM4IFoiIGlkPSJTaGFwZSIgZmlsbC1vcGFjaXR5PSIwLjY0IiBmaWxsPSIjRkZGRkZGIj48L3BhdGg+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgIDwvZz4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPg==);
- }
- .btn-icon-local {
- background-color: #84B6EF;
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjI0cHgiIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAwIDI0IDIwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOnNrZXRjaD0iaHR0cDovL3d3dy5ib2hlbWlhbmNvZGluZy5jb20vc2tldGNoL25zIj4KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggMy4zLjIgKDEyMDQzKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4KICAgIDx0aXRsZT5SZWN0YW5nbGUgMjkxICsgUGF0aCAyMzI8L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz48L2RlZnM+CiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIiBza2V0Y2g6dHlwZT0iTVNQYWdlIj4KICAgICAgICA8ZyBpZD0iQS4xLVZlcmlmeS1FbWFpbC1TY3JlZW5fbG9naW4tIiBza2V0Y2g6dHlwZT0iTVNBcnRib2FyZEdyb3VwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtNDA5LjAwMDAwMCwgLTIwOS4wMDAwMDApIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZT0iI0ZGRkZGRiI+CiAgICAgICAgICAgIDxnIGlkPSJSZWN0YW5nbGUtMzktQ29weS02LSstRW1haWwtQ29weS0rLVJlY3RhbmdsZS0yOTAtKy1SZWN0YW5nbGUtMjkxLSstUGF0aC0yMzIiIHNrZXRjaDp0eXBlPSJNU0xheWVyR3JvdXAiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDQwMC4wMDAwMDAsIDE5Ny4wMDAwMDApIj4KICAgICAgICAgICAgICAgIDxnIGlkPSJSZWN0YW5nbGUtMjkwLSstUmVjdGFuZ2xlLTI5MS0rLVBhdGgtMjMyIiBza2V0Y2g6dHlwZT0iTVNTaGFwZUdyb3VwIj4KICAgICAgICAgICAgICAgICAgICA8ZyBpZD0iUmVjdGFuZ2xlLTI5MS0rLVBhdGgtMjMyIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5LjAwMDAwMCwgMTIuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxnPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IlJlY3RhbmdsZS0yOTEiIHg9IjAiIHk9IjAiIHdpZHRoPSIyNCIgaGVpZ2h0PSIxOS4zNSI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTAsMS45MjcyNzEzOSBMMTEuNjExMzAxOSwxMi45IEwyNCwxLjE5MjYyODgxIiBpZD0iUGF0aC0yMzIiPjwvcGF0aD4KICAgICAgICAgICAgICAgICAgICAgICAgPC9nPgogICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+);
- }
- .btn-icon-coreos {
- /* B&W CoreOS SVG logo */
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBmaWxsPSIjNjY2IiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmlld0JveD0iMCAwIDIxNSAyMTUiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KICA8Zz4NCiAgICA8Zz4NCiAgICAgIDxwYXRoIGQ9Ik0xMDcuNDc5LDEuMDc1Yy01OC42NzcsMC0xMDYuNDA0LDQ3LjczLTEwNi40MDQsMTA2LjM5OGMwLDU4LjY3Miw0Ny43MjcsMTA2LjM5OSwxMDYuNDA0LDEwNi4zOTkNCiAgICAgICAgICAgICAgYzU4LjY1OSwwLDEwNi4zOS00Ny43MjcsMTA2LjM5LTEwNi4zOTlDMjEzLjg2OSw0OC44MDUsMTY2LjEzOCwxLjA3NSwxMDcuNDc5LDEuMDc1eiBNMTQ3LjQ0OSwxMzQuNjI3DQogICAgICAgICAgICAgIGMtMC44OCwwLjEyOC0xLjc0OSwwLjI1MS0yLjYzMiwwLjM2NGMtOC4wMywxLjAzOC0xNi42MDIsMS43NDMtMjUuNTYxLDIuMDc4Yy0zLjg1NiwwLjE0NC03Ljc5MywwLjIzMS0xMS43NzYsMC4yMzENCiAgICAgICAgICAgICAgYy0zLjk5NSwwLTcuOTItMC4wODYtMTEuNzg4LTAuMjMxYy04Ljk0OC0wLjMzNS0xNy41MjYtMS4wNC0yNS41NDktMi4wNzhjLTAuNzE2LTUuOTg3LTEuMjAxLTEyLjIxNi0xLjQ0My0xOC42MjMNCiAgICAgICAgICAgICAgYy0wLjExNi0yLjkyNi0wLjE3My01Ljg5Ni0wLjE3My04Ljg5NWMwLTMuMDAyLDAuMDU3LTUuOTY2LDAuMTczLTguODk4YzAuMjQzLTYuNDA4LDAuNzI4LTEyLjYzMywxLjQ0My0xOC42Mg0KICAgICAgICAgICAgICBjMC4xNDQtMS4yNDYsMC4zMDYtMi40ODUsMC40NzMtMy43MDljNS4yNDEtMzguMDQsMTkuNzUyLTY1LjQwOCwzNi44NjMtNjUuNDA4YzUzLjM2NCwwLDk2LjYzMiw0My4yNjIsOTYuNjMzLDk2LjYzNQ0KICAgICAgICAgICAgICBDMjA0LjExMiwxMTkuNTQ3LDE4MC44NjYsMTI5LjkzNCwxNDcuNDQ5LDEzNC42Mjd6Ii8+DQogICAgICA8cGF0aCBkPSJNMTQ3LjQ0OCw4MC4zMTZjLTAuOTY5LTEuNDE0LTIuMDA5LTIuNzY4LTMuMTE3LTQuMDY5Yy04Ljg2Ni0xMC40NTEtMjIuMDc0LTE3LjA5Mi0zNi44NTItMTcuMDkyDQogICAgICAgICAgICAgIGMtNC43OTEsMC05LjA1Nyw3LjMzMy0xMS43ODgsMTguNzJjLTEuMDg1LDQuNTQtMS45MjgsOS43MjEtMi40NywxNS4zNDNjLTAuNDI4LDQuNTA1LTAuNjU4LDkuMjk3LTAuNjU4LDE0LjI1NQ0KICAgICAgICAgICAgICBzMC4yMzEsOS43NTEsMC42NTgsMTQuMjUyYzQuNTA4LDAuNDI4LDkuMjkzLDAuNjU3LDE0LjI1OCwwLjY1N2M0Ljk1OSwwLDkuNzQ0LTAuMjMsMTQuMjUyLTAuNjU3DQogICAgICAgICAgICAgIGM5LjkxMS0wLjk0LDE4LjQ2Ni0yLjg0NiwyNC41MjctNS4zNTdjNS45ODYtMi40NzYsOS41MjgtNS41NTksOS41MjgtOC44OTVDMTU1Ljc4Niw5Ny40MDcsMTUyLjcxMiw4OC4wNTcsMTQ3LjQ0OCw4MC4zMTZ6Ii8+DQogICAgPC9nPg0KICA8L2c+DQo8L3N2Zz4NCg==);
- }
- .btn-icon-github {
- background-color: #F5F5F5;
- background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjE2IiB3aWR0aD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTggMEMzLjU4IDAgMCAzLjU4IDAgOGMwIDMuNTQgMi4yOSA2LjUzIDUuNDcgNy41OSAwLjQgMC4wNyAwLjU1LTAuMTcgMC41NS0wLjM4IDAtMC4xOS0wLjAxLTAuODItMC4wMS0xLjQ5LTIuMDEgMC4zNy0yLjUzLTAuNDktMi42OS0wLjk0LTAuMDktMC4yMy0wLjQ4LTAuOTQtMC44Mi0xLjEzLTAuMjgtMC4xNS0wLjY4LTAuNTItMC4wMS0wLjUzIDAuNjMtMC4wMSAxLjA4IDAuNTggMS4yMyAwLjgyIDAuNzIgMS4yMSAxLjg3IDAuODcgMi4zMyAwLjY2IDAuMDctMC41MiAwLjI4LTAuODcgMC41MS0xLjA3LTEuNzgtMC4yLTMuNjQtMC44OS0zLjY0LTMuOTUgMC0wLjg3IDAuMzEtMS41OSAwLjgyLTIuMTUtMC4wOC0wLjItMC4zNi0xLjAyIDAuMDgtMi4xMiAwIDAgMC42Ny0wLjIxIDIuMiAwLjgyIDAuNjQtMC4xOCAxLjMyLTAuMjcgMi0wLjI3IDAuNjggMCAxLjM2IDAuMDkgMiAwLjI3IDEuNTMtMS4wNCAyLjItMC44MiAyLjItMC44MiAwLjQ0IDEuMSAwLjE2IDEuOTIgMC4wOCAyLjEyIDAuNTEgMC41NiAwLjgyIDEuMjcgMC44MiAyLjE1IDAgMy4wNy0xLjg3IDMuNzUtMy42NSAzLjk1IDAuMjkgMC4yNSAwLjU0IDAuNzMgMC41NCAxLjQ4IDAgMS4wNy0wLjAxIDEuOTMtMC4wMSAyLjIgMCAwLjIxIDAuMTUgMC40NiAwLjU1IDAuMzhDMTMuNzEgMTQuNTMgMTYgMTEuNTMgMTYgOCAxNiAzLjU4IDEyLjQyIDAgOCAweiIgLz4KPC9zdmc+Cg==);
- }
- .btn-icon-bitbucket {
- background-color: #205081;
- background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAwMCIgd2lkdGg9Ijc4NS43MTQiPjxwYXRoIGQ9Ik00NTQuNzcgNDc5LjM4NnE0LjQ2NCAzNS4xNTQgLTI4LjE3OSA1Ni4zNTh0LTYyLjIxNyAzLjM0OHEtMjEuNzYyIC05LjQ4NiAtMjkuODUzIC0zMi4zNjR0LS4yNzkgLTQ1Ljc1NiAyOS4wMTYgLTMyLjM2NHEyMC4wODggLTEwLjA0NCA0MC40NTUgLTYuNjk2dDM1LjcxMiAxOS44MDkgMTUuMzQ1IDM3LjY2NXptNjEuOTM4IC0xMS43MThxLTcuODEyIC01OS43MDYgLTYzLjA1NCAtOTEuNTEydC0xMDkuOTI2IC03LjI1NHEtMzUuMTU0IDE1LjYyNCAtNTYuMDc5IDQ5LjM4M3QtMTkuMjUxIDcyLjI2MXEyLjIzMiA1MC43NzggNDMuMjQ1IDg2LjQ5dDkyLjM0OSAzMS4yNDhxNTAuNzc4IC00LjQ2NCA4NC44MTYgLTQ2Ljg3MnQyNy45IC05My43NDR6bTEzMy4zNjIgLTMwMi40MzZxLTExLjE2IC0xNS4wNjYgLTMxLjI0OCAtMjQuODMxdC0zMi4zNjQgLTEyLjI3NiAtMzkuNjE4IC02Ljk3NXEtMTYyLjM3OCAtMjYuMjI2IC0zMTUuODI4IDEuMTE2IC0yMy45OTQgMy45MDYgLTM2LjgyOCA2LjY5NnQtMzAuNjkgMTIuMjc2IC0yNy45IDIzLjk5NHExNi43NCAxNS42MjQgNDIuNDA4IDI1LjM4OXQ0MS4wMTMgMTIuMjc2IDQ4LjgyNSA2LjQxN3ExMjcuMjI0IDE2LjE4MiAyNDkuOTg0IC41NTggMzUuMTU0IC00LjQ2NCA0OS45NDEgLTYuNjk2dDQwLjQ1NSAtMTEuOTk3IDQxLjg1IC0yNS45NDd6bTMxLjgwNiA1NzcuNTNxLTQuNDY0IDE0LjUwOCAtOC42NDkgNDIuNjg3dC03LjgxMiA0Ni44NzIgLTE1LjkwMyAzOS4wNiAtMzIuMzY0IDMxLjUyN3EtNDcuOTg4IDI2Ljc4NCAtMTA1Ljc0MSAzOS44OTd0LTExMi43MTYgMTIuMjc2IC0xMTIuNDM3IC0xMC4zMjNxLTI1LjY2OCAtNC40NjQgLTQ1LjQ3NyAtMTAuMDQ0dC00Mi42ODcgLTE1LjA2NiAtNDAuNzM0IC0yNC4yNzMgLTI5LjAxNiAtMzQuMzE3cS0xMy45NSAtNTMuNTY4IC0zMS44MDYgLTE2Mi45MzZsMy4zNDggLTguOTI4IDEwLjA0NCAtNS4wMjJxMTI0LjQzNCA4Mi41ODQgMjgyLjYyNyA4Mi41ODR0MjgzLjE4NSAtODIuNTg0cTExLjcxOCAzLjM0OCAxMy4zOTIgMTIuODM0dC0yLjc5IDI1LjExIC00LjQ2NCAyMC42NDZ6bTEwMC45OTggLTUzNi4yMzhxLTE0LjUwOCA5My4xODYgLTYxLjkzOCAzNjUuNDkgLTIuNzkgMTYuNzQgLTE1LjA2NiAzMS4yNDh0LTI0LjI3MyAyMi4zMiAtMzAuNDExIDE3LjI5OHEtMTQwLjYxNiA3MC4zMDggLTM0MC4zOCA0OS4xMDQgLTEzOC4zODQgLTE1LjA2NiAtMjE5Ljg1MiAtNzcuNTYyIC04LjM3IC02LjY5NiAtMTQuMjI5IC0xNC43ODd0LTkuNDg2IC0xOS41MyAtNS4wMjIgLTE4Ljk3MiAtMy4zNDggLTIyLjA0MSAtMy4wNjkgLTE5LjUzcS01LjAyMiAtMjcuOSAtMTQuNzg3IC04My43dC0xNS42MjQgLTkwLjExNyAtMTMuMTEzIC04Mi4zMDUgLTEyLjI3NiAtODguMTY0cTEuNjc0IC0xNC41MDggOS43NjUgLTI3LjA2M3QxNy41NzcgLTIwLjkyNSAyNS4xMSAtMTYuNzQgMjUuNjY4IC0xMi41NTUgMjYuNzg0IC0xMC4zMjNxNjkuNzUgLTI1LjY2OCAxNzQuNjU0IC0zNS43MTIgMjExLjQ4MiAtMjAuNjQ2IDM3Ny4yMDggMjcuOSA4Ni40OSAyNS42NjggMTE5Ljk3IDY4LjA3NiA4LjkyOCAxMS4xNiA5LjIwNyAyOC40NTh0LTMuMDY5IDMwLjEzMnoiIGZpbGw9IiNGRkZGRkYiLz48L3N2Zz4K);
- }
- .btn-text {
- line-height: 36px;
- padding: 6px 12px;
- text-align: center;
- font-weight: 600;
- }
- .form-row {
- display: block;
- margin: 20px auto;
- }
- label {
- font-size: 13px;
- font-weight: 600;
- }
- .input-box {
- display: block;
- height: 36px;
- padding: 6px 12px;
- font-size: 14px;
- line-height: 1.42857143;
- color: #666;
- border: 1px solid #CCC;
- border-radius: 4px;
- box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
- width: 250px;
- margin: auto;
- }
- .input-box:focus,
- .input-box:active {
- outline: none;
- border-color: #66AFE9;
- }
- .error-box-field,
- .error-box {
- background-color: #DD1327;
- max-width: 320px;
- color: #fff;
- font-size: 14px;
- font-weight: normal;
- padding: 4px 0;
- }
- .error-box {
- margin: 20px auto;
- }
- .error-box-field {
- margin: 0 auto;
- width: 250px;
- }
- .instruction-block {
- font-size: 14px;
- }
- .detail-block {
- color: #777;
- font-size: 12px;
- margin-top: 20px;
- }
- .bullet-point {
- list-style: square;
- }
- .list-with-title {
- text-align: left;
- margin: 0 25%;
- }
- .hr {
- color: #999;
- }
- </style>
+ <link href="{{ url "theme/styles.css" }}" rel="stylesheet">
</head>
- <body>
- <div id="navbar">
- <div id="navbar-logo-wrap">
- <img id="navbar-logo" src="{{ logo }}">
+ <body class="theme-body">
+ <div class="theme-navbar">
+ <div class="theme-navbar__logo-wrap">
+ <img class="theme-navbar__logo" src="{{ logo }}">
</div>
</div>
- <div id="container">
+ <div class="dex-container">
diff --git a/web/templates/login.html b/web/templates/login.html
index e52f775ac6979a12c945ddfb562a941e4e1584f0..10c5dbbb2b3336684c4ee805b5022f09053351dd 100644
--- a/web/templates/login.html
+++ b/web/templates/login.html
@@ -1,22 +1,19 @@
{{ template "header.html" . }}
-<div class="panel">
- <h2 class="heading">Log in to {{ issuer }} </h2>
-
+<div class="theme-panel">
+ <h2 class="theme-heading">Log in to {{ issuer }} </h2>
<div>
{{ range $c := .Connectors }}
- <div class="form-row">
+ <div class="theme-form-row">
<a href="{{ $c.URL }}?req={{ $.AuthReqID }}" target="_self">
- <button class="btn btn-provider">
- <span class="btn-icon btn-icon-{{ $c.ID }}"></span>
- <span class="btn-text">Log in with {{ $c.Name }}</span>
+ <button class="dex-btn theme-btn-provider">
+ <span class="dex-btn-icon dex-btn-icon--{{ $c.ID }}"></span>
+ <span class="dex-btn-text">Log in with {{ $c.Name }}</span>
</button>
</a>
</div>
{{ end }}
</div>
-
</div>
-
{{ template "footer.html" . }}
diff --git a/web/templates/oob.html b/web/templates/oob.html
index 09c98e085bf1e520cd19a4ac8ad9161707cea04f..ba84d8173e8960f1c44e5f7d00490c5358835830 100644
--- a/web/templates/oob.html
+++ b/web/templates/oob.html
@@ -1,11 +1,9 @@
{{ template "header.html" . }}
-<div class="panel">
- <h2 class="heading">Login Successful</h2>
-
- Please copy this code, switch to your application and paste it there:
- <br/>
- <input type="text" value="{{ .Code }}" />
+<div class="theme-panel">
+ <h2 class="theme-heading">Login Successful</h2>
+ <p>Please copy this code, switch to your application and paste it there:</p>
+ <input type="text" class="theme-form-input" value="{{ .Code }}" />
</div>
{{ template "footer.html" . }}
diff --git a/web/templates/password.html b/web/templates/password.html
index 7a9ffb14ca9e1e0d332a2eba1d1eda1213c627f3..4bd0ca75709ad976179f01960bf78cac1c792008 100644
--- a/web/templates/password.html
+++ b/web/templates/password.html
@@ -1,29 +1,29 @@
{{ template "header.html" . }}
-<div class="panel">
- <h2 class="heading">Log in to Your Account</h2>
+<div class="theme-panel">
+ <h2 class="theme-heading">Log in to Your Account</h2>
<form method="post" action="{{ .PostURL }}">
- <div class="form-row">
- <div class="input-desc">
+ <div class="theme-form-row">
+ <div class="theme-form-label">
<label for="userid">Username</label>
</div>
- <input tabindex="1" required id="login" name="login" type="text" class="input-box" placeholder="username" {{ if .Username }}value="{{ .Username }}" {{ else }} autofocus {{ end }}/>
+ <input tabindex="1" required id="login" name="login" type="text" class="theme-form-input" placeholder="username" {{ if .Username }} value="{{ .Username }}" {{ else }} autofocus {{ end }}/>
</div>
- <div class="form-row">
- <div class="input-desc">
+ <div class="theme-form-row">
+ <div class="theme-form-label">
<label for="password">Password</label>
</div>
- <input tabindex="2" required id="password" name="password" type="password" class="input-box" placeholder="password" {{ if .Invalid }} autofocus {{ end }}/>
+ <input tabindex="2" required id="password" name="password" type="password" class="theme-form-input" placeholder="password" {{ if .Invalid }} autofocus {{ end }}/>
</div>
<input type="hidden" name="req" value="{{ .AuthReqID }}"/>
{{ if .Invalid }}
- <div class="error-box">
+ <div class="dex-error-box">
Invalid username and password.
</div>
{{ end }}
- <button tabindex="3" type="submit" class="btn btn-primary">Login</button>
+ <button tabindex="3" type="submit" class="dex-btn theme-btn--primary">Login</button>
</form>
</div>
diff --git a/web/themes/coreos/style.css b/web/themes/coreos/style.css
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/web/themes/coreos/styles.css b/web/themes/coreos/styles.css
new file mode 100644
index 0000000000000000000000000000000000000000..517f06a70eedb4f6405d71c7133202d30c3705ed
--- /dev/null
+++ b/web/themes/coreos/styles.css
@@ -0,0 +1,109 @@
+.theme-body {
+ background-color: #efefef;
+ color: #333;
+ font-family: 'Source Sans Pro', Helvetica, sans-serif;
+}
+
+.theme-navbar {
+ background-color: #fff;
+ box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
+ color: #333;
+ font-size: 13px;
+ font-weight: 100;
+ height: 46px;
+ overflow: hidden;
+ padding: 0 10px;
+}
+
+.theme-navbar__logo-wrap {
+ display: inline-block;
+ height: 100%;
+ overflow: hidden;
+ padding: 10px 15px;
+ width: 300px;
+}
+
+.theme-navbar__logo {
+ height: 100%;
+ max-height: 25px;
+}
+
+.theme-heading {
+ font-size: 20px;
+ font-weight: 500;
+ margin-bottom: 10px;
+ margin-top: 0;
+}
+
+.theme-panel {
+ background-color: #fff;
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+ padding: 30px;
+}
+
+.theme-btn-provider {
+ background-color: #fff;
+ color: #333;
+ min-width: 250px;
+}
+
+.theme-btn-provider:hover {
+ color: #999;
+}
+
+.theme-btn--primary {
+ background-color: #333;
+ border: none;
+ color: #fff;
+ min-width: 200px;
+ padding: 6px 12px;
+}
+
+.theme-btn--primary:hover {
+ background-color: #666;
+ color: #fff;
+}
+
+.theme-btn--success {
+ background-color: #2FC98E;
+ color: #fff;
+ width: 250px;
+}
+
+.theme-btn--success:hover {
+ background-color: #49E3A8;
+}
+
+.theme-form-row {
+ display: block;
+ margin: 20px auto;
+}
+
+.theme-form-input {
+ border-radius: 4px;
+ border: 1px solid #CCC;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ color: #666;
+ display: block;
+ font-size: 14px;
+ height: 36px;
+ line-height: 1.42857143;
+ margin: auto;
+ padding: 6px 12px;
+ width: 250px;
+}
+
+.theme-form-input:focus,
+.theme-form-input:active {
+ border-color: #66AFE9;
+ outline: none;
+}
+
+.theme-form-label {
+ font-size: 13px;
+ font-weight: 600;
+ margin: 4px auto;
+ position: relative;
+ text-align: left;
+ width: 250px;
+}
diff --git a/web/themes/tectonic/logo.png b/web/themes/tectonic/logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..bf30f73440189bc865cc185932017f76b5129029
Binary files /dev/null and b/web/themes/tectonic/logo.png differ
diff --git a/web/themes/tectonic/styles.css b/web/themes/tectonic/styles.css
new file mode 100644
index 0000000000000000000000000000000000000000..a3beb8f81bd2a4ad269f08e74a5a232e23781fdc
--- /dev/null
+++ b/web/themes/tectonic/styles.css
@@ -0,0 +1,109 @@
+.theme-body {
+ background-color: #1E394C;
+ color: #333;
+ font-family: 'Source Sans Pro', Helvetica, sans-serif;
+}
+
+.theme-navbar {
+ background-color: #fff;
+ box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
+ color: #333;
+ font-size: 13px;
+ font-weight: 100;
+ height: 46px;
+ overflow: hidden;
+ padding: 0 10px;
+}
+
+.theme-navbar__logo-wrap {
+ display: inline-block;
+ height: 100%;
+ overflow: hidden;
+ padding: 10px 15px;
+ width: 300px;
+}
+
+.theme-navbar__logo {
+ height: 100%;
+ max-height: 25px;
+}
+
+.theme-heading {
+ font-size: 20px;
+ font-weight: 500;
+ padding-bottom: 10px;
+ margin-top: 0;
+}
+
+.theme-panel {
+ background-color: #fff;
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
+ padding: 30px;
+}
+
+.theme-btn-provider {
+ background-color: #fff;
+ color: #333;
+ min-width: 250px;
+}
+
+.theme-btn-provider:hover {
+ color: #999;
+}
+
+.theme-btn--primary {
+ background-color: #2fc98e;
+ border: none;
+ color: #fff;
+ min-width: 200px;
+ padding: 6px 12px;
+}
+
+.theme-btn--primary:hover {
+ background-color: #25a071;
+ color: #fff;
+}
+
+.theme-btn--success {
+ background-color: #2FC98E;
+ color: #fff;
+ width: 250px;
+}
+
+.theme-btn--success:hover {
+ background-color: #49E3A8;
+}
+
+.theme-form-row {
+ display: block;
+ margin: 20px auto;
+}
+
+.theme-form-input {
+ display: block;
+ height: 36px;
+ padding: 6px 12px;
+ font-size: 14px;
+ line-height: 1.42857143;
+ color: #666;
+ border: 1px solid #CCC;
+ border-radius: 4px;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ width: 250px;
+ margin: auto;
+}
+
+.theme-form-input:focus,
+.theme-form-input:active {
+ outline: none;
+ border-color: #66AFE9;
+}
+
+.theme-form-label {
+ width: 250px;
+ margin: 4px auto;
+ text-align: left;
+ position: relative;
+ font-size: 13px;
+ font-weight: 600;
+}