Github Pages build from Action 1be1149

assets/css/custom.css

@@ -0,0 +1,270 @@
+/* custom.css/Open GoPro, Version 2.0 (C) Copyright 2021 GoPro, Inc. (http://gopro.com/OpenGoPro). */
+/* This copyright was auto-generated on Wed, Sep  1, 2021  5:06:11 PM */
+
+/* Tabs */
+.tab {
+    display: flex;
+    flex-wrap: wrap;
+    margin-left: -20px;
+    padding: 0;
+    list-style: none;
+    position: relative;
+}
+
+.tab > * {
+    flex: none;
+    padding-left: 20px;
+    position: relative;
+}
+
+.tab > * > a {
+    display: block;
+    text-align: center;
+    padding: 9px 20px;
+    color: #999;
+    border: 2px solid transparent;
+    border-color: transparent;
+    border-radius: 1em;
+    font-size: 12px;
+    text-transform: uppercase;
+    transition: color 0.1s ease-in-out;
+    line-height: 20px;
+}
+
+.tab > .active > a {
+    color: #222;
+    border-color: #1e87f0;
+}
+
+.tab li a {
+    text-decoration: none;
+    cursor: pointer;
+}
+
+.tab-content {
+    padding: 0;
+}
+
+.tab-content li {
+    display: none;
+}
+
+.tab-content li.active {
+    display: initial;
+}
+
+/* To allow our own list items to show inside a tab */
+.tab-content li ul li {
+    display: list-item;
+}
+
+.tab-content li ol li {
+    display: list-item;
+}
+
+/* Quizzes */
+
+.quiz {
+    text-align: center;
+    margin: 0.5em;
+    min-width: 50%;
+    border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
+    padding: 1em;
+    line-height: 1.5em;
+    background: hsla(67, 95%, 95%, 1);
+    border: dashed 5px #38a;
+    color: black;
+}
+.quiz input[type='radio'] {
+    margin: 0.2em;
+}
+.quiz label {
+    display: inline-block;
+    cursor: pointer;
+    color: inherit;
+}
+.quiz button {
+    background-color: rgb(173, 173, 173);
+    border: 0px;
+    border-radius: 5px;
+    cursor: pointer;
+    color: black;
+}
+.quiz button:hover {
+    background-color: #38a;
+}
+
+.quiz__question {
+    font-style: italic;
+}
+
+/* Callouts */
+
+.callout {
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+    margin: 1em;
+    font-style: italic;
+    box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2);
+    border-radius: 15px;
+}
+
+.callout.tip {
+    background-color: #fff1ba;
+    border-left: solid 8px #ebc21c;
+}
+
+.callout.note {
+    background-color: #c9e9ff;
+    border-left: solid 8px #3498db;
+}
+
+.callout.success {
+    background-color: #b4f3cb;
+    border-left: solid 8px #2dcb71;
+}
+.callout.warning {
+    background-color: #fbbeb8;
+    border-left: solid 8px #df5142;
+}
+
+/* Center diagrams */
+
+img.plantuml {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+img.mermaid {
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+/* Custom classes for additional markdown formatting */
+
+.md_column {
+    display: flex;
+
+    * {
+        max-width: none !important;
+    }
+}
+
+/* Github button for demo layout */
+
+.github-button {
+    box-sizing: border-box;
+    appearance: none;
+    background-color: transparent;
+    border: 2px solid #3498db;
+    border-radius: 0.6em;
+    cursor: pointer;
+    display: flex;
+    align-self: center;
+    font-size: 0.8em;
+    font-weight: 400;
+    line-height: 2em;
+    margin-bottom: 20px;
+    padding: 0.5em 1.2em;
+    text-decoration: none;
+    text-align: center;
+    text-transform: uppercase;
+    font-weight: 700;
+    color: black;
+    box-shadow: 0 0 40px 40px #3498db inset, 0 0 0 0 #3498db;
+    transition: all 150ms ease-in-out;
+}
+.github-button:hover,
+.github-button:focus {
+    color: black;
+    outline: 0;
+    box-shadow: 0 0 10px 0 #3498db inset, 0 0 10px 4px #3498db;
+}
+.github-button i {
+    font-size: 2em;
+    margin-right: 0.25em;
+}
+
+/* Shields.io badges */
+.badge {
+    margin: 0;
+    margin-right: 0.5em;
+}
+
+.badges {
+    display: flex;
+}
+
+/* Special formatting for home page */
+.main__splash ul {
+    margin: 0.1em;
+}
+
+.main__splash li {
+    margin: 0;
+}
+
+.main__splash .grid a {
+    color: #029ad4;
+    text-decoration: none;
+}
+
+/* Formatting specific to the specs (i.e. ble and http) */
+
+.spec table {
+    width: fit-content;
+}
+
+/* Accordions */
+
+.accordion {
+    background-color: #e3f3ff;
+    margin: 0.4em 0 0.4em 0;
+    color: #444;
+    cursor: pointer;
+    padding: 18px;
+    width: 100%;
+    text-align: left;
+    border: 1px solid #1e87f0;
+    border-radius: 15px;
+    outline: none !important;
+}
+
+.accordion i {
+    float: right;
+}
+
+.accordion-active {
+    margin: 0.4em 0 0 0;
+    background-color: #ccc;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+
+.accordion:hover {
+    background-color: #ccc;
+}
+
+.panel {
+    padding: 0 18px;
+    margin: 0;
+    display: none;
+    overflow: hidden;
+    border: 1px solid #1e87f0;
+    border-top: none;
+    border-radius: 10px;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+}
+
+.panel p {
+    margin: 0 0 0.2em !important;
+}
+
+/* https://www.bryanbraun.com/anchorjs/#pages-with-a-sticky-navbar */
+:target {
+    scroll-margin-top: 4em;
+}

assets/css/gridism.css

@@ -0,0 +1,117 @@
+/* No (C) Copyright */
+
+/*
+ * Gridism
+ * A simple, responsive, and handy CSS grid by @cobyism
+ * https://github.com/cobyism/gridism
+ */
+
+/* Preserve some sanity */
+.grid,
+.unit {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+/* Set up some rules to govern the grid */
+.grid {
+  display: block;
+  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
+  border-radius: 25px;
+  /* clear: both; */
+}
+.grid .unit {
+  float: left;
+  width: 100%;
+  padding: 10px;
+}
+
+/* This ensures the outer gutters are equal to the (doubled) inner gutters. */
+.grid .unit:first-child { padding-left: 20px; }
+.grid .unit:last-child { padding-right: 20px; }
+
+/* Nested grids already have padding though, so let’s nuke it */
+.unit .unit:first-child { padding-left: 0; }
+.unit .unit:last-child { padding-right: 0; }
+.unit .grid:first-child > .unit { padding-top: 0; }
+.unit .grid:last-child > .unit { padding-bottom: 0; }
+
+/* Let people nuke the gutters/padding completely in a couple of ways */
+.no-gutters .unit,
+.unit.no-gutters {
+  padding: 0 !important;
+}
+
+/* Wrapping at a maximum width is optional */
+.wrap .grid,
+.grid.wrap {
+  max-width: 978px;
+  margin: 0 auto;
+}
+
+/* Width classes also have shorthand versions numbered as fractions
+ * For example: for a grid unit 1/3 (one third) of the parent width,
+ * simply apply class="w-1-3" to the element. */
+.grid .whole,          .grid .w-1-1 { width: 100%; }
+.grid .half,           .grid .w-1-2 { width: 50%; }
+.grid .one-third,      .grid .w-1-3 { width: 33.3332%; }
+.grid .two-thirds,     .grid .w-2-3 { width: 66.6665%; }
+.grid .one-quarter,    .grid .w-1-4 { width: 25%; }
+.grid .three-quarters, .grid .w-3-4 { width: 75%; }
+.grid .one-fifth,      .grid .w-1-5 { width: 20%; }
+.grid .two-fifths,     .grid .w-2-5 { width: 40%; }
+.grid .three-fifths,   .grid .w-3-5 { width: 60%; }
+.grid .four-fifths,    .grid .w-4-5 { width: 80%; }
+.grid .golden-small,   .grid .w-g-s { width: 38.2716%; } /* Golden section: smaller piece */
+.grid .golden-large,   .grid .w-g-l { width: 61.7283%; } /* Golden section: larger piece */
+
+/* Clearfix after every .grid */
+.grid {
+  *zoom: 1;
+}
+.grid:before, .grid:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+.grid:after {
+  clear: both;
+}
+
+/* Utility classes */
+.align-center { text-align: center; }
+.align-left   { text-align: left; }
+.align-right  { text-align: right; }
+.pull-left    { float: left; }
+.pull-right   { float: right; }
+
+/* Responsive Stuff */
+@media screen and (max-width: 700px) {
+  /* Stack anything that isn’t full-width on smaller screens */
+  .grid .unit {
+    width: 100% !important;
+    padding-left: 20px;
+    padding-right: 20px;
+  }
+  .unit .grid .unit {
+    padding-left: 0px;
+    padding-right: 0px;
+  }
+
+  /* Sometimes, you just want to be different on small screens */
+  .center-on-mobiles {
+    text-align: center !important;
+  }
+  .hide-on-mobiles {
+    display: none !important;
+  }
+}
+
+/* Expand the wrap a bit further on larger screens */
+@media screen and (min-width: 1180px) {
+  .wider .grid {
+    max-width: 1180px;
+    margin: 0 auto;
+  }
+}