mirror of
https://github.com/kremalicious/blog.git
synced 2024-06-28 16:48:00 +02:00
remark plugin for lead paragraph, more refactor
This commit is contained in:
parent
73bc1bd199
commit
620fa8cfb0
GPG Key ID:
606EEEF3C479A91F
|
|
@ -1,8 +1,12 @@
|
|||
import { defineConfig } from 'astro/config'
|
||||
import { remarkLeadParagraph } from './src/lib/remark-lead-paragraph.mjs'
|
||||
import react from '@astrojs/react'
|
||||
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
integrations: [react()],
|
||||
site: 'https://kremalicious.com'
|
||||
site: 'https://kremalicious.com',
|
||||
markdown: {
|
||||
remarkPlugins: [remarkLeadParagraph]
|
||||
},
|
||||
integrations: [react()]
|
||||
})
|
||||
|
|
|
|||
4204
package-lock.json
generated
4204
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
|
|
@ -27,15 +27,14 @@
|
|||
"@astrojs/react": "^3.0.0",
|
||||
"@astrojs/rss": "^3.0.0",
|
||||
"@astrojs/sitemap": "^3.0.0",
|
||||
"@rainbow-me/rainbowkit": "^1.0.9",
|
||||
"@rainbow-me/rainbowkit": "^1.0.10",
|
||||
"astro": "^3.0.7",
|
||||
"classnames": "^2.3.2",
|
||||
"date-fns": "^2.30.0",
|
||||
"dms2dec": "^1.1.0",
|
||||
"fast-exif": "^2.0.1",
|
||||
"fastestsmallesttextencoderdecoder": "^1.0.22",
|
||||
"feather-icons": "^4.29.1",
|
||||
"fraction.js": "^4.2.1",
|
||||
"fraction.js": "^4.3.6",
|
||||
"framer-motion": "^10.16.1",
|
||||
"nord-visual-studio-code": "github:arcticicestudio/nord-visual-studio-code",
|
||||
"pigeon-maps": "^0.21.3",
|
||||
|
|
@ -46,10 +45,9 @@
|
|||
"slugify": "^1.6.6",
|
||||
"use-debounce": "^9.0.4",
|
||||
"viem": "^1.9.0",
|
||||
"wagmi": "^1.3.10"
|
||||
"wagmi": "^1.3.11"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@svgr/webpack": "^8.1.0",
|
||||
"@testing-library/jest-dom": "^6.1.2",
|
||||
"@testing-library/react": "^14.0.0",
|
||||
"@types/jest": "^29.5.3",
|
||||
|
|
|
|||
|
|
@ -1,38 +0,0 @@
|
|||
import { ReactElement, useEffect, useState } from 'react'
|
||||
import { useSiteMetadata } from '../../hooks/useSiteMetadata'
|
||||
import Hamburger from '../core/Hamburger'
|
||||
import styles from './Menu.module.css'
|
||||
|
||||
export default function Menu(): ReactElement {
|
||||
const [menuOpen, setMenuOpen] = useState(false)
|
||||
const { menu } = useSiteMetadata()
|
||||
|
||||
function toggleMenu(): void {
|
||||
setMenuOpen(!menuOpen)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (menuOpen) {
|
||||
document.body.classList.add('has-menu-open')
|
||||
} else {
|
||||
document.body.classList.remove('has-menu-open')
|
||||
}
|
||||
}, [menuOpen])
|
||||
|
||||
const MenuItems = menu.map((item) => (
|
||||
<li key={item.title}>
|
||||
<a onClick={toggleMenu} href={item.link}>
|
||||
{item.title}
|
||||
</a>
|
||||
</li>
|
||||
))
|
||||
|
||||
return (
|
||||
<>
|
||||
<Hamburger onClick={toggleMenu} />
|
||||
<nav aria-label="Pages" className={styles.menu}>
|
||||
<ul>{MenuItems}</ul>
|
||||
</nav>
|
||||
</>
|
||||
)
|
||||
}
|
||||
33
src/components/Header/Menu/index.astro
Normal file
33
src/components/Header/Menu/index.astro
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
---
|
||||
import Hamburger from '../../core/Hamburger.astro'
|
||||
import config from '@config/blog.config.mjs'
|
||||
import styles from './index.module.css'
|
||||
---
|
||||
|
||||
<Hamburger id="menu-button" />
|
||||
<nav aria-label="Pages" class={styles.menu}>
|
||||
<ul>
|
||||
{
|
||||
config.menu.map((item) => (
|
||||
<li>
|
||||
<a href={item.link}>{item.title}</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<script>
|
||||
let menuOpen = false
|
||||
const hamburger = document.querySelector('#menu-button')
|
||||
|
||||
hamburger?.addEventListener('click', () => {
|
||||
menuOpen = !menuOpen
|
||||
|
||||
if (menuOpen) {
|
||||
document.body.classList.add('has-menu-open')
|
||||
} else {
|
||||
document.body.classList.remove('has-menu-open')
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
|
@ -31,7 +31,6 @@
|
|||
text-transform: uppercase;
|
||||
margin: 0 calc(var(--spacer) / 4);
|
||||
font-size: var(--font-size-small);
|
||||
text-shadow: 0 1px 0 rgba(255 255 255 / 50%);
|
||||
padding: var(--padding-base-horizontal);
|
||||
display: block;
|
||||
text-align: center;
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
import Menu from './Menu'
|
||||
import Menu from './Menu/index.astro'
|
||||
// import Search from './Search'
|
||||
import ThemeSwitch from '../ThemeSwitch/index.astro'
|
||||
import { Logo } from '@images/icons'
|
||||
|
|
|
|||
84
src/components/core/Hamburger.astro
Normal file
84
src/components/core/Hamburger.astro
Normal file
|
|
@ -0,0 +1,84 @@
|
|||
---
|
||||
const { props } = Astro
|
||||
---
|
||||
|
||||
<style>
|
||||
.hamburger {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
transform: rotate(0deg);
|
||||
cursor: pointer;
|
||||
margin-top: calc(var(--spacer) / 2);
|
||||
}
|
||||
|
||||
.line {
|
||||
display: block;
|
||||
position: absolute;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
border-bottom: var(--stroke-width) solid var(--text-color-light);
|
||||
opacity: 1;
|
||||
left: 0;
|
||||
transform: rotate(0deg);
|
||||
transition: 0.2s var(--easing);
|
||||
}
|
||||
|
||||
.line:nth-child(1) {
|
||||
top: 0;
|
||||
transform-origin: left center;
|
||||
}
|
||||
|
||||
.line:nth-child(2) {
|
||||
top: 7px;
|
||||
transform-origin: left center;
|
||||
}
|
||||
|
||||
.line:nth-child(3) {
|
||||
top: 14px;
|
||||
transform-origin: left center;
|
||||
}
|
||||
|
||||
/* open state */
|
||||
:global(.has-menu-open) .line:nth-child(1) {
|
||||
transform: rotate(45deg);
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
:global(.has-menu-open) .line:nth-child(2) {
|
||||
width: 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
:global(.has-menu-open) .line:nth-child(3) {
|
||||
transform: rotate(-45deg);
|
||||
top: 16px;
|
||||
}
|
||||
|
||||
.button {
|
||||
padding: calc(var(--spacer) / 2);
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
margin-right: -1rem;
|
||||
}
|
||||
|
||||
.button:hover,
|
||||
.button:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.button:hover .line,
|
||||
.button:focus .line {
|
||||
border-color: var(--link-color);
|
||||
}
|
||||
</style>
|
||||
|
||||
<button type="button" title="Menu" class="button" {...props}>
|
||||
<span class="hamburger">
|
||||
<span class="line"></span>
|
||||
<span class="line"></span>
|
||||
<span class="line"></span>
|
||||
</span>
|
||||
</button>
|
||||
|
|
@ -1,70 +0,0 @@
|
|||
.hamburger {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
transform: rotate(0deg);
|
||||
cursor: pointer;
|
||||
margin-top: calc(var(--spacer) / 2);
|
||||
}
|
||||
|
||||
.line {
|
||||
display: block;
|
||||
position: absolute;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
border-bottom: var(--stroke-width) solid var(--text-color-light);
|
||||
opacity: 1;
|
||||
left: 0;
|
||||
transform: rotate(0deg);
|
||||
transition: 0.2s var(--easing);
|
||||
}
|
||||
|
||||
.line:nth-child(1) {
|
||||
top: 0;
|
||||
transform-origin: left center;
|
||||
}
|
||||
|
||||
.line:nth-child(2) {
|
||||
top: 7px;
|
||||
transform-origin: left center;
|
||||
}
|
||||
|
||||
.line:nth-child(3) {
|
||||
top: 14px;
|
||||
transform-origin: left center;
|
||||
}
|
||||
|
||||
/* open state */
|
||||
:global(.has-menu-open) .line:nth-child(1) {
|
||||
transform: rotate(45deg);
|
||||
top: -1px;
|
||||
}
|
||||
|
||||
:global(.has-menu-open) .line:nth-child(2) {
|
||||
width: 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
:global(.has-menu-open) .line:nth-child(3) {
|
||||
transform: rotate(-45deg);
|
||||
top: 16px;
|
||||
}
|
||||
|
||||
.button {
|
||||
padding: calc(var(--spacer) / 2);
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
margin-right: -1rem;
|
||||
}
|
||||
|
||||
.button:hover,
|
||||
.button:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.button:hover .line,
|
||||
.button:focus .line {
|
||||
border-color: var(--link-color);
|
||||
}
|
||||
|
|
@ -1,23 +0,0 @@
|
|||
import type { ReactElement } from 'react'
|
||||
import styles from './Hamburger.module.css'
|
||||
|
||||
export default function Hamburger({
|
||||
onClick
|
||||
}: {
|
||||
onClick(): void
|
||||
}): ReactElement {
|
||||
return (
|
||||
<button
|
||||
type="button"
|
||||
title="Menu"
|
||||
className={styles.button}
|
||||
onClick={onClick}
|
||||
>
|
||||
<span className={styles.hamburger}>
|
||||
<span className={styles.line} />
|
||||
<span className={styles.line} />
|
||||
<span className={styles.line} />
|
||||
</span>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
@ -15,13 +15,15 @@
|
|||
padding-top: var(--spacer);
|
||||
background-color: var(--body-background-color);
|
||||
padding-bottom: calc(var(--spacer) * 2);
|
||||
transform: translate3d(0, 0, 0);
|
||||
transition: 0.4s var(--easing);
|
||||
transition-property: transform, background, border, box-shadow;
|
||||
border-top: 1px solid rgba(255 255 255 / 85%);
|
||||
box-shadow:
|
||||
0 1px 10px rgba(1 85 101 / 10%),
|
||||
0 -1px 4px rgba(1 85 101 / 5%);
|
||||
|
||||
/* animates the page menu opening/closing */
|
||||
transition: 0.2s ease-out;
|
||||
will-change: transform;
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
:global(.has-menu-open) .document {
|
||||
|
|
|
|||
|
|
@ -2,60 +2,31 @@
|
|||
import type { CollectionEntry } from 'astro:content'
|
||||
import LayoutBase from '@layouts/Base/index.astro'
|
||||
import Title from './Title.astro'
|
||||
import styles from './index.module.css'
|
||||
|
||||
type Props = CollectionEntry<'articles' | 'links' | 'photos'>
|
||||
|
||||
const { collection, body, data } = Astro.props
|
||||
const { title, date, updated, image, linkurl } = data
|
||||
|
||||
// Extract lead paragraph from content
|
||||
// Grab everything before more tag, or just first paragraph
|
||||
let lead
|
||||
const separator = '<!-- more -->'
|
||||
|
||||
if (collection === 'articles') {
|
||||
lead = body.includes(separator)
|
||||
? body.split(separator)[0]
|
||||
: body.split('\n')[0]
|
||||
type Props = CollectionEntry<'articles' | 'links' | 'photos'> & {
|
||||
lead?: string // comes in through remark plugin as html
|
||||
}
|
||||
|
||||
const { data, lead } = Astro.props
|
||||
const { title, date, updated, image, linkurl } = data
|
||||
---
|
||||
|
||||
<style>
|
||||
.entry {
|
||||
/* composes: container from '../../Layout.module.css'; */
|
||||
width: 100%;
|
||||
padding-bottom: var(--spacer);
|
||||
}
|
||||
|
||||
.entry > a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.entry:only-child {
|
||||
padding-bottom: var(--spacer);
|
||||
}
|
||||
|
||||
.image {
|
||||
/* composes: breakout from '../../Layout.module.css'; */
|
||||
}
|
||||
|
||||
.lead {
|
||||
font-size: var(--font-size-large);
|
||||
margin-bottom: calc(var(--spacer) * var(--line-height));
|
||||
}
|
||||
</style>
|
||||
|
||||
<LayoutBase title={title}>
|
||||
<article class="entry">
|
||||
<article class={styles.entry}>
|
||||
<header>
|
||||
<Title linkurl={linkurl} title={title} date={date} updated={updated} />
|
||||
</header>
|
||||
|
||||
{lead && <div class="lead">{lead}</div>}
|
||||
{lead && <div class={styles.lead} set:html={lead} />}
|
||||
|
||||
<div class="hero-image">
|
||||
{image && <img width={1020} height={510} src={image} alt="" />}
|
||||
</div>
|
||||
{
|
||||
image && (
|
||||
<div class={styles.image}>
|
||||
<img width={1040} height={460} src={image} alt={title} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
<slot />
|
||||
</article>
|
||||
|
|
|
|||
47
src/components/layouts/Post/index.module.css
Normal file
47
src/components/layouts/Post/index.module.css
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
.entry {
|
||||
composes: container from '../Base/index.module.css';
|
||||
padding-bottom: var(--spacer);
|
||||
}
|
||||
|
||||
.entry > a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.entry p:only-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.entry hr {
|
||||
position: relative;
|
||||
border-bottom: 1px dashed var(--border-color);
|
||||
margin-top: calc(var(--spacer) * var(--line-height));
|
||||
margin-bottom: calc(var(--spacer) * var(--line-height));
|
||||
}
|
||||
|
||||
.entry hr:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
height: 1px;
|
||||
bottom: -2px;
|
||||
width: 100%;
|
||||
border-bottom: 1px dashed #fff;
|
||||
}
|
||||
|
||||
:global([data-theme='dark']) .entry hr:before {
|
||||
border-bottom-color: var(--brand-grey);
|
||||
}
|
||||
|
||||
.entry img {
|
||||
border-radius: var(--border-radius);
|
||||
}
|
||||
|
||||
.image {
|
||||
composes: breakout from '../Base/index.module.css';
|
||||
margin-bottom: calc(var(--spacer) * var(--line-height));
|
||||
}
|
||||
|
||||
.lead {
|
||||
font-size: var(--font-size-large);
|
||||
margin-bottom: calc(var(--spacer) * var(--line-height));
|
||||
}
|
||||
|
|
@ -8,9 +8,9 @@ tags:
|
|||
- design
|
||||
---
|
||||
|
||||
If you resize your browser window while you are browsing this website you can see the black polaroids in my header fly and move at different speed on three layers. Pretty cool, huh?
|
||||
If you resize your browser window while you are browsing this website you can see the black polaroids in my header fly and move at different speed on three layers. Pretty cool, huh?
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
I implemented the header effect of those flying black polaroids on kremalicious.com following the original idea by the folks of [clearleft](http://clearleft.com/) on [their silverback teaser page](http://www.silverbackapp.com/)
|
||||
|
||||
|
|
|
|||
|
|
@ -8,11 +8,9 @@ tags:
|
|||
- photography
|
||||
---
|
||||
|
||||
|
||||
|
||||
The Columbia University has announced the winners for 2008 of the 92nd annual Pulitzer Price. The Pulitzer Price itself is often cited as the highest honor for american journalists. Among the various categories there are two winning entries for [Breaking News Photography](http://www.pulitzer.org/year/2008/breaking-news-photography) and [Feature Photography](http://www.pulitzer.org/year/2008/feature-photography).
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
In the Breaking News Photography the price was won by Adrees Latif of Reuters [for his picture of the japanese videographer Kenji Nagai shot down during riots in Myanmar in 2007](http://www.pulitzer.org/year/2008/breaking-news-photography/works/).
|
||||
|
||||
|
|
|
|||
|
|
@ -15,11 +15,11 @@ redirect_from:
|
|||
- /2008/04/changing-the-image-icons-in-mac-os-x-leopard/
|
||||
---
|
||||
|
||||
After i released my [Aperture File Types icon set](http://www.kremalicious.com/goodies) many of you asked how they can really use these icons for displaying the icons of images on your Mac system.
|
||||
|
||||
[](../media/aperturefiletypes.png)
|
||||
|
||||
After i released my [Aperture File Types icon set](http://www.kremalicious.com/goodies) many of you asked how they can really use these icons for displaying the icons of images on your Mac system. Sadly this isn't as easy as dropping them in [Candybar](http://www.panic.com/candybar) into a well for image icons cause there isn't any well for them. So using other icons as standard file type icons for images is a bit tricky. I discovered two ways of doing it, which involves overwriting resources of Preview.app and Photoshop. So before doing anything I mention in this post, you should make a backup copy of them.
|
||||
|
||||
<!-- more -->
|
||||
Sadly this isn't as easy as dropping them in [Candybar](http://www.panic.com/candybar) into a well for image icons cause there isn't any well for them. So using other icons as standard file type icons for images is a bit tricky. I discovered two ways of doing it, which involves overwriting resources of Preview.app and Photoshop. So before doing anything I mention in this post, you should make a backup copy of them.
|
||||
|
||||
## Changing Preview.app icons
|
||||
|
||||
|
|
|
|||
|
|
@ -9,11 +9,11 @@ tags:
|
|||
- aperture
|
||||
---
|
||||
|
||||
Panoramic photographer [Ian Wood](http://www.ianjameswood.co.uk/) has released an automation helper for Apple's Aperture called [Aperture Assistant](http://aperture-assistant.com) as a first beta version (build 49).
|
||||
|
||||
|
||||
|
||||
Panoramic photographer [Ian Wood](http://www.ianjameswood.co.uk/) has released an automation helper for Apple's Aperture called [Aperture Assistant](http://aperture-assistant.com) as a first beta version (build 49). Aperture Assistent allows you to setup and automate complex tasks for Apple's Aperture beyond the Apple delivered Automator actions in Mac OS X. The setup of these workflows is as easy as dragging around visual flowcharts.
|
||||
|
||||
<!-- more -->
|
||||
Aperture Assistent allows you to setup and automate complex tasks for Apple's Aperture beyond the Apple delivered Automator actions in Mac OS X. The setup of these workflows is as easy as dragging around visual flowcharts.
|
||||
|
||||
Although the interface looks and feels a bit buggy (dude, it's a beta!) it looks very promising.
|
||||
|
||||
|
|
|
|||
|
|
@ -10,11 +10,11 @@ tags:
|
|||
- css
|
||||
---
|
||||
|
||||
Writing right now on a longer article about text-shadow and it's implementation in WebKit, the rendering engine which powers Safari and Konqueror.
|
||||
|
||||
|
||||
|
||||
Writing right now on a longer article about text-shadow and it's implementation in WebKit, the rendering engine which powers Safari and Konqueror. But now this exciting news popped up from Surfin' Safari, the blog of the WebKit development team:
|
||||
|
||||
<!-- more -->
|
||||
But now this exciting news popped up from Surfin' Safari, the blog of the WebKit development team:
|
||||
|
||||
> WebKit now supports gradients specified in CSS. There are two types of gradients: linear gradients and radial gradients.
|
||||
|
||||
|
|
|
|||
|
|
@ -12,9 +12,9 @@ redirect_from:
|
|||
- /2008/04/make-cool-and-clever-text-effects-with-css-text-shadow/
|
||||
---
|
||||
|
||||
The aim of this article is to give you a quick introduction of a css property named text-shadow which was first included in CSS2 (but it's not implemented in all browsers yet). Nevertheless you can make some cool effects with it, which could only be done before by photoshopping text and rendering it as an image.
|
||||
The aim of this article is to give you a quick introduction of a css property named text-shadow which was first included in CSS2 (but it's not implemented in all browsers yet). Nevertheless you can make some cool effects with it, which could only be done before by photoshopping text and rendering it as an image.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
Because it's included in Safari since version 1.1(!) Mac users should be aware of various effects done by this property. In fact, most companys and persons with mac users as their main target audience use this effect on their websites.
|
||||
|
||||
|
|
@ -274,8 +274,12 @@ Sadly Safari 3 isn't able to render more than one shadow on one element. It just
|
|||
```css
|
||||
color: #000;
|
||||
background: #000;
|
||||
text-shadow: 0 0 4px #ccc, 0 -5px 4px #ff3, 2px -10px 6px #fd3, -2px -15px 11px
|
||||
#f80, 2px -18px 18px #f20;
|
||||
text-shadow:
|
||||
0 0 4px #ccc,
|
||||
0 -5px 4px #ff3,
|
||||
2px -10px 6px #fd3,
|
||||
-2px -15px 11px #f80,
|
||||
2px -18px 18px #f20;
|
||||
```
|
||||
|
||||
<p style="color: #000;
|
||||
|
|
|
|||
|
|
@ -8,9 +8,11 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
Just right after [Tiffen and Digital Film Tools announced](http://www.kremalicious.com/2008/04/first-aperture-adjustment-plugins-have-arrived/) their new image editing plugins for Aperture 2.1 Apple has released the Software Development Kit (SDK) for coding Aperture 2.1 plugins. It's available [from Apple's Developer Connection](https://connect.apple.com/cgi-bin/WebObjects/MemberSite.woa/wa/getSoftware?bundleID=20044) for registered members (registering is free). You can grab the Aperture 2.1 plugin-SDK (3D9) as a 595KB download from there and start coding.
|
||||
Just right after [Tiffen and Digital Film Tools announced](http://www.kremalicious.com/2008/04/first-aperture-adjustment-plugins-have-arrived/) their new image editing plugins for Aperture 2.1, Apple has released the Software Development Kit (SDK) for coding Aperture 2.1 plugins.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
It's available [from Apple's Developer Connection](https://connect.apple.com/cgi-bin/WebObjects/MemberSite.woa/wa/getSoftware?bundleID=20044) for registered members (registering is free). You can grab the Aperture 2.1 plugin-SDK (3D9) as a 595KB download from there and start coding.
|
||||
|
||||
If you want to know what exactly you can do with it as a programmer you should [read those lines from Apple](http://developer.apple.com/appleapplications/aperturesdk.html).
|
||||
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@ tags:
|
|||
- css
|
||||
---
|
||||
|
||||
They won't stop with their cutting edge love. After having [text-shadow](http://www.kremalicious.com/2008/04/make-cool-and-clever-text-effects-with-css-text-shadow/) implemented since many years and having a bunch of other cool stuff implemented like CSS gradients or CSS box-shadow the WebKit team freshly announced a new cool feature: CSS alpha masks.
|
||||
They won't stop with their cutting edge love. After having [text-shadow](http://www.kremalicious.com/2008/04/make-cool-and-clever-text-effects-with-css-text-shadow/) implemented since many years and having a bunch of other cool stuff implemented like CSS gradients or CSS box-shadow the WebKit team freshly announced a new cool feature: CSS alpha masks.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
From the Surfin' Safari Blog:
|
||||
|
||||
|
|
|
|||
|
|
@ -10,9 +10,9 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
Today [Nik Software](http://www.niksoftware.com) announced the availability of it's U-point-technology based editing plugin for Apple's Aperture 2.1 called [Viveza](http://www.niksoftware.com/viveza).
|
||||
Today [Nik Software](http://www.niksoftware.com) announced the availability of it's U-point-technology based editing plugin for Apple's Aperture 2.1 called [Viveza](http://www.niksoftware.com/viveza).
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
With Viveza photographers are able to select areas from their images and adjust them separately from the rest of the picture by defining so called Color Control Points.
|
||||
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@ tags:
|
|||
- icon
|
||||
---
|
||||
|
||||
[](http://iconfactory.com/indianajones/)If you enjoyed the Indiana Jones movies than this first of four desktop icon sets is a must have for you. Icon Designer [Anthony Piraino](http://onebuttonmouse.com/) crafted some beautiful items from Indiana Jones and The Raiders of the Lost Ark movie.
|
||||
If you enjoyed the Indiana Jones movies than this first of four desktop icon sets is a must have for you. Icon Designer [Anthony Piraino](http://onebuttonmouse.com/) crafted some beautiful items from Indiana Jones and The Raiders of the Lost Ark movie.
|
||||
|
||||
<!-- more -->
|
||||
[](http://iconfactory.com/indianajones/)
|
||||
|
||||
The icons are available from the [special Iconfactory site](http://iconfactory.com/indianajones/) as an icontainer or mac and windows icon files. If you download the iContainer for use in [Candybar](http://www.panic.com/candybar/) you also get a new Mac OS X dock created by [David Lanham](http://dlanham.com/). All icons are free for your personal use only and there are already some nice placeholders for more icon sets inspired by the other movies. All of them will be released during May.
|
||||
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
With the release of Aperture 2.1 Apple introduced a plugin architecture for adding third party image adjustment and export plugins. Now the first third party image adjustment plugins for Aperture 2.1 have arrived. And they can definitely make you stop roundtripping your pictures to Photoshop and back. For now a total of 14 plugins from 9 companys were announced which are waiting to help you with your Aperture 2 workflow.
|
||||
With the release of Aperture 2.1 Apple introduced a plugin architecture for adding third party image adjustment and export plugins. Now the first third party image adjustment plugins for Aperture 2.1 have arrived.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
And they can definitely make you stop roundtripping your pictures to Photoshop and back. For now a total of 14 plugins from 9 companys were announced which are waiting to help you with your Aperture 2 workflow.
|
||||
|
||||
## Dfx digital filters plugin from Tiffen
|
||||
|
||||
|
|
|
|||
|
|
@ -8,9 +8,11 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
[](../media/imagetrends_hemi_10.jpg)Today Image Trends Inc. [announced](http://www.imagetrendsinc.com/news/Aperture%20Fisheye%20Hemi%20%20Final.pdf) the final availability of the anti-distortion plugin [Fisheye-Hemi](http://www.imagetrendsinc.com/products/prodpage_hemi.asp) as an editing plugin for Aperture 2.1. The plugin will remap your hemispheric images taken with a fisheye lens. So if you take pictures with a fisheye lens this plugin is a must have for you.
|
||||
Today Image Trends Inc. [announced](http://www.imagetrendsinc.com/news/Aperture%20Fisheye%20Hemi%20%20Final.pdf) the final availability of the anti-distortion plugin [Fisheye-Hemi](http://www.imagetrendsinc.com/products/prodpage_hemi.asp) as an editing plugin for Aperture 2.1.
|
||||
|
||||
<!-- more -->
|
||||
[](../media/imagetrends_hemi_10.jpg)
|
||||
|
||||
The plugin will remap your hemispheric images taken with a fisheye lens. So if you take pictures with a fisheye lens this plugin is a must have for you.
|
||||
|
||||
From the press release:
|
||||
|
||||
|
|
|
|||
|
|
@ -9,9 +9,11 @@ tags:
|
|||
- css
|
||||
---
|
||||
|
||||
As you may know there's a nice parallax effect implemented on this website. Just resize your browser window and you can see the black polaroids in my header flying on different layers. As I stated in an [earlier post](http://www.kremalicious.com/2008/03/love-the-parallax/) there is already some usage for it around the web while this effect seems to be first used by the guys from [Silverback](http://www.silverbackapp.com/). If you don't know what this effect is about head over to [thinkvitamin](http://www.thinkvitamin.com/features/design/how-to-recreate-silverbacks-parallax/trackback/) to get to know what it is and how you can achieve it.
|
||||
As you may know there's a nice parallax effect implemented on this website. Just resize your browser window and you can see the black polaroids in my header flying on different layers.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
As I stated in an [earlier post](http://www.kremalicious.com/2008/03/love-the-parallax/) there is already some usage for it around the web while this effect seems to be first used by the guys from [Silverback](http://www.silverbackapp.com/). If you don't know what this effect is about head over to [thinkvitamin](http://www.thinkvitamin.com/features/design/how-to-recreate-silverbacks-parallax/trackback/) to get to know what it is and how you can achieve it.
|
||||
|
||||
But now Marco Kuiper from [marcofolio.net](http://www.marcofolio.net) adds another usage for it. He created a cool optical illusion with just plain css/html and some pictures. You can see a [demo of this effect](http://demo.marcofolio.net/a_parallax_illusion_with_css/) in action on Marco's website. Head over to the demo and resize your browser window. You should articulate something like "whoooot!" now. Marco has written [some words about it](http://www.marcofolio.net/css/a_parallax_illusion_with_css_the_horse_in_motion.html) too and you can download the demo. He has also [done a nice tutorial](http://www.marcofolio.net/photoshop/your_own_css_parallax_illusion_3d_image.html) how to achieve this optical illusion. Very cool!
|
||||
|
||||
|
|
|
|||
|
|
@ -10,9 +10,9 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
Today [Human Software](http://www.humansoftware.com) released an exciting image editing plug-in for Apple's Aperture. It's called [ApertureEdit](http://www.humansoftware.com/pages1200/ApertureEdit/HSapertureedit11.html) and according to Human Software it offers more than 4000 professional effects which you can achieve right within Aperture.
|
||||
Today [Human Software](http://www.humansoftware.com) released an exciting image editing plug-in for Apple's Aperture. It's called [ApertureEdit](http://www.humansoftware.com/pages1200/ApertureEdit/HSapertureedit11.html) and according to Human Software it offers more than 4000 professional effects which you can achieve right within Aperture.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
The ApertureEdit plug-in is a bundle of 11 different modules for denoising, lens fixing, framing, light effects and many more. All effects can be applied to one image at a time or to a whole set of images at once. Just head over to the [product page](http://www.humansoftware.com/pages1200/ApertureEdit/HSapertureedit11.html) to see all effects and features this plugin bundle is capable of.
|
||||
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@ tags:
|
|||
- twitter
|
||||
---
|
||||
|
||||
In a heavy venturesome step of unreasonable Web 2.0 love I've decided to get me on Twitter and [opened up an account](https://twitter.com/kremalicious).
|
||||
In a heavy venturesome step of unreasonable Web 2.0 love I've decided to get me on Twitter and [opened up an account](https://twitter.com/kremalicious).
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
If you like, you can follow me now on Twitter while I try to find some advantages of this curious Twitter thing. The plan for now is to post about background updates of this website and about whatever I will throw into the Cloud on other places. But damn, just 140 characters. Feels like writing like it's 1999.
|
||||
|
||||
|
|
|
|||
|
|
@ -11,9 +11,11 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
Apple released a developer preview of the upcoming version of its web browser Safari to registered Developers. The Safari 4 Developer Preview is available for Mac OS X Tiger/Leopard and Windows. While the main changes are not visible to the user the most significant visible new feature is the overhauled Web Inspector.
|
||||
Apple released a developer preview of the upcoming version of its web browser Safari to registered Developers. The Safari 4 Developer Preview is available for Mac OS X Tiger/Leopard and Windows.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
While the main changes are not visible to the user the most significant visible new feature is the overhauled Web Inspector.
|
||||
|
||||
You can access Safari's Web Inspector through Develop > Show Web Inspector (you have to check the "Show Develop menu" box in the Preferences first to enable it). The Web Inspector, like the Firebug plug-in for Firefox, is a cool tool especially for Web Developers to inspect various elements of the website you're browsing.
|
||||
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@ tags:
|
|||
- aperture
|
||||
---
|
||||
|
||||
Have you ever looked for a way to quickly add text to your images [without photoshopping a watermark image](http://www.kremalicious.com/2008/05/high-quality-watermarks-with-aperture/) first?
|
||||
Have you ever looked for a way to quickly add text to your images [without photoshopping a watermark image](http://www.kremalicious.com/2008/05/high-quality-watermarks-with-aperture/) first?
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
There's a simple editing plug-in available for this task called [Borders & Titles](http://developer.apple.com/samplecode/BordersAndTitles/index.html) and as the name says you can add simple borders and text to your images within Aperture 2.1. It's a sample plug-in provided by Apple and it's fully functional. You can download it from Apple's Developer Connection website without registration:
|
||||
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
The All-in-one Aperture adjustment plugin bundle from [Human Software](http://www.humansoftware.com) is now called Edit for Aperture or just [Edit](http://www.humansoftware.com/pages1200/ApertureEdit/HSapertureedit11.html). The new version 1.2 can now apply multiple layers of curves correction at once and the interface gets a new split image view. Also "different compatibility issues for PowerPC users" were fixed according to the release notes.
|
||||
The All-in-one Aperture adjustment plugin bundle from [Human Software](http://www.humansoftware.com) is now called Edit for Aperture or just [Edit](http://www.humansoftware.com/pages1200/ApertureEdit/HSapertureedit11.html).
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
The new version 1.2 can now apply multiple layers of curves correction at once and the interface gets a new split image view. Also "different compatibility issues for PowerPC users" were fixed according to the release notes.
|
||||
|
||||
The ApertureEdit plug-in is a bundle of 12 different modules for denoising, lens fixing, framing, light effects and many more. All effects can be applied to one image at a time or to a whole set of images at once and according to Human Software Edit offers more than 4000 professional effects. Just head over to the [product page](http://www.humansoftware.com/pages1200/ApertureEdit/HSapertureedit11.html) to see all effects and features this plugin bundle is capable of.
|
||||
|
||||
|
|
|
|||
|
|
@ -8,9 +8,11 @@ tags:
|
|||
- photography
|
||||
---
|
||||
|
||||
After the latest Digital Photo Professional update (DPP 3.4.1.1) [revealed some evidence about an upcoming Canon EOS Rebel XS/1000D](http://www.bobatkins.com/photography/digital/canon_xs_1000D_dpp34.html), Canon finally introduced this new entry-level DSLR this month. The [EOS Digital Rebel XS/1000D/Kiss F](http://www.canon-europe.com/For_Home/Product_Finder/Cameras/Digital_SLR/EOS_1000D/index.asp) ([full product specifications](http://www.canon-europe.com/For_Home/Product_Finder/Cameras/Digital_SLR/EOS_1000D/index.asp?specs=1)) is technically a hybrid between hardware and features found in Canon's entry-level cameras from the past: the 7-point autofocus system comes from the XT/350D, the Digic III processor is the same as in the XSi/450D and the Live View feature is implemented with the same features as found in the XSi/450D.
|
||||
After the latest Digital Photo Professional update (DPP 3.4.1.1) [revealed some evidence about an upcoming Canon EOS Rebel XS/1000D](http://www.bobatkins.com/photography/digital/canon_xs_1000D_dpp34.html), Canon finally introduced this new entry-level DSLR this month.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
The [EOS Digital Rebel XS/1000D/Kiss F](http://www.canon-europe.com/For_Home/Product_Finder/Cameras/Digital_SLR/EOS_1000D/index.asp) ([full product specifications](http://www.canon-europe.com/For_Home/Product_Finder/Cameras/Digital_SLR/EOS_1000D/index.asp?specs=1)) is technically a hybrid between hardware and features found in Canon's entry-level cameras from the past: the 7-point autofocus system comes from the XT/350D, the Digic III processor is the same as in the XSi/450D and the Live View feature is implemented with the same features as found in the XSi/450D.
|
||||
|
||||
With this DSLR Canon seems to open up a new class in their EOS system which is somehow below the former entry level cameras (XT/350D, XTi/400D) and the latest entry-level XSi/450D. It's priced 200\$ below Canons current or former entry-level DSLR XSi/450D and you can find a nice first review of this new DSLR [over at Digital Photography Review](http://www.dpreview.com/previews/Canon_1000D/).
|
||||
|
||||
|
|
|
|||
|
|
@ -1,47 +0,0 @@
|
|||
---
|
||||
title: Everything Back To Normal On Kremalicious.com (Almost)
|
||||
author: Matthias Kretschmann
|
||||
|
||||
date: 2008-07-01 16:39:02+00:00
|
||||
|
||||
tags:
|
||||
- personal
|
||||
- wordpress
|
||||
---
|
||||
|
||||
As you may have noticed, kremalicious.com was a bit screwed in the last week and some of you have asked me via mail and twitter what exactly was wrong. So to satisfy the curious geek in you I will provide some informations about it.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
It all started with a move of my whole website to new and shiny servers with PHP 5 running by my host. I didn't heard of any incompatibilities between the latest Wordpress version running on PHP 5 and in fact Wordpress loves to use PHP 5. But somehow I wasn't able to update my site neither over http or ftp. Since I can contact my host admins directly ([thank you jpBerlin/Heinlein-Support!](http://www.jpberlin.de/)) this problem was addressed rather quickly. They just neglected to tell me that the server address for login also changed (I should have think of this too). So all my changes were applied to my Wordpress installation on the old server. Problem solved I thought.
|
||||
|
||||
But more problems appeared. The display of the newest and latest posts and the next post/previous post links at the end of every article didn't work as they should. But not enough I wasn't able to moderate any comments. Sigh. Looked like any sort of database problem and I started a lot of things. First I manually scanned all database entries for any wrong things but I couldn't find anything suspicious. After that I dropped the whole database and imported my database dump but this didn't solve the problems. My final step was to re-install everything so that Wordpress creates the tables in the databse. And guess what: It didn't work too!
|
||||
|
||||
Now it's clear something with my code must be wrong, I thought. For displaying the latest posts in Wordpress I use a pretty standard way which is [described in the Wordpress Codex](http://codex.wordpress.org/Template_Tags/get_posts):
|
||||
|
||||
```php
|
||||
<?php $postslist = get_posts('numberposts=5&order=DESC&orderby;=post_date');
|
||||
foreach ($postslist as $post) : setup_postdata($post); ?>
|
||||
<ul>
|
||||
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a><span><?php the_date(); ?></span></li>
|
||||
</ul>
|
||||
<?php endforeach; ?>
|
||||
```
|
||||
|
||||
This would get all recent posts sorted by their post_date entry in the (wp_posts) database table and style it as an unordered list with my preferred format. This code worked since the launch of kremalicious.com and I first used it to display the recent blog entries on my start page. But since i didn't change anything in the code this couldn't be caused by wrong code or something.
|
||||
|
||||
So finally I've decided to [post a question](http://wordpress.org/support/topic/185896) describing my problems in the Wordpress support forums and that finally didn't solve my problems but now it was clear what caused this bad behavior: [A bug in MySQL](http://bugs.mysql.com/bug.php?id=32202)!
|
||||
|
||||
Now this makes sense! Beside the new PHP 5 version my host new server also included a new MySQL version which was affected [by this bug](http://bugs.mysql.com/bug.php?id=32202). The bug in short: Every query with GROUP BY just ignores the subsequent ORDER BY clause. Yeah, I found it!
|
||||
|
||||
This bug affects all versions of MySQL since 5.0.50 and it seems there is no stable version available at the moment with the fix included (please correct me if I'm wrong!). So if you're running Wordpress on a server with one of these MySQL versions installed you should experience my problems as well if you're using get_posts/orderby stuff.
|
||||
|
||||
Thankfully [a commenter](http://wordpress.org/support/topic/185896#post-793417) in the Wordpress forums reminded me of a nice temporary solution to this mess until my host updates MySQL: using wp_get_archives for displaying the recent posts. But this won't let me display the dates anymore:
|
||||
|
||||
```php
|
||||
<?php wp_get_archives('type=postbypost&limit;=5'); ?>
|
||||
```
|
||||
|
||||
Problem temporary solved!
|
||||
|
||||
The remaining problem is the wrong display of the next post/previous post links under every article (single.php). A commenter on my post in the Wordpress forum states that this could be caused by different loops interfering with each other. But I can't find anything wrong in my code with the loops and more important I didn't change the code and it worked fine before the server move. Now the only thing I can do is to wait for my host updating the MySQL installation. Then I will see if this remaining problem is caused by MySQL too. But as always, if you have any suggestions feel free to post them in the comments.
|
||||
|
|
@ -10,11 +10,9 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
|
||||
|
||||
Last week two new image editing plug-ins were announced for Aperture 2.1: The PTLens plug-in for correcting barrel distortion, vignetting, chromatic aberration, and perspective and the Jade plug-in for automatic correction of color, levels and exposure.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
The [PTLens plug-in](http://epaperpress.com/ptlens/) from [ePaperPress](http://epaperpress.com/) was available as a Photoshop plug-in in the past and is well known for its lens pincushion, barrel distortion, vignetting, chromatic aberration, and perspective correction abilities based on a lens model database similiar to [Kekus' LensFix CI plug-in](http://www.kekus.com/software/plugin.html).
|
||||
|
||||
|
|
|
|||
|
|
@ -9,11 +9,9 @@ tags:
|
|||
- iphone
|
||||
---
|
||||
|
||||
|
||||
|
||||
I'm thrilled to announce that kremalicious.com now uses an iPhone optimized theme. When you browse this website with your iPhone everything will automagically switch to the new kremalicious iPhone theme which is simply called kremalicious{iPhone}. See those hip brackets?
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
When the website detects an iPhone or iPod Touch it will automatically switch to another freshly created theme which is absolutely seamless to the user. This detection is done by the wonderful slim iPhone Wordpress plug-in from ContentRobot which was slightly modified by me.
|
||||
|
||||
|
|
|
|||
|
|
@ -10,9 +10,11 @@ tags:
|
|||
- apple
|
||||
---
|
||||
|
||||
Beside a new version of Color Efex Pro for Capture NX, Nik announced a brand new plug-in for Photoshop and Aperture. [Silver Efex Pro](http://www.niksoftware.com/silverefexpro/usa/entry.php) is a tool to create black & white images with the power and simplicity of the U-Point technology. You can easily fine tune portions of your black & white images. It's also capable of emulating film grain and 18 different types of film while also providing 20 one-click preset styles. But Silver Efex Pro is also capable of color toning the image.
|
||||
Beside a new version of Color Efex Pro for Capture NX, Nik announced a brand new plug-in for Photoshop and Aperture.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
[Silver Efex Pro](http://www.niksoftware.com/silverefexpro/usa/entry.php) is a tool to create black & white images with the power and simplicity of the U-Point technology. You can easily fine tune portions of your black & white images. It's also capable of emulating film grain and 18 different types of film while also providing 20 one-click preset styles. But Silver Efex Pro is also capable of color toning the image.
|
||||
|
||||
[](../media/nik_silverefex.png)
|
||||
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@ tags:
|
|||
- wordpress
|
||||
---
|
||||
|
||||
Since Wordpress 2.5 it was nearly impossible for me to log into Wordpress and quickly head over to the write tab. The Dashboard always wants to load a bunch of things in it but this always seemed to fail in my setup and slow things down. And not enough the Dashboard just locks everything up while loading which can take more than one minute.
|
||||
Since Wordpress 2.5 it was nearly impossible for me to log into Wordpress and quickly head over to the write tab. The Dashboard always wants to load a bunch of things in it but this always seemed to fail in my setup and slow things down. And not enough the Dashboard just locks everything up while loading which can take more than one minute.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
I've searched for a simple way of disabling those feeds, plugins etc. stuff the Wordpress Dashboard tries to fill but it seems you can't disable these from the backend. But there's a quick way for doing this which involves editing your /wp-admin/index-extra.php and uncomment some lines there. This will leave your Dashboard intact while it stops Wordpress from connecting to various sources to screw your blog up when you just want to quickly write something.
|
||||
|
||||
|
|
|
|||
|
|
@ -9,8 +9,6 @@ tags:
|
|||
|
||||
As you may know there's a huge Internet censorship going on in China. Contrary to promises made by chinese authorities and the International Olympic Committee (IOC) this Internet censorship is active during the Olympic Games [even in the international media centre](http://news.bbc.co.uk/2/hi/asia-pacific/7532338.stm). And the [IOC shares the current ideas of censorship in China](http://www.rsf.org/article.php3?id_article=26461).
|
||||
|
||||
<!-- more -->
|
||||
|
||||
And as in every political system with totalitarian elements there's a good chance you will meet some angry lackeys if you're going to report about topics the chinese authorities don't want you to report. But more important they will threat your sources if their identity gets revealed. So if you want to report about [the water shortage in the villages around Beijing](http://www.voanews.com/english/2008-06-27-voa10.cfm), the [massive air pollution in Beijing](http://english.chosun.com/w21data/html/news/200807/200807300031.html) or about all the forced resettlements going on in China you should consider some security precautions to protect you and your sources.
|
||||
|
||||
Especially there's two things to do here: First you have to use technologies to circumvent firewalls. Second is to secure your connections and your communication to protect you and your sources.
|
||||
|
|
|
|||
|
|
@ -14,11 +14,11 @@ tags:
|
|||
toc: true
|
||||
---
|
||||
|
||||
When on the road I always take a little mobile hard drive with me where all my referenced Aperture Masters from the past years and my mobile Aperture Vault (backing up the un-referenced Masters from the current year) reside. But being little and mobile also means the external hard drive can easily be lost or stolen exposing all my pictures to the thief. To avoid that you can use encryption so in the case of a lost or theft the data is not accessible by the thief. This can easily be done with [sparse bundle disk images](http://db.tidbits.com/article/9673) so you won't have to encrypt the whole hard drive with additional software.
|
||||
In this quick tutorial I will show you how to create an encrypted Aperture Vault by using Sparse Bundle Disk Images and by utilizing tools built into Mac OS X. All this can be done in two simple steps.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
So in this quick tutorial I will show you how to create an encrypted Aperture Vault by using Sparse Bundle Disk Images and by utilizing tools built into Mac OS X. All this can be done in two simple steps.
|
||||
When on the road I always take a little mobile hard drive with me where all my referenced Aperture Masters from the past years and my mobile Aperture Vault (backing up the un-referenced Masters from the current year) reside. But being little and mobile also means the external hard drive can easily be lost or stolen exposing all my pictures to the thief. To avoid that you can use encryption so in the case of a lost or theft the data is not accessible by the thief. This can easily be done with [sparse bundle disk images](http://db.tidbits.com/article/9673) so you won't have to encrypt the whole hard drive with additional software.
|
||||
|
||||
## 1. Create an encrypted disk image
|
||||
|
||||
|
|
|
|||
|
|
@ -9,12 +9,12 @@ tags:
|
|||
- aperture
|
||||
---
|
||||
|
||||
Earlier this month [PictureCode](http://www.picturecode.com) finally released their noise reduction software [Noise Ninja](http://www.picturecode.com/media.htm) as an Aperture plug-in for Aperture 2.1 and above.
|
||||
Earlier this month [PictureCode](http://www.picturecode.com) finally released their noise reduction software [Noise Ninja](http://www.picturecode.com/media.htm) as an Aperture plug-in for Aperture 2.1 and above.
|
||||
|
||||
|
||||
|
||||
The results are just as amazing as they are with the Photoshop plug-in. But the Aperture plug-in uses a streamlined interface which differs from the photoshop version. But the functionality is the same.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
You can [download a trial version of Noise Ninja for Aperture](http://www.picturecode.com/nn_aperture.htm) (images are watermarked with a grid pattern when you save them) and give it a try. The Noise Ninja plug-in for Aperture is available as a part of the [Pro Bundle (US\$ 79.95)](http://www.picturecode.com/purchase.php) which includes the Photoshop and the Aperture plug-in. If you have an existing Pro Bundle license you can [upgrade it for US\$ 20](http://www.picturecode.com/upgrade.php) to include the Aperture plug-in license.
|
||||
|
||||
Interested in more Aperture plug-ins? Just have a look at my article [First overview: Aperture 2.1 adjustment plugins have arrived](http://www.kremalicious.com/2008/05/first-aperture-adjustment-plugins-have-arrived/) to get an overview about what's available at the moment or [browse my blog by the Aperture plug-in tag](http://www.kremalicious.com/tag/aperture-plug-in/). Additionally you can have a look at the [brand new Apple website for all the Aperture plug-ins and ressources](http://www.apple.com/aperture/resources/plugins.html).
|
||||
|
|
|
|||
|
|
@ -8,9 +8,9 @@ tags:
|
|||
- goodies
|
||||
---
|
||||
|
||||
Personally I blog everything with RedSweater's awesome application [MarsEdit](http://www.red-sweater.com/marsedit/). MarsEdit has a cool preview window included where you can see your writing live while you type. The formatting of this preview is based on simple HTML and CSS so the style is pretty customizable.
|
||||
Personally I blog everything with RedSweater's awesome application [MarsEdit](http://www.red-sweater.com/marsedit/). MarsEdit has a cool preview window included where you can see your writing live while you type. The formatting of this preview is based on simple HTML and CSS so the style is pretty customizable.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
|
||||
A while ago I've made a custom style for the blog on kremalicious.com and would like to share this style with you. The style is based on the colors used on kremalicious.com with a black background and light grey text on top of it. The links have the same blueish hover style as on my website:
|
||||
|
||||
|
|
@ -48,7 +48,10 @@ Just copy and paste the following HTML and CSS into your Preview Template editor
|
|||
color: #778caa;
|
||||
background-color: #333;
|
||||
margin: 0;
|
||||
font: normal 2.1em 'HelveticaNeue-UltraLight', Helvetica, sans-serif;
|
||||
font:
|
||||
normal 2.1em 'HelveticaNeue-UltraLight',
|
||||
Helvetica,
|
||||
sans-serif;
|
||||
}
|
||||
|
||||
#title a {
|
||||
|
|
@ -62,7 +65,11 @@ Just copy and paste the following HTML and CSS into your Preview Template editor
|
|||
}
|
||||
|
||||
#content {
|
||||
font: 1em 'Lucida Grande', Lucida, Verdana, sans-serif;
|
||||
font:
|
||||
1em 'Lucida Grande',
|
||||
Lucida,
|
||||
Verdana,
|
||||
sans-serif;
|
||||
color: #ddd;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
|
@ -75,7 +82,12 @@ Just copy and paste the following HTML and CSS into your Preview Template editor
|
|||
}
|
||||
|
||||
#credit {
|
||||
font: italic 0.8em/12px 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif;
|
||||
font:
|
||||
italic 0.8em/12px 'Helvetica Neue',
|
||||
Arial,
|
||||
Helvetica,
|
||||
Geneva,
|
||||
sans-serif;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,12 +8,10 @@ tags:
|
|||
- photography
|
||||
---
|
||||
|
||||
[](../media/eos_50D_front.png)The successor of the EOS 40D is (almost) here: Canon [officially announced](http://www.usa.canon.com/templatedata/pressrelease/20080826_eos50d.html) the Canon EOS 50D along with the new lens Canon EF-S 18-200/3.5-5.6IS. The EOS 50D and the new lens will be both available in October 2008, Canon says.
|
||||
The successor of the EOS 40D is (almost) here: Canon [officially announced](http://www.usa.canon.com/templatedata/pressrelease/20080826_eos50d.html) the Canon EOS 50D along with the new lens Canon EF-S 18-200/3.5-5.6IS. The EOS 50D and the new lens will be both available in October 2008, Canon says.
|
||||
|
||||
The EOS 50D comes with an CMOS APS-C sized sensor (crop factor 1.6) with 15.1 megapixels. Being Canons first DSLR with the new DIGIC 4 image processor the EOS 50D can burst 6.3 shots per second with improved image quality.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
The "EOS Integrated Cleaning Systems" gets a new fluorine layer and now works in three steps to clean the sensor. With 35 metering zones and 9 cross type Autofocus zones the Autofocus specifications are the same as found in the EOS 40D.
|
||||
|
||||
[](../media/eos_50D_back.png)The basic ISO range goes from 100 - 3200 while those values can be "boosted" to ISO 6400 and 12800. The integrated noise reduction can be adjusted in four grades. The LCD display is now 3 inches big with 920,000 pixels (VGA) with a Live View Mode.
|
||||
|
|
|
|||
|
|
@ -13,11 +13,8 @@ redirect_from:
|
|||
- /2008/12/how-to-set-a-custom-gravatar-image-in-wordpress-27/
|
||||
---
|
||||
|
||||
|
||||
Sure enough I've upgraded immediately when [Wordpress 2.7 was released](http://wordpress.org/development/2008/12/coltrane/). Among all the other things that changed in this new version the comments functions got a massive overhaul. But the [new comment loop](http://codex.wordpress.org/Migrating_Plugins_and_Themes_to_2.7/Enhanced_Comment_Display#The_Comments_Loop) with the [new function `<?php wp_list_comments(); ?>`](http://codex.wordpress.org/Template_Tags/wp_list_comments) lacks the ability to quickly set a custom default gravatar or avatar image. But with some help of the functions.php file we can set the default gravatar image in the Discussion settings in the Wordpress backend.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
Before Wordpress 2.7 I achieved a custom gravatar image on kremalicious.com with this code placed in the comments.php template file:
|
||||
|
||||
```php
|
||||
|
|
|
|||
|
|
@ -10,10 +10,9 @@ tags:
|
|||
- wordpress
|
||||
---
|
||||
|
||||
|
||||
Since my update to Wordpress 2.7 I'm pretty much into all the new comments stuff. As [I've written before](http://www.kremalicious.com/2008/12/how-to-set-a-custom-gravatar-image-in-wordpress-27/), the comment functionality changed dramatically with Wordpress 2.7. This makes writing a comments template much easier but if you used Worpress prior to 2.7 you have to change some things to work again. Beside other things this includes [Gravatar styling](http://www.kremalicious.com/2008/12/how-to-set-a-custom-gravatar-image-in-wordpress-27/) and also adding different styling to comments from the author of an article. In this article I will show you how to realize the latter with Wordpress 2.7 and above.
|
||||
Since my update to Wordpress 2.7 I'm pretty much into all the new comments stuff. As [I've written before](http://www.kremalicious.com/2008/12/how-to-set-a-custom-gravatar-image-in-wordpress-27/), the comment functionality changed dramatically with Wordpress 2.7. This makes writing a comments template much easier but if you used Worpress prior to 2.7 you have to change some things to work again.
|
||||
|
||||
<!-- more -->
|
||||
Beside other things this includes [Gravatar styling](http://www.kremalicious.com/2008/12/how-to-set-a-custom-gravatar-image-in-wordpress-27/) and also adding different styling to comments from the author of an article. In this article I will show you how to realize the latter with Wordpress 2.7 and above.
|
||||
|
||||
Let's start by looking at the code to achieve styling of author comments prior to Wordpress 2.7. On kremalicious.com I've used this code:
|
||||
|
||||
|
|
|
|||
|
|
@ -12,13 +12,14 @@ tags:
|
|||
- wordpress
|
||||
---
|
||||
|
||||
Ever wanted to include those sharing links to social or bookmarking sites so users can easily submit your content to these sites in a Wordpress site or any other platform?
|
||||
|
||||
|
||||
Ever wanted to include those sharing links to social or bookmarking sites so users can easily submit your content to these sites in a Wordpress site or any other platform? Then you might have experienced a rather time consuming search odyssey to get those links. But fear no more! In this article I've provided a huge collection of all the links to your favorite social sites compiled in two handy Coda Clip files in a plain and a Wordpress version. And the non-Coda users can download an html file with all the links included.
|
||||
|
||||
Then you might have experienced a rather time consuming search odyssey to get those links. But fear no more! In this article I've provided a huge collection of all the links to your favorite social sites compiled in two handy Coda Clip files in a plain and a Wordpress version. And the non-Coda users can download an html file with all the links included.
|
||||
|
||||
Additionally you'll find a huge list within this article with the separated links in two versions for each site. And finally I've put together a quick tutorial for using buttons or icons with these links. This way you can easily add content submit/sharing links to your sites in no time.
|
||||
|
||||
<!-- more -->
|
||||
|
||||
## Share Links Coda Clips Download
|
||||
|
||||
Also all links are plain html code and therefore the non-JavaScript versions of the various social sites' submit capabilities. While most social/bookmark sites have some kind of tool section where they explain the use of their API near all of them want you to use JavaScript to access their API and submit your content to them through the use of a link on your website.
|
||||
|
|
|
|||
|
|
@ -13,9 +13,9 @@ tags:
|
|||
- wallpaper
|
||||
---
|
||||
|
||||
It [has been revealed](http://www.theverge.com/2012/8/3/3218846/schiller-forstall-fight-club-day-three-apple-samsung-trial/in/2971889) the original iPhone was developed in a locked down building under the name "Project Purple". Because of the secrecy involved, the team decorated the building with [Fight Club](http://www.imdb.com/title/tt0137523/) references. If you don't think this demands a wallpaper, you're weird.
|
||||
It [has been revealed](http://www.theverge.com/2012/8/3/3218846/schiller-forstall-fight-club-day-three-apple-samsung-trial/in/2971889) the original iPhone was developed in a locked down building under the name "Project Purple".
|
||||
|
||||
<!-- more -->
|
||||
Because of the secrecy involved, the team decorated the building with [Fight Club](http://www.imdb.com/title/tt0137523/) references. If you don't think this demands a wallpaper, you're weird.
|
||||
|
||||
> Forstall said that "on the front door of the Purple Dorm we put a sign up that said 'Fight Club'... because the first rule of that project was to not talk about it outside those doors."
|
||||
|
||||
|
|
|
|||
|
|
@ -1,27 +0,0 @@
|
|||
import React, { ReactElement } from 'react'
|
||||
import HeadMeta, { HeadMetaProps } from '../components/core/HeadMeta'
|
||||
import Page from '../../components/layouts/Page'
|
||||
import styles from './404.module.css'
|
||||
|
||||
const meta: Partial<HeadMetaProps> = {
|
||||
title: `I'm sorry Dave`,
|
||||
description: `I'm afraid I can't do that`
|
||||
}
|
||||
|
||||
const NotFound = (): ReactElement => (
|
||||
<Page title={meta.title}>
|
||||
<div className={styles.hal9000} />
|
||||
|
||||
<div className={styles.wrapper}>
|
||||
<h1 className={styles.title}>{meta.title}</h1>{' '}
|
||||
<p className={styles.text}>{meta.description}</p>
|
||||
<a href={'/'}>Back to homepage</a>
|
||||
</div>
|
||||
</Page>
|
||||
)
|
||||
|
||||
export default NotFound
|
||||
|
||||
export function Head(props: PageProps) {
|
||||
return <HeadMeta {...meta} slug={props.location.pathname} />
|
||||
}
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
import { getCollection, type CollectionEntry } from 'astro:content'
|
||||
import { slugifyAll } from './slugify'
|
||||
|
||||
export function getSortedPosts(
|
||||
posts: CollectionEntry<'articles' | 'links' | 'photos'>[]
|
||||
|
|
@ -16,7 +17,7 @@ export function getPostsByTag(
|
|||
posts: CollectionEntry<'articles' | 'links' | 'photos'>[],
|
||||
tag: string
|
||||
) {
|
||||
return posts.filter((post) => slugifyAll(post.data.tags).includes(tag))
|
||||
return posts.filter((post) => slugifyAll(post.data.tags || []).includes(tag))
|
||||
}
|
||||
|
||||
export default getPostsByTag
|
||||
|
|
|
|||
28
src/lib/remark-lead-paragraph.mjs
Normal file
28
src/lib/remark-lead-paragraph.mjs
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
export function remarkLeadParagraph() {
|
||||
return function (tree, file) {
|
||||
// run only on articles
|
||||
if (!file.history[0].includes('articles')) return
|
||||
|
||||
let lead = ''
|
||||
|
||||
// Extract and concatenate the first paragraph's text
|
||||
const paragraphChilds = tree.children.filter(
|
||||
(child) => child.type === 'paragraph'
|
||||
)[0].children
|
||||
|
||||
lead = paragraphChilds
|
||||
.map((child) =>
|
||||
child.type === 'link'
|
||||
? `<a href="${child.url}">${child.children[0].value}</a>`
|
||||
: child.value
|
||||
)
|
||||
.join('')
|
||||
|
||||
// Remove the paragraph from the tree
|
||||
// TODO: guarantee that the first children is actually the lead
|
||||
tree.children.splice(0, 1)
|
||||
|
||||
// Add lead to frontmatter
|
||||
file.data.astro.frontmatter.lead = lead.toString()
|
||||
}
|
||||
}
|
||||
|
|
@ -1,11 +1,9 @@
|
|||
import { slug as slugger } from 'github-slugger'
|
||||
import type { PostFrontmatter } from '@content/_schemas'
|
||||
import slugify from 'slugify'
|
||||
// import type { PostFrontmatter } from '@content/_schemas'
|
||||
|
||||
export const slugifyStr = (str: string) => slugger(str)
|
||||
// const slugify = (post: PostFrontmatter) =>
|
||||
// post.slug ? slugger(post.slug) : slugger(post.title)
|
||||
|
||||
const slugify = (post: PostFrontmatter) =>
|
||||
post.slug ? slugger(post.slug) : slugger(post.title)
|
||||
|
||||
export const slugifyAll = (arr: string[]) => arr.map((str) => slugifyStr(str))
|
||||
export const slugifyAll = (arr: string[]) => arr.map((str) => slugify(str))
|
||||
|
||||
export default slugify
|
||||
|
|
|
|||
|
|
@ -0,0 +1,97 @@
|
|||
---
|
||||
const title = `I'm sorry Dave`
|
||||
const description = `I'm afraid I can't do that`
|
||||
---
|
||||
|
||||
<style>
|
||||
.wrapper {
|
||||
text-align: center;
|
||||
margin-bottom: calc(var(--spacer) * 4);
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: var(--font-size-h3);
|
||||
margin-top: 0;
|
||||
margin-bottom: calc(var(--spacer) / 4);
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: var(--font-size-base);
|
||||
color: var(--brand-grey-light);
|
||||
}
|
||||
|
||||
/* HAL needs a size */
|
||||
:root {
|
||||
--hal-size: 72px;
|
||||
}
|
||||
|
||||
.hal9000 {
|
||||
width: var(--hal-size);
|
||||
height: var(--hal-size);
|
||||
border-radius: var(--hal-size);
|
||||
background: #444;
|
||||
padding: 1.5em;
|
||||
margin: var(--spacer) auto;
|
||||
position: relative;
|
||||
border: 4px solid #ccc;
|
||||
box-shadow: inset 0 0 10px #000;
|
||||
}
|
||||
|
||||
/* // eye */
|
||||
.hal9000::before {
|
||||
content: '';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 100%;
|
||||
display: block;
|
||||
background: red;
|
||||
box-shadow:
|
||||
0 0 5px red,
|
||||
0 0 10px red,
|
||||
0 0 15px red,
|
||||
0 0 20px red,
|
||||
0 0 25px red,
|
||||
0 0 30px red,
|
||||
0 0 40px red;
|
||||
animation: halpulse 7s infinite;
|
||||
}
|
||||
|
||||
/* // gloss */
|
||||
.hal9000::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: var(--hal-size);
|
||||
height: var(--hal-size);
|
||||
border-radius: var(--hal-size);
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-image: linear-gradient(
|
||||
135deg,
|
||||
rgba(255 255 255 / 7%) 0%,
|
||||
rgba(255 255 255 / 7%) 40%,
|
||||
rgba(255 255 255 / 0%) 41%
|
||||
);
|
||||
}
|
||||
|
||||
@keyframes halpulse {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="hal9000"></div>
|
||||
|
||||
<div class="wrapper">
|
||||
<h1 class="title">{title}</h1>{' '}
|
||||
<p class="text">{description}</p>
|
||||
<a href={'/'}>Back to homepage</a>
|
||||
</div>
|
||||
|
|
@ -21,9 +21,9 @@ export async function getStaticPaths() {
|
|||
}
|
||||
|
||||
const { entry } = Astro.props
|
||||
const { Content } = await entry.render()
|
||||
const { Content, remarkPluginFrontmatter } = await entry.render()
|
||||
---
|
||||
|
||||
<LayoutPost {...entry}>
|
||||
<LayoutPost {...entry} lead={remarkPluginFrontmatter.lead}>
|
||||
<Content />
|
||||
</LayoutPost>
|
||||
|
|
|
|||
|
|
@ -1,82 +0,0 @@
|
|||
.wrapper {
|
||||
text-align: center;
|
||||
margin-bottom: calc(var(--spacer) * 4);
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: var(--font-size-h3);
|
||||
margin-top: 0;
|
||||
margin-bottom: calc(var(--spacer) / 4);
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: var(--font-size-base);
|
||||
color: var(--brand-grey-light);
|
||||
}
|
||||
|
||||
/* HAL needs a size */
|
||||
:root {
|
||||
--hal-size: 72px;
|
||||
}
|
||||
|
||||
.hal9000 {
|
||||
width: var(--hal-size);
|
||||
height: var(--hal-size);
|
||||
border-radius: var(--hal-size);
|
||||
background: #444;
|
||||
padding: 1.5em;
|
||||
margin: var(--spacer) auto;
|
||||
position: relative;
|
||||
border: 4px solid #ccc;
|
||||
box-shadow: inset 0 0 10px #000;
|
||||
}
|
||||
|
||||
/* // eye */
|
||||
.hal9000::before {
|
||||
content: '';
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 100%;
|
||||
display: block;
|
||||
background: red;
|
||||
box-shadow:
|
||||
0 0 5px red,
|
||||
0 0 10px red,
|
||||
0 0 15px red,
|
||||
0 0 20px red,
|
||||
0 0 25px red,
|
||||
0 0 30px red,
|
||||
0 0 40px red;
|
||||
animation: halpulse 7s infinite;
|
||||
}
|
||||
|
||||
/* // gloss */
|
||||
.hal9000::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: var(--hal-size);
|
||||
height: var(--hal-size);
|
||||
border-radius: var(--hal-size);
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-image: linear-gradient(
|
||||
135deg,
|
||||
rgba(255 255 255 / 7%) 0%,
|
||||
rgba(255 255 255 / 7%) 40%,
|
||||
rgba(255 255 255 / 0%) 41%
|
||||
);
|
||||
}
|
||||
|
||||
@keyframes halpulse {
|
||||
0% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
import React from 'react'
|
||||
import { render } from '@testing-library/react'
|
||||
import NotFound from '../../gatsby/404'
|
||||
|
||||
describe('/404', () => {
|
||||
it('renders without crashing', () => {
|
||||
const { container } = render(
|
||||
// @ts-expect-error: only testing first render
|
||||
<NotFound location={{ pathname: '/tags' } as any} />
|
||||
)
|
||||
expect(container.firstChild).toBeInTheDocument()
|
||||
})
|
||||
})
|
||||
|
|
@ -1,12 +0,0 @@
|
|||
import React from 'react'
|
||||
import { render } from '@testing-library/react'
|
||||
import data from '../../../.config/jest/__fixtures__/home.json'
|
||||
import Home from '../../gatsby/index'
|
||||
|
||||
describe('/', () => {
|
||||
it('renders without crashing', () => {
|
||||
// @ts-expect-error: only testing first render
|
||||
const { container } = render(<Home data={data as any} />)
|
||||
expect(container.firstChild).toBeInTheDocument()
|
||||
})
|
||||
})
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
import React from 'react'
|
||||
import { render } from '@testing-library/react'
|
||||
import Tags from '../../gatsby/tags'
|
||||
|
||||
describe('/tags', () => {
|
||||
const data = {
|
||||
allMarkdownRemark: {
|
||||
group: [
|
||||
{ fieldValue: 'android', totalCount: 2 },
|
||||
{ fieldValue: 'aperture', totalCount: 18 }
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
it('renders without crashing', () => {
|
||||
const { container } = render(
|
||||
// @ts-expect-error: only testing first render
|
||||
<Tags data={data} location={{ pathname: '/tags' } as any} />
|
||||
)
|
||||
expect(container.firstChild).toBeInTheDocument()
|
||||
})
|
||||
})
|
||||
Loading…
Reference in New Issue
Block a user