<commit_before>import React from 'react';
import { Blocks } from 'olymp-pages';
import { createComponent } from 'olymp-fela';
import { Maps } from 'olymp-google';
import { ImageStyles } from './image/block';

const Label = Blocks.ImageBlockLabel.component;
const MapContainer = createComponent(
  ({ theme }) => ({
    width: '100%',
    height: 300,
    position: 'relative',
    display: 'block',
    '> div > div > div > div': {
      borderBottomRightRadius: 100,
      overflow: 'hidden',
      ifSmallDown: {
        borderBottomRightRadius: 50,
      },
      '> div': {
        // .gm-style
        borderBottomRightRadius: 100,
        overflow: 'hidden',
        ifSmallDown: {
          borderBottomRightRadius: 50,
        },
      },
    },
    ...ImageStyles({ theme }),
    ifSmallDown: {
      ...ImageStyles({ theme }).ifSmallDown,
      height: 150,
    },
  }),
  ({ attributes, className, children }) =>
    (<div className={className} {...attributes}>
      <Maps
        center={{ lat: 59.724465, lng: 30.080121 }}
        zoom={1}
        options={() => ({
          panControl: false,
          mapTypeControl: false,
          zoomControl: false,
          scrollwheel: false,
          gestureHandling: 'none',
        })}
      >
        <Maps.Marker lat={59.724465} lng={30.080121} />
      </Maps>
      <Label>
        {children}
      </Label>
    </div>),
  p => Object.keys(p)
);

export default {
  key: 'GZK.Header.MapsBlock',
  label: 'Karte',
  category: 'Kopfleiste',
  editable: true,
  component: p => <MapContainer {...p} />,
};<commit_msg>set gz-map to right coords<commit_after>import React from 'react';
import { Blocks } from 'olymp-pages';
import { createComponent } from 'olymp-fela';
import { Maps } from 'olymp-google';
import { ImageStyles } from './image/block';

const Label = Blocks.ImageBlockLabel.component;
const MapContainer = createComponent(
  ({ theme }) => ({
    width: '100%',
    height: 300,
    position: 'relative',
    display: 'block',
    '> div > div > div > div': {
      borderBottomRightRadius: 100,
      overflow: 'hidden',
      ifSmallDown: {
        borderBottomRightRadius: 50,
      },
      '> div': {
        // .gm-style
        borderBottomRightRadius: 100,
        overflow: 'hidden',
        ifSmallDown: {
          borderBottomRightRadius: 50,
        },
      },
    },
    ...ImageStyles({ theme }),
    ifSmallDown: {
      ...ImageStyles({ theme }).ifSmallDown,
      height: 150,
    },
  }),
  ({ attributes, className, children }) =>
    (<div className={className} {...attributes}>
      <Maps
        center={{ lat: 50.13429468, lng: 8.45419139 }}
        zoom={17}
        options={() => ({
          panControl: false,
          mapTypeControl: false,
          zoomControl: false,
          scrollwheel: false,
          gestureHandling: 'none',
        })}
      >
        <Maps.Marker lat={50.13476404} lng={8.45419139} />
      </Maps>
      <Label>
        {children}
      </Label>
    </div>),
  p => Object.keys(p)
);

export default {
  key: 'GZK.Header.MapsBlock',
  label: 'Karte',
  category: 'Kopfleiste',
  editable: true,
  component: p => <MapContainer {...p} />,
};
{'fraction_non_alphanumeric': 0.1599622878692646, 'fraction_numerical': 0.03488372093023256, 'mean_word_length': 2.2086693548387095, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 39, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3000033', 'n_tokens_mistral': 1090, 'n_tokens_neox': 1006, 'n_words': 226}