aboutsummaryrefslogtreecommitdiff
path: root/configs/conferences/35c3/main.less
diff options
context:
space:
mode:
Diffstat (limited to 'configs/conferences/35c3/main.less')
-rw-r--r--configs/conferences/35c3/main.less448
1 files changed, 448 insertions, 0 deletions
diff --git a/configs/conferences/35c3/main.less b/configs/conferences/35c3/main.less
new file mode 100644
index 0000000..8bbbd6c
--- /dev/null
+++ b/configs/conferences/35c3/main.less
@@ -0,0 +1,448 @@
+@import "../../../assets/css/_structure.less";
+
+/*
+ * color
+ */
+@color-blue: rgb(0, 132, 176); // fresh
+@color-green: rgb(0, 163, 86); // hope
+@color-grey: rgb(77, 77, 76); // reboot
+
+@color-grey-darkest: darken(@color-grey, 20%);
+@color-grey-darker: darken(@color-grey, 10%);
+@color-grey-lighter: lighten(@color-grey, 20%);
+@color-grey-lightest: lighten(@color-grey, 40%); // highlight
+@color-grey-readable: lighten(@color-grey, 50%);
+@color-grey-readable-focused: lighten(@color-grey, 75%);
+
+// often configured values (and their defaults):
+@brand-primary: @color-blue;
+@text-color: @color-grey-readable;
+
+@link-color: @color-blue;
+@link-hover-color: @color-green;
+
+@color-nav-icons: mix(@color-green, @color-blue, 75%);
+
+/*
+ * navbar
+ *
+ * reminder, do not mess so much with the navbar because boostrap nav
+ * is hard and will kick your butt on mobile
+ */
+@navbar-height: 70px;
+@navbar-default-bg: black;
+@navbar-default-border: black;
+
+@navbar-default-link-color: white;
+@navbar-default-link-hover-color: @link-hover-color;
+
+/*
+ * buttons
+ */
+@btn-font-weight: 600;
+a.btn, input.btn, .btn-primary {
+ text-transform: uppercase;
+ color: black;
+}
+a.btn:hover, input.btn:hover {
+ color: @color-grey-readable-focused;
+}
+
+@btn-default-color: @color-grey;
+@btn-default-bg: @color-blue;
+@btn-default-border: @color-grey-darker;
+
+@btn-primary-color: @color-grey;
+@btn-primary-bg: @color-green;
+@btn-primary-border: @color-grey-darker;
+
+/*
+ * font
+ */
+@import url("/configs/conferences/35c3/assets/montserrat/Montserrat.css");
+
+.font-headline {
+ color: @color-grey;
+ font-family: 'Montserrat', sans-serif;
+ font-weight: 900; /* black*/
+ text-transform: uppercase;
+}
+
+.font-sub-line {
+ color: @color-grey;
+ font-family: 'Montserrat', sans-serif;
+ font-weight: 400; /* black*/
+ text-transform: uppercase;
+}
+
+.font-running-text {
+ color: @color-grey-readable;
+ font-family: 'Montserrat', sans-serif;
+ font-weight: 400; /* black*/
+}
+
+
+/*
+ * Border specials
+ */
+.border-resistor-2px-bottom-right {
+ border-image:
+ url("/configs/conferences/35c3/assets/bg-resistor.gif") /* source */
+ 200 200 e('/') /* slice */
+ 200px 200px e('/') /* width */
+ 1rem round space; /* repeat */
+}
+
+/*
+ * style
+ */
+
+body {
+ background-color: black;
+ padding: @navbar-height 0;
+
+ .font-running-text();
+ font-size: 13pt;
+
+ @media (max-width: 498px) { /* when the navbar breaks */
+ padding: 165px 0;
+ }
+}
+
+nav.navbar {
+ .navbar-brand {
+ font-size: 16pt;
+ letter-spacing: 0.2px;
+ color: white;
+ }
+
+ .navbar-right {
+ text-align: right;
+
+ .btn-ssl, a.feedback, a.releases, a.about {
+ color: @color-nav-icons;
+ background-color: transparent;
+ border-color: @color-nav-icons;
+
+ &:hover {
+ color: black;
+ background-color: @color-nav-icons;
+ border-color: @color-nav-icons;
+ }
+ }
+
+ .btn-ssl.btn-warning {
+ color: grey;
+ background: transparent;
+ border-color: grey;
+ }
+ }
+
+ &:after {
+ display: block;
+ height: 2px;
+ padding-bottom: 2px;
+ background-image: linear-gradient(@color-blue 10%, @color-green 90%);
+ }
+}
+
+h1,
+h2,
+h3,
+body.overview .room a.title,
+body.overview .panel-primary a,
+.navbar-brand,
+.panel-heading,
+.panel-default > .panel-heading,
+.nav.nav-tabs {
+ .font-headline()
+}
+
+h4 {
+ .font-sub-line()
+}
+
+.banner {
+ h1 {
+ display: none;
+ }
+
+ img {
+ display: none;
+ }
+
+ @media (min-width: 1730px) {
+ img.block {
+ width: 15%;
+ margin: 20px;
+ position: fixed;
+ display: block;
+ }
+
+ &:after {
+ content: '';
+ display: block;
+ height: 30px;
+ }
+ }
+
+ @media (max-width: 1729px) {
+ img.inline {
+ display: inline-block;
+ width: 55%;
+ padding: 30px 0 15px 0;
+ }
+
+ text-align: center;
+ }
+
+ @media (max-width:@screen-sm-max) {
+ img.inline {
+ width: 75%;
+ }
+ }
+
+ @media (max-width:@screen-xs-max) {
+ img.inline {
+ width: 90%;
+ }
+ }
+}
+
+.well {
+ h1, h2, h3, h4 {
+ color: @color-grey-lighter;
+ }
+
+ background-color: @color-grey-darker;
+}
+
+/*
+ * Panel gradient configuration
+ *
+ */
+.panel {
+ border: none;
+ background-color: black;
+ background-image: linear-gradient(120deg, @color-blue, @color-green);
+ padding: 2px;
+
+ .panel-heading {
+ border: none;
+ background-color: black;
+ // to test gradient use:
+ //background-color: transparent;
+ }
+
+ .panel-body {
+ background-color: black;
+ // test gradient:
+ //background-color: transparent;
+ }
+}
+
+/* let the gratient go over two panels horizontally, child 1 and 2, 3 and 4, and so on */
+/* attention, clearfix for WIDE rooms/panels are a child too */
+.room-group .room:nth-child(1) .panel {
+ background-image: linear-gradient(80deg, @color-blue, @color-green 200%);
+}
+
+.room-group .room:nth-child(2) .panel {
+ background-image: linear-gradient(80deg, @color-blue -60%, @color-green);
+}
+
+.room-group .room:nth-child(3) .panel {
+ background-image: linear-gradient(80deg, @color-blue, @color-green 200%);
+}
+
+.room-group .room:nth-child(4) .panel {
+ background-image: linear-gradient(80deg, @color-blue -60%, @color-green);
+}
+
+.room-group .room:nth-child(5) .panel {
+ background-image: linear-gradient(80deg, @color-blue, @color-green 200%);
+}
+
+.room-group .room:nth-child(6) .panel {
+ background-image: linear-gradient(80deg, @color-blue -60%, @color-green);
+}
+
+.room-group .room:nth-child(7) .panel {
+ background-image: linear-gradient(80deg, @color-blue, @color-green 200%);
+}
+
+.room-group .room:nth-child(8) .panel {
+ background-image: linear-gradient(80deg, @color-blue -60%, @color-green);
+}
+
+div.row.recordings div:nth-child(2) .panel {
+ background-image: linear-gradient(80deg, @color-blue, @color-green 200%);
+}
+
+/* gradient for wide panels is "normal" */
+.room-group .room.wide .panel {
+ background-image: linear-gradient(80deg, @color-blue, @color-green);
+}
+
+
+/*
+ * NO RELIVE THEN:
+ *div.row.recordings div:nth-child(2) .panel {
+ * background-image: linear-gradient(80deg, @color-blue, @color-green);
+ *}
+ */
+
+div.row.recordings div:nth-child(3) .panel {
+ background-image: linear-gradient(80deg, @color-blue -60%, @color-green);
+}
+
+/*
+ * main page
+ */
+
+.overview {
+ a {
+ color: @color-grey-readable;
+ }
+
+ .room {
+ .panel-body {
+ min-height: 190px;
+ }
+
+ &:hover {
+ .panel-title {
+ color: @color-grey-readable-focused;
+ }
+
+ .panel-body {
+ .program-schedule .current-talk {
+ &, span.t {
+ color: @color-grey-readable-focused;
+ }
+ }
+ .program-schedule .next-talk {
+ &, span.t {
+ color: @color-grey-darker;
+ }
+ }
+ }
+ }
+ }
+
+ .room:not(.has-preview) {
+ .panel-body {
+ .program-schedule {
+ span.t {
+ // make text in non-preview panels fullwidth or otherwise
+ // they stick together like rice
+ display: block;
+ }
+ }
+ }
+ }
+
+ .recordings {
+ h2 {
+ span {
+ display: none;
+ }
+
+ &:after {
+ content: 'Recorded memories';
+ }
+ }
+
+ .panel {
+ &:hover {
+ .panel-body a {
+ color: @color-grey-lightest;
+ }
+ }
+ }
+ }
+}
+
+nav {
+ .nav-tabs {
+ border: none;
+ background-color: black;
+ background-image: linear-gradient(120deg, @color-blue, @color-green);
+ padding: 2px;
+
+ & > {
+ background-color: black;
+ }
+
+ a {
+ color: @color-grey;
+ }
+ }
+}
+
+body .schedule {
+ .block {
+ &.pause, &.optout {
+ background-color: @color-grey-lightest;
+ background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
+
+ h3 {
+ color: @color-grey-lighter;
+ }
+ }
+
+ h3 {
+ font-size: 16px;
+ color: @color-grey-lightest;
+ }
+
+ h4 {
+ .font-sub-line();
+ color: @color-blue;
+ font-weight: 500;
+ }
+
+ h5 {
+ color: @color-grey-lighter;
+ }
+ }
+
+ .room.highlight .block {
+ h3 {
+ color: @color-grey-darker;
+ }
+
+ h5 {
+ color: @color-grey;
+ }
+ }
+
+ .now span {
+ right: -33px;
+ top: -2px;
+ font-weight: bold;
+ }
+}
+
+.feedback-form, .embed-form {
+ label {
+ .font-sub-line();
+ font-size: 16px;
+ color: @color-grey-readable;
+ }
+}
+
+footer {
+ color: darken(@color-green, 5%);
+}
+
+body.feedback-read {
+ .table-striped > tbody > tr:nth-of-type(2n+1) {
+ background-color: #202020;
+ }
+
+ .table-hover > tbody > tr:hover {
+ background-color: #303030;
+ }
+}
+
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-11 01:10:57 +0000