How to use the @times-components/styleguide.scales.medium function in @times-components/styleguide

To help you get started, we’ve selected a few @times-components/styleguide examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github newsuk / times-components / packages / article-skeleton / __tests__ / scaling.base.js View on Github external
test: () => {
      const output = renderComponent(
        
           {}}
            data={articleFixture({
              ...testFixture
            })}
            onAuthorPress={() => {}}
            onCommentGuidelinesPress={() => {}}
            onCommentsPress={() => {}}
            onLinkPress={() => {}}
            onRelatedArticlePress={() => {}}
            onTopicPress={() => {}}
            onTwitterLinkPress={() => {}}
            onVideoPress={() => {}}
github newsuk / times-components / packages / article-skeleton / __tests__ / shared.base.js View on Github external
export const renderArticle = (data, header = null) => (
  
     {}}
      data={data}
      header={header}
      onAuthorPress={() => {}}
      onCommentGuidelinesPress={() => {}}
      onCommentsPress={() => {}}
      onLinkPress={() => {}}
      onRelatedArticlePress={() => {}}
      onTopicPress={() => {}}
      onTwitterLinkPress={() => {}}
      onVideoPress={() => {}}
github newsuk / times-components / packages / article / __tests__ / shared.base.js View on Github external
const renderArticle = (data, header = null) => (
  
    <article> {}}
      data={data}
      header={header}
      onAuthorPress={() =&gt; {}}
      onCommentGuidelinesPress={() =&gt; {}}
      onCommentsPress={() =&gt; {}}
      onLinkPress={() =&gt; {}}
      onRelatedArticlePress={() =&gt; {}}
      onTopicPress={() =&gt; {}}
      onTwitterLinkPress={() =&gt; {}}
      onVideoPress={() =&gt; {}}
    /&gt;</article>
github newsuk / times-components / packages / article-paragraph / src / styles / shared.js View on Github external
const sharedStyles = (dropCapFont = "dropCap", scale = scales.medium) => {
  const { colours, fontFactory, spacing } = styleguide({ scale });
  const dropCapMargins = margins(dropCapFont, scale);
  const dropCapFontSize = fontSize(dropCapFont, scale);

  return {
    articleMainContentRow: {
      paddingLeft: spacing(2),
      paddingRight: spacing(2)
    },
    articleMainContentRowTablet: {
      alignSelf: "center",
      width: tabletWidth
    },
    articleTextElement: {
      ...fontFactory({
        font: "body",
github newsuk / times-components / packages / message-bar / message-bar.showcase.js View on Github external
component: () =&gt; (
         {}}
          delay={3000}
          message="Article link copied"
          scale={scales.medium}
        /&gt;
      ),
      name: "MessageBar",
github newsuk / times-components / packages / context / src / defaults / index.js View on Github external
import { scales } from "@times-components/styleguide";

export default {
  makeArticleUrl: ({ slug, shortIdentifier }) =>
    slug && shortIdentifier
      ? `https://www.thetimes.co.uk/article/${slug}-${shortIdentifier}`
      : "",
  makeTopicUrl: ({ slug }) => `/topic/${slug}`,
  theme: {
    scale: scales.medium
  },
  newskit: false,
  user: {
    isLoggedIn: false,
    isMetered: false,
    isMeteredExpired: false,
    isShared: false,
    registrationType: ""
  }
};
github newsuk / times-components / packages / article-main-standard / article-main-standard.showcase.js View on Github external
const selectScales = select => select("Scale", scales, scales.medium);
const selectSection = select => sections[select("Section", sections, "News")];
github newsuk / times-components / packages / article-paragraph / article-paragraph.showcase.js View on Github external
const renderParagraphWithScale = ({ select, boolean }, ast) =&gt; {
  const scale = select("Scale", scales, scales.medium);
  const section = select("Section", sections, "The Times Magazine");
  const theme = themeFactory(section, "magazinestandard");
  const enableDropcap = boolean &amp;&amp; boolean("Enable DropCap", true);

  return (
    
      {renderTree(ast, {
        ...coreRenderers,
        dropCap(key, { value }) {
          return (
            enableDropcap &amp;&amp; (
github newsuk / times-components / packages / article-main-comment / article-main-comment.showcase.js View on Github external
const selectScales = select => select("Scale", scales, scales.medium);
const selectSection = select =>
github newsuk / times-components / packages / article-skeleton / showcase-helper.js View on Github external
const selectScales = select => select("Scale", scales, scales.medium);
const selectSection = select =>