css/theme/source/jetbrains.scss

/**
 * White theme for reveal.js. This is the opposite of the 'black' theme.
 *
 * By Hakim El Hattab, http://hakim.se
 */


// Default mixins and settings -----------------
@import "../template/mixins";
@import "../template/settings";
// ---------------------------------------------


// Include theme-specific fonts
@import url(../../lib/font/gotham/gotham.css);

// Include jetbrains-bundle
@import url(../jetbrains-bundle/fonts/fonts.css);
@import url(../jetbrains-bundle/footer/footer.css);
@import url(../jetbrains-bundle/grid/grid.css);
@import url(../jetbrains-bundle/header/header.css);
@import url(../jetbrains-bundle/logos/logos.css);


// Override theme settings (see ../template/settings.scss)
$backgroundColor: #fff;

$mainColor: #222;
$headingColor: #222;

$mainFontSize: 24px;
$mainFont: 'Gotham SSm A', 'Gotham SSm B', Helvetica, Arial, sans-serif;
$headingFont: $mainFont;
$headingTextShadow: none;
$headingLetterSpacing: -3px;
$headingTextTransform: normal;
$headingFontWeight: 500;
$linkColor: #2a76dd;
$linkColorHover: lighten( $linkColor, 15% );
$selectionBackgroundColor: lighten( $linkColor, 25% );

$heading1Size: 2.5em;
$heading2Size: 1.6em;
$heading3Size: 1.3em;
$heading4Size: 1.0em;

$fullscreenHeaderHeight: 130px;

section.has-dark-background {
	&, h1, h2, h3, h4, h5, h6 {
		color: #fff;
	}
}

// Theme template ------------------------------
@import "../template/theme";
// ---------------------------------------------

.reveal section {
  top: 0 !important;

}

.reveal section img {
  border: none;
  max-height: 45vh;
}

.reveal h2 {
  margin-top: 1.2em;
}

.reveal video,
.reveal iframe {
  max-width: 95%;
  max-height: 45vh; }

@mixin logo-template($height: 16vh, $width: 16vh) {

  height: $height;
  width: $width;
  box-shadow: none;

}

@mixin slide-block-template($itemsPerRow: 3) {
  & li {
    display: inline-block;
    padding-right: 5vh;
    float: left;

    &:nth-child(#{$itemsPerRow}n+1) {
      clear: left;
    }

    & img.slide-logo {
      @include logo-template();
    }

    & img.slide-logo-customers {
      @include logo-template($height: 4vh, $width: 12vh);
    }

    & img.slide-logo-small {
      @include logo-template($height: 8vh, $width: 8vh);
    }

    & img.slide-logo-customers-round {
      @include logo-template($height: 5vh, $width: 6vh);
    }
  }
}a

.reveal section ul.slide-block {
  @include slide-block-template()
}

.reveal section ul.slide-block-4 {
  @include slide-block-template($itemsPerRow: 4)
}

@mixin slide-background-template($productName, $beamName: $productName, $logoPosition: 75px 60px, $beamPosition: 0 0, $logoSize: auto 50px) {

  background: {
    image:        url("../../img/logo_#{$productName}.svg"),
                  url("../../img/slides/beam_#{$beamName}.svg"),
                  url("../../img/slides/jetbrains_logo.svg");

    position:     $logoPosition,
                  $beamPosition,
                  90% 35px;

    size:         $logoSize,
                  auto 540px,
                  auto 100px;

    repeat:       no-repeat;
  }

  padding:        50px

}


body.blank-background {
  background: none !important;
}

body.resharper-background {
  @include slide-background-template($productName: 'resharper');
}

body.resharper-ultimate-background {
  @include slide-background-template($productName: 'resharper', $beamName: 'resharper_ultimate', $beamPosition: -28px -15px);
}

body.dottrace-background {
  @include slide-background-template($productName: 'dottrace', $beamName: 'resharper_ultimate', $logoSize: auto 42px);
}

body.resharper-cpp-background {
  @include slide-background-template($productName: 'resharper_cpp');
}

body.dotcover-background {
  @include slide-background-template($productName: 'dotcover', $beamName: 'resharper_ultimate', $logoSize: auto 42px);
}

body.dotmemory-background {
  @include slide-background-template($productName: 'dotmemory', $beamName: 'resharper_ultimate');
}

body.dotpeek-background {
  @include slide-background-template($productName: 'dotpeek', $beamName: 'resharper_ultimate', $logoSize: auto 42px);
}

body.rider-background {
  @include slide-background-template($productName: 'rider', $beamPosition: -90px -85px, $logoSize: auto 42px);
}

body.rider-unity-background {
  @include slide-background-template($productName: 'rider_unity', $logoPosition: 75px 49px, $beamPosition: -90px -85px, $logoSize: auto 70px);
}

body.webstorm-background {
  @include slide-background-template($productName: 'webstorm', $beamPosition: -70px -60px, $logoSize: auto 42px);
}
body.appcode-background {
  @include slide-background-template($productName: 'appcode');
}

body.clion-background {
  @include slide-background-template($productName: 'clion', $beamPosition: -90px -95px, $logoSize: auto 42px);
}

body.intellij-background {
  @include slide-background-template($productName: 'intellij_idea', $beamPosition: -170px -30px, $logoSize: auto 42px);
}

body.phpstorm-background {
  @include slide-background-template($productName: 'phpstorm', $beamPosition: -250px -50px);
}

body.pycharm-background {
  @include slide-background-template($productName: 'pycharm', $beamPosition: -130px -30px);
}

body.rubymine-background {
  @include slide-background-template($productName: 'rubymine');
}

body.teamcity-background {
  @include slide-background-template($productName: 'teamcity', $beamPosition: -70px -30px);
}

body.upsource-background {
  @include slide-background-template($productName: 'upsource');
}

body.youtrack-background {
  @include slide-background-template($productName: 'youtrack', $beamPosition: -70px 0px, $logoSize: auto 42px);
}

body.kotlin-background {
  @include slide-background-template($productName: 'kotlin', $logoSize: auto 42px);
}

body.datagrip-background {
  @include slide-background-template($productName: 'datagrip');
}

body.hub-background {
  @include slide-background-template($productName: 'hub', $beamPosition: -70px 0px, $logoSize: auto 42px);
}

body.mps-background {
  @include slide-background-template($productName: 'mps');
}

body.goland-background {
  @include slide-background-template($productName: 'goland', $beamPosition: -20px -40px, $logoSize: auto 42px);
}


body.general-background {
  padding: 0;

  background: {
    image: url("../../img/slides/beam_general.svg");
    position: 100% 80%;
    color: black;
    repeat: no-repeat;
  }

  & section {
  text-align: left;
}

  & h1 {
    color: white;
    padding-top: 1.5em;
    font-weight: 600;
  }

  & div.jetbrains-logo {
    padding-right: 1.5em;
  }
}

body.black-background {
  background-color: black;
  background-repeat: no-repeat;
  padding: 0; }

body.default-background {
  background-image:       url("../../img/slides/jetbrains_logo.svg");
  background-position:    90% 35px;
  background-size:        auto 100px;
  background-repeat:      no-repeat;
  padding:                0;
}

.high-image-inside {
  display: flex !important;
  height: 100%;
  flex-direction: column;
  box-sizing: border-box;
  padding-bottom: 20px !important;
}

.high-image-inside .image-col {
  position: relative;
  flex: 1;

  img {
    position: absolute;
    top: 0;
    left: 50%;
    max-height: 100%;
    margin: 0;
    transform: translateX(-50%);
  }
}

body.fullscreen-mode {
  padding: 0 !important;

  .reveal {
    background: {
      image: linear-gradient(to bottom, #fff 0, #fff 100%);
      position: 0 $fullscreenHeaderHeight;
      repeat: no-repeat;
    };
  }

  .reveal section {
    padding-top: $fullscreenHeaderHeight + 20px;

    h2 {
      margin-top: 0;
    };
  }
}