core/templates/components/common-layout-directives/common-elements/sharing-links.component.html - develop - githubmirror/oppia

core/templates/components/common-layout-directives/common-elements/sharing-links.component.html

40 строк3 KB

Guilherme Coelho

Fix part of #25941: Clean up legacy embedded <style> tags from HTML templates removing inconsistency first 20 files (#26326)

11 июн 2026, 21:55

Не верифицирован

11 июн 2026, 21:550245a9e

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">

<div class="oppia-sharing-links" [ngClass]="getFontAndFlexClass()">
  <div class="fx-main-center fx-cross-center padding-0-2">
    <a title="Facebook" class="fx-main-center fx-cross-start e2e-test-share-link-facebook" [href]="getUrl('facebook')" (click)="registerShareEvent('facebook')" target="_window">
      <i class="oppia-share-icons fa-brands fa-facebook fa-2xl" [ngClass]="{'blog-post-sharing-link-icon': shareType === 'blog','font-small': smallFont, 'font-big': !smallFont}" ></i>
      <span class="oppia-icon-accessibility-label">Share on Facebook</span>
    </a>
  </div>
  <div class="fx-main-center fx-cross-center padding-0-2 twitter-icon">
    <a title="Twitter" class="fx-main-center fx-cross-start e2e-test-share-link-twitter" [href]="getUrl('twitter')"  (click)="registerShareEvent('twitter')" target="_window">
      <i class="oppia-share-icons fa-brands fa-square-x-twitter fa-2xl" [ngClass]="{'blog-post-sharing-link-icon': shareType === 'blog','font-small': smallFont, 'font-big': !smallFont}" ></i>
      <span class="oppia-icon-accessibility-label">Share on Twitter</span>
    </a>
  </div>
  <div *ngIf="shareType === 'blog'" class="fx-main-center fx-cross-center padding-0-2 linkedin-icon">
    <a title="LinkedIn" class="fx-main-center fx-cross-start" [href]="getUrl('linkedin')"  (click)="registerShareEvent('linkedin')" target="_window">
      <i class="oppia-share-icons fa-brands fa-linkedin fa-2xl" [ngClass]="{'blog-post-sharing-link-icon': shareType === 'blog','font-small': smallFont, 'font-big': !smallFont}" ></i>
      <span class="oppia-icon-accessibility-label">Share on LinkedIn</span>
    </a>
  </div>
  <div *ngIf="shareType !== 'blog'" class="fx-main-center fx-cross-center padding-0-2 classroom-icon">
    <a class="fx-main-center fx-cross-center e2e-test-share-link-classroom"
       title="Share on Google Classroom"
       [href]="getUrl('classroom')"
       (click)="registerShareEvent('classroom')"
       target="_window">
      <img class="share-option-img share-icons" [ngClass]="smallFont ? 'font-small' : 'font-big'"  [src]="classroomUrl" alt="Classroom">
    </a>
  </div>
  <div *ngIf="shareType === 'exploration'" title="Embed this Exploration" class="fx-main-center fx-cross-center padding-0-2 embed-button-icon">
    <a class="fx-main-center fx-cross-center e2e-test-embed-link"
       (keydown.enter)="showEmbedExplorationModal()"
       (click)="showEmbedExplorationModal()"
       tabindex="0">
      <i class="fas fa-code embed-link share-icons embed-icon" [ngClass]="smallFont ? 'font-small' : 'font-big'"></i>
      <span class="oppia-icon-accessibility-label">Embed this Exploration</span>
    </a>
  </div>
</div>